add: post image uploads (supporter)

crates/app/src/public/css/style.css

@@ -317,6 +317,60 @@ img.emoji {
     aspect-ratio: 1 / 1;
 }
 
+.media_gallery {
+    display: grid;
+    grid-auto-columns: 1fr 1fr;
+    grid-auto-flow: column dense;
+    border-radius: var(--radius);
+    width: fit-content;
+    max-width: 100%;
+}
+
+@media screen and (max-width: 900px) {
+    .media_gallery {
+        grid-auto-flow: row dense;
+    }
+}
+
+.media_gallery img {
+    border-radius: var(--radius);
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+    cursor: pointer;
+    transition: filter 0.15s;
+}
+
+.media_gallery img:hover {
+    filter: brightness(80%);
+}
+
+.lightbox {
+    position: absolute;
+    z-index: 9999;
+    background: hsla(0, 0%, 0%, 50%);
+    backdrop-filter: blur(5px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100dvw;
+    height: 100dvh;
+    top: 0;
+    left: 0;
+}
+
+.lightbox_exit {
+    top: 1rem;
+    right: 1rem;
+    position: absolute;
+}
+
+.lightbox img {
+    box-shadow: var(--shadow-x-offset) var(--shadow-y-offset) var(--shadow-size)
+        var(--color-shadow);
+    border-radius: var(--radius);
+}
+
 /* avatar/banner */
 .avatar {
     --size: 50px;
@@ -802,7 +856,7 @@ nav .button:not(.title):not(.active):hover {
         top: unset;
     }
 
-    body {
+    #page {
         padding-bottom: 72px;
     }