adjusted bottom margin of footer; images on projects page now shrink on mobile

src/lib/lists/gallery.svelte

@@ -28,11 +28,11 @@
         <img class="gallery-img" src="{entry.img}" alt="{entry.imgAlt}">
         <div class="gallery-text-container">
             {#if reverseTextOrder}
-                <p class="gallery-date">{@html entry.subtitle}</p>
+                <p class="gallery-subtitle">{@html entry.subtitle}</p>
                 <p class="gallery-title">{entry.title}</p>
             {:else}
                 <p class="gallery-title">{entry.title}</p>
-                <p class="gallery-date">{@html entry.subtitle}</p>
+                <p class="gallery-subtitle">{@html entry.subtitle}</p>
             {/if}
         </div>
     </a>
@@ -62,6 +62,7 @@
 
     .gallery-img {
         width: 145px;
+        min-width: 145px;
         height: 100%;
         margin: 0;
         object-fit: cover;
@@ -83,20 +84,20 @@
         transition: border-color 0.1s ease-out;
     }
 
-    .gallery-date, .gallery-title {
+    .gallery-title, .gallery-subtitle {
         margin: 0;
         transition: color 0.1s ease-out;
     }
 
-    .gallery-date {
-        font-size: 1.0rem;
-    }
-
     .gallery-title {
         font-family: var(--font-mono);
         font-weight: 700;
     }
 
+    .gallery-subtitle {
+        font-size: 1.0rem;
+    }
+
     .gallery-container:hover .gallery-text-container {
         border-color: var(--color-highlight);
     }
@@ -106,4 +107,21 @@
     .gallery-container:hover p {
         color: var(--color-highlight);
     }
+
+    @media screen and (max-width: 700px) {
+        .gallery-title {
+            font-size: 1.0rem;
+            line-height: 1.1rem;
+        }
+        .gallery-subtitle {
+            font-size: 0.9rem;
+            line-height: 1.1rem;
+        }
+    }
+
+    @media screen and (max-width: 500px) {
+        .gallery-subtitle {
+            display: none;
+        }
+    }
 </style>

src/lib/lists/link-list.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+    export interface LinkEntry {
+        icon?: string;
+        text: string;
+        link: string;
+    }
+
+    let {
+        entries,
+    } : {
+        entries: LinkEntry[];
+    } = $props();
+</script>
+
+{#snippet listEntry({ entry }: { entry: LinkEntry })}
+    {#if entry.icon}
+        <img height="24px" src={entry.icon} alt="Icon">
+    {/if}
+    {@html entry.text}
+{/snippet}
+
+<div class="list">
+    {#each entries as entry}
+        <a href={entry.link}>
+            {@render listEntry({entry})}
+        </a>
+    {/each}
+</div>