moved CSS rules so that link lists and ul look identical; adjusted header

src/routes/+layout.svelte

@@ -131,6 +131,9 @@
             --font-size-h3: 1.3rem;
             --font-size-h4: 1.2rem;
 
+            --margin-header-top: 16px;
+            --margin-header-bottom: 8px;
+
             /* page sizing */
             --page-width: 1000px;
             --screen-width-mobile: 800px;
@@ -181,27 +184,6 @@
             margin: 12px 0;
             font-weight: 400;
         }
-        ul {
-            padding: 0;
-        }
-
-        li::before {
-            content: "–";
-            font-weight: 900;
-            color: var(--color-highlight);
-            padding-right: 8px;
-        }
-        li {
-            display: flex;
-            padding-left: 0;
-            margin-top: 4px;
-            margin-bottom: 4px;
-            transition: background-color 0.2s ease-in-out;
-            padding: 2px 12px;
-        }
-        li a {
-            display: inline;
-        }
 
         /* #region Headers */
         /* All headers */
@@ -209,8 +191,8 @@
             font-weight: 700;
             font-family: var(--font-mono);
             color: var(--color-highlight);
-            margin-top: 16px;
-            margin-bottom: 8px;
+            margin-top: var(--margin-header-top);
+            margin-bottom: var(--margin-header-bottom);
             width: fit-content;
         }
 
@@ -259,6 +241,7 @@
             height: 1px;
             border: none;
             border-top: 2px dashed var(--color-highlight);
+            margin: 8px 0;
         }
 
         code, .code-block {
@@ -342,59 +325,58 @@
             );
         }
 
-        .project-subtitle {
-            color: var(--color-highlight);
-            font-weight: 700;
-            font-style: italic;
-            margin-top: 0;
-            font-family: var(--font-mono);
-        }
-
-        .project-banner-container {
-            position: relative;
-            width: 80%;
-            margin-left: auto;
-            margin-right: auto;
-            display: flex;
-        }
-        
-        .project-banner {
-            margin: 0; /* reset left/right margins */
-            width: 100%;
-        }
-
-        .project-icon {
-            float: left;
-            margin: 16px 16px 16px 0;
-            width: 20%;
-        }
-
-        .project-date {
-            font-size: 1rem;
-            font-weight: 700;
-            line-height: 1rem;
-            width: fit-content;
-            margin: 0;
-            padding: 0;
-            
-            color: var(--color-text-dark);
-            background-color: var(--color-highlight);
-            font-family: var(--font-stylised);
-            padding: 4px;
-        }
-
-        .project-date-embed {
-            position: absolute;
-            left: 0;
-            bottom: 0;
-        }
-
         .pixelated-img {
             image-rendering: pixelated;
         }
+        
+        /* #region Lists (ul and LinkList) */
+        .list, ul {
+            display: flex;
+            flex-direction: column;
+            padding: 0;
+        }
+
+        .list a, li {
+            width: 100%;
+            /* transition: color 0.1s ease-in-out; */
+            margin: 0;
+            padding: 4px 0;
+            list-style-type: none;
+        }
+        .list a::before, li::before {
+            content: "–";
+            font-family: var(--font-mono);
+            font-weight: bold;
+            color: var(--color-highlight);
+            margin: 0 4px 0 12px;
+        }
+        li::before {
+            padding-right: 8px;
+        }
+        .list a:hover::before {
+            content: ">";
+        }
+        .list a:link, .list a:visited, li {
+            color: var(--color-text);
+            text-decoration: none;
+        }
+        .list a:hover {
+            color: var(--color-highlight);
+        }
+
+        .list img {
+            filter: var(--color-text-img);
+            margin-top: 4px;
+            margin-bottom: -4px;
+            width: fit-content !important;
+            margin-left: 0;
+            margin-right: 0;
+            display: inline;
+        }
+        /* #endregion */
 
         @media screen and (max-width: 800px) {
-            h1 {
+            /* h1 {
                 font-size: 2.3rem;
                 line-height: 2.4rem;
             }
@@ -412,7 +394,7 @@
             h4, h5, h6 {
                 font-size: 1.4rem;
                 line-height: 1.4rem;
-            }
+            } */
 
             /* p, span, li, pre, a {
             } */