3 files changed, 34 insertions, 30 deletions

diff --git a/src/mixins/post.pug b/src/mixins/post.pug
index 4ec7614..472cab2 100644
--- a/src/mixins/post.pug
+++ b/src/mixins/post.pug
@@ -47,7 +47,7 @@ mixin post(p, currentUrl)
               img(src=url onclick=onclick)
             else if isPostVideo(p)
               - var decodedVideos = decodePostVideoUrls(p)
-              video(autoplay="" muted="" data-dashjs-player="" onclick=`toggleDetails('${p.id}')` poster=decodedVideos[4] width="100px" height="100px")
+              video(autoplay="" playsinline="" muted="" data-dashjs-player="" onclick=`toggleDetails('${p.id}')` poster=decodedVideos[4] width="100px" height="100px")
                 // Scrubber
                 source(src=decodedVideos[3])
             else if isPostLink(p)
diff --git a/src/public/styles.css b/src/public/styles.css
index bc0e1ec..deaf63d 100644
--- a/src/public/styles.css
+++ b/src/public/styles.css
@@ -11,9 +11,9 @@
   --link-visited-color: #999;
   --accent: var(--link-color);
   --error-text-color: red;
-  --border-radius-card: 8px;
-  --border-radius-media: 6px;
-  --border-radius-preview: 4px;
+  --border-radius-card: 4vmin;
+  --border-radius-media: 3vmin;
+  --border-radius-preview: 2vmin;
 
   font-family: Inter, sans-serif;
   font-feature-settings: 'ss01' 1, 'kern' 1, 'liga' 1, 'cv05' 1, 'dlig' 1, 'ss01' 1, 'ss07' 1, 'ss08' 1;
@@ -302,6 +302,15 @@ summary::before {
   object-fit: fill;
 }
 
+.image-viewer.main-content img,
+.image-viewer.main-content video {
+  max-height: 70vh;
+}
+
+.image-viewer.main-content a {
+  margin: unset;
+}
+
 .image-viewer a:has(img) {
   font-size: 0rem;
   padding: unset;
@@ -311,7 +320,8 @@ summary::before {
 .image-viewer a {
   font-size: 1.5rem;
   text-decoration: none;
-  padding: 1rem;
+  padding: unset;
+  margin: 1rem;
 }
 
 .media-maximized {
@@ -415,7 +425,7 @@ form {
   }
   .image-viewer a {
     font-size: 1rem;
-    margin: 0.5rem;
+    margin: 1rem;
     padding: initial;
   }
   .self-text.card {
@@ -613,13 +623,6 @@ details:not([open]) summary::before {
   padding-right: 10px;
 }
 
-details.compact {
-  /*
-  display: flex;
-  flex-basis: 100%;
-  */
-}
-
 .footer {
   padding-bottom: 40px;
 }
diff --git a/src/views/comments.pug b/src/views/comments.pug
index 1caf65a..1265609 100644
--- a/src/views/comments.pug
+++ b/src/views/comments.pug
@@ -47,23 +47,24 @@ html
         h2.post-title
           != post.title
 
-        if isPostGallery(post)
-          div.gallery
-            each item in postGalleryItems(post)
-              div.gallery-item
-                div.gallery-item-idx
-                  | #{`${item.idx}/${item.total}`}
-                a(href=`/media/${item.url}`)
-                  img(src=item.url loading="lazy")
-        else if isPostImage(post)
-          a(href=`/media/${post.url}`)
-            img(src=post.url).post-media
-        else if isPostVideo(post)
-          - var url = post.secure_media.reddit_video.dash_url
-          video(controls data-dashjs-player src=`${url}`).post-media
-        else if isPostLink(post)
-          a(href=post.url)
-            | #{post.url}
+        div.image-viewer.main-content
+          if isPostGallery(post)
+            div.gallery
+              each item in postGalleryItems(post)
+                div.gallery-item
+                  a(href=`/media/${item.url}`)
+                    img(src=item.url loading="lazy")
+                  div.gallery-item-idx
+                    | #{`${item.idx}/${item.total}`}
+          else if isPostImage(post)
+            a(href=`/media/${post.url}`)
+              img(src=post.url).post-media
+          else if isPostVideo(post)
+            - var url = post.secure_media.reddit_video.dash_url
+            video(controls data-dashjs-player src=`${url}`).post-media
+          else if isPostLink(post)
+            a(href=post.url)
+              | #{post.domain} ↗
 
         if post.selftext_html
           div.self-text