1 files changed, 37 insertions, 56 deletions

diff --git a/src/mixins/post.pug b/src/mixins/post.pug
index c4f3bc5..30310a8 100644
--- a/src/mixins/post.pug
+++ b/src/mixins/post.pug
@@ -28,77 +28,58 @@ mixin post(p, currentUrl)
             |  · 
             a(href=`/comments/${p.id}?from=${from}&sort=${sortQuery}&view=${viewQuery}`) #{fmtnum (p.num_comments)} ↩
         if (query.view == "card" && !isPostGallery(p) && !isPostImage(p) && !isPostVideo(p) && p.selftext_html)
-          div.self-text-overflow(class='card')
-            if query.view == "card" && (p.spoiler || p.over_18)
+          div.self-text-overflow.card
+            if p.spoiler || p.over_18
               div.spoiler(id=`spoiler_${p.id}`, onclick=`javascript:document.getElementById('spoiler_${p.id}').style.display = 'none';`)
                 h2
                   != p.over_18 ? 'nsfw' : 'spoiler'
-            div.self-text(class='card')
+            div.self-text.card
               != convertInlineImageLinks(p.selftext_html)
-      div.media-preview(class=`${query.view}`)
-        - var onclick = query.view != "card" ? `toggleDetails('${p.id}')` : ``
+      if query.view != "card"
+        div.media-preview
+          - var onclick = `toggleDetails('${p.id}')`
+          if isPostGallery(p)
+            - var item = (p.over_18 ? `/nsfw.svg` : p.spoiler ? `/spoiler.svg` : postGalleryItems(p)[0].url)
+            img(src=item onclick=onclick) 
+          else if isPostImage(p)
+            - var url = postThumbnail(p)
+            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")
+              // Scrubber
+              source(src=decodedVideos[3])
+          else if isPostLink(p)
+            a(href=p.url)
+              | ↗
+
+    details(id=`${p.id}` open=(query.view == "card" && (isPostGallery(p) || isPostImage(p) || isPostVideo(p))))
+      summary.expand-post expand media
+      div.image-viewer
         if query.view == "card" && (p.spoiler || p.over_18) && (isPostGallery(p) || isPostImage(p) || isPostVideo(p))
           div.spoiler(id=`spoiler_${p.id}`, onclick=`javascript:document.getElementById('spoiler_${p.id}').style.display = 'none';`) 
             h2
               != p.over_18 ? 'nsfw' : 'spoiler'
         if isPostGallery(p)
-          - var item = postGalleryItems(p)[0]
-          if query.view == "card"
-            div.gallery(class=`${query.view}`)
-              each item in postGalleryItems(p)
-                div.gallery-item(class=`${query.view}`)
-                  a(href=`/media/${item.url}`)
-                    img(src=item.url loading="lazy")
-                  div.gallery-item-idx(class=`${query.view}`)
-                    | #{`${item.idx}/${item.total}`}
-          else
-            img(src=item.url onclick=onclick) 
+          div.gallery
+            each item in postGalleryItems(p)
+              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(p)
-          - var url = query.view == "card" ? p.url : postThumbnail(p)
-          #{query.view == "card" ? "a href=/media/" + url : span}
-            img(src=url onclick=onclick)
+          a(href=`/media/${p.url}`)
+            img(src=p.url loading="lazy")
         else if isPostVideo(p)
           - var decodedVideos = decodePostVideoUrls(p)
-          if query.view == "card"
-            video(controls="" muted="" data-dashjs-player="" preload="metadata" poster=decodedVideos[4])
+          video(controls="" muted="" data-dashjs-player="" preload="metadata" playsinline="" poster=decodedVideos[4] objectfit="contain" loading="lazy")
               // HLS
               source(src=decodedVideos[0])
               // Dash
               source(src=decodedVideos[1])
               // Fallback
               source(src=decodedVideos[2])
-          else
-            video(autoplay="" muted="" data-dashjs-player="" onclick=`toggleDetails('${p.id}')` width="100px" height="100px")
-              // Scrubber
-              source(src=decodedVideos[3])
-        else if isPostLink(p)
-          a(href=p.url)
-            if (query.view == 'card')
-              | #{p.domain} 
-            | ↗
-
-    if query.view == "compact" && (isPostGallery(p) || isPostImage(p) || isPostVideo(p))
-      details(id=`${p.id}`)
-        summary.expand-post expand media
-        div.image-viewer
-          if isPostGallery(p)
-            div.gallery
-              each item in postGalleryItems(p)
-                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(p)
-            a(href=`/media/${p.url}`)
-              img(src=p.url loading="lazy").post-media
-          else if isPostVideo(p)
-            video(controls="" muted="" data-dashjs-player="" preload="metadata" playsinline="" poster=decodedVideos[4] objectfit="contain" loading="lazy").post-media
-                //HLS
-                source(src=decodedVideos[0])
-                // Dash
-                source(src=decodedVideos[1])
-                // Fallback
-                source(src=decodedVideos[2])
-          button(onclick=`toggleDetails('${p.id}')`)
-              | close
+      if (query.view == "compact")
+        button(onclick=`toggleDetails('${p.id}')`)
+            | close