Merge pull request 'clean up css a bit' (#8) from css into main

Reviewed-on: #8

src/css.css

@@ -31,7 +31,7 @@
 :root {
   --bg-color: #ecdfec;
   --font-color: #333333;
-  --pre-border-color: #1a1a1a;
+  --code-border-color: #1a1a1a;
   --link-color: #2b58de;
   --link-color-visited: #6047eb;
   --header-bg-color: #E1CFE1;
@@ -40,7 +40,7 @@
   @media (prefers-color-scheme: dark) {
     --bg-color: #1f131f;
     --font-color: #cccccc;
-    --pre-border-color: #333333;
+    --code-border-color: #333333;
     --link-color: #577AE4;
     --link-color-visited: #8775EF;
     --header-bg-color: #2F1D2F;
@@ -50,6 +50,7 @@
 
 body {
   background-color: var(--bg-color);
+  margin: 0;
 }
 
 p, h1, ul, h1, h2, h3, nav, header {
@@ -57,17 +58,14 @@ p, h1, ul, h1, h2, h3, nav, header {
   font-family: atkinsonhyperlegible, Verdana, sans-serif;
 }
 
-p, ul, nav, header {
+p, ul, nav, code {
   font-size: 22px;
 }
 
 code {
   background-color: #1a1a1a;
   color: #e6e6e6;
-  font-size: 22px;
-  border-style: solid;
-  border-width: 5px;
-  border-color: var(--pre-border-color);
+  border: 5px solid var(--code-border-color);
   overflow: scroll;
   text-wrap: nowrap;
   display: block;
@@ -75,18 +73,14 @@ code {
 
 a {
   text-decoration: underline dashed;
-}
 
-a:link {
+  &:link {
     color: var(--link-color);
-}
+  }
 
-a:visited {
+  &:visited {
     color: var(--link-color-visited);
-}
-
-.center_text {
-  text-align: center;
+  }
 }
 
 #pagewrap {
@@ -102,10 +96,6 @@ a:visited {
   }
 }
 
-body {
-  margin: 0;
-}
-
 nav {
   font-family: comicmono, monospace;
   font-weight: bold;
@@ -115,12 +105,10 @@ nav {
   background-color: var(--header-bg-color);
   text-align: center;
   padding: 20px;
-  border-style: dashed;
-  border-width: 0 0 2px 0;
-  border-color: var(--header-border-color)
-}
+  border-bottom: 2px dashed var(--header-border-color);
 
-#header-div h1 {
+  & h1 {
     margin: 20px 0 0 0;
     font-size: 24px;
+  }
 }