2 files changed, 37 insertions, 20 deletions

diff --git a/src/mixins/comment.pug b/src/mixins/comment.pug
index 2ec076f..3af1f53 100644
--- a/src/mixins/comment.pug
+++ b/src/mixins/comment.pug
@@ -1,24 +1,41 @@
 include ../utils
+
+mixin infoContainer(data)
+  div.comment-info-container
+    div.info-item #{fmtnum(data.ups)} ↑
+    div.info-item u/#{data.author} #{data.is_submitter ? '(OP)' : ''}
+    if data.collapsed_reason_code == "DELETED"
+      div.info-item
+        a(href=`https://undelete.pullpush.io${data.permalink}`) search on undelete
+    div.info-item #{timeDifference(Date.now(), data.created * 1000)}
+
+-
+  function hasReplies(data) {
+    return data.replies && data.replies.data && data.replies.data.children && data.replies.data.children.length > 0;
+  }
+
 mixin comment(com, isfirst)
   - var data = com.data
   - var kind = com.kind
+  - var hasReplyData = hasReplies(data)
+  
   if kind == "more"
-    div(class=`${isfirst?'first':''}`)
+    div(class=`${isfirst ? 'first' : ''}`)
       div.more #{data.count} more comments
   else
-    div(class=`comment ${isfirst?'first':''}`)
-      div.comment-info-container
-        div.info-item #{fmtnum(data.ups)} ↑ 
-        div.info-item u/#{data.author} #{data.is_submitter?'(OP)':''}
-        if data.collapsed_reason_code == "DELETED"
-          div.info-item 
-            a(href=`https://undelete.pullpush.io${data.permalink}`) search on undelete
-        div.info-item #{timeDifference(Date.now(), data.created * 1000)}
-      div.comment-body 
-        != data.body_html
-      div.replies
-      if data.replies
-        if data.replies.data
-          if data.replies.data.children
+    div(class=`comment ${isfirst ? 'first' : ''}`)
+      if hasReplyData
+        details(id=`${data.id}` open="")
+          summary.expand-comments
+            +infoContainer(data)
+          div.comment-body
+            != data.body_html
+    
+          div.replies
             each reply in data.replies.data.children
-              +comment(reply,false)
+              +comment(reply, false)
+    
+      else
+        +infoContainer(data)
+        div.comment-body
+          != data.body_html
diff --git a/src/mixins/post.pug b/src/mixins/post.pug
index 287c422..23eb19f 100644
--- a/src/mixins/post.pug
+++ b/src/mixins/post.pug
@@ -40,7 +40,7 @@ mixin post(p)
       if p.gallery_data
         if p.gallery_data.items
           details(id=`${p.id}`)
-            summary expand gallery
+            summary.expand-post expand gallery
             div.gallery
               - var total = p.gallery_data.items.length
               - var idx = 0
@@ -58,19 +58,19 @@ mixin post(p)
             button(onclick=`toggleDetails('${p.id}')`) close
     if p.post_hint == "image" && p.thumbnail && p.thumbnail != "self" && p.thumbnail != "default"
       details(id=`${p.id}`)
-        summary expand image
+        summary.expand-post expand image
         a(href=`/media/${p.url}`)
           img(src=p.url loading="lazy").post-media
         button(onclick=`toggleDetails('${p.id}')`) close
     else if p.post_hint == "hosted:video"
       details(id=`${p.id}`)
-        summary expand video
+        summary.expand-post expand video
         - var url = p.secure_media.reddit_video.dash_url
         video(src=url controls data-dashjs-player loading="lazy").post-media
         button(onclick=`toggleDetails('${p.id}')`) close
     else if !p.post_hint || (p.post_hint == "link" && p.thumbnail && p.thumbnail != "self" && p.thumbnail != "default")
       details(id=`${p.id}`)
-        summary expand link
+        summary.expand-post expand link
         a(href=`${p.url}`)
           | #{p.url}
         br