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/table-of-contents.svelte

@@ -134,5 +134,11 @@
         .toc-level-1::before, .toc-level-2::before, .toc-level-3::before {
             content: "└ ";
         }
+
+        @media screen and (max-width: 550px) {
+            .toc-container {
+                width: 95%;
+            }
+        }
     }
 </style>

src/lib/viewport/footer.svelte

@@ -90,6 +90,7 @@
         gap: 16px;
         justify-content: space-evenly;
         align-items: flex-start;
+        padding-bottom: 16px;
     }
 
     .content-box {