From 46233756de783b304d079ce3d91a9ce27b9bdd4d Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Tue, 30 May 2023 17:31:07 +0200
Subject: [PATCH] use emojis for engagements

---
 _includes/head.html |  6 +++---
 _layouts/post.html  |  6 +++---
 assets/main.scss    | 14 ++------------
 3 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/_includes/head.html b/_includes/head.html
index 13401c3..e16b7c9 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -101,7 +101,7 @@
             );
             document.getElementById(
               "page-replies"
-            ).innerHTML = `• ${replies.length} replies`;
+            ).innerHTML = `• 💬 ${replies.length}`;
 
             // render to replies section
             const repliesTable = document.createElement("table");
@@ -134,7 +134,7 @@
           if (likes.length)
             document.getElementById(
               "page-likes"
-            ).innerHTML = `• ${likes.length} likes`;
+            ).innerHTML = `• 👍 ${likes.length}`;
 
           const reposts = mentions.filter(
             (m) => m["wm-property"] === "repost-of"
@@ -142,7 +142,7 @@
           if (reposts.length)
             document.getElementById(
               "page-reposts"
-            ).innerHTML = `• ${reposts.length} reposts`;
+            ).innerHTML = `• 🔁 ${reposts.length}`;
         })
         .catch((err) => console.log("err", err));
     }
diff --git a/_layouts/post.html b/_layouts/post.html
index 7c3d832..2863662 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -30,9 +30,9 @@ layout: default
           default: "%b %-d, %Y" %} {{ page.date | date: date_format }}
           </span>
         </time>
-      <span id="page-replies"></span>
-      <span id="page-likes"></span>
-      <span id="page-reposts"></span>
+      <span class="blog-post__header__meta__engagement" id="page-replies"></span>
+      <span  class="blog-post__header__meta__engagement" id="page-likes"></span>
+      <span  class="blog-post__header__meta__engagement" id="page-reposts"></span>
     </div>
     {% if page.image %}
       <img
diff --git a/assets/main.scss b/assets/main.scss
index 68dc3bb..36879b2 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -332,11 +332,7 @@ table.image caption {
 
     &__meta {
       font-size: small;
-      margin: 10px 0 10px;
-
-      &__author {
-        font-weight: bold;
-      }
+      margin: 0.5em 0;
     }
 
     &__image {
@@ -441,7 +437,7 @@ table.image caption {
   }
   &__replies {
     margin: 1em 0;
-
+    max-width: fit-content;
     .reply-block {
       display: block;
       margin: 0 0 1em;
@@ -512,12 +508,6 @@ table.image caption {
   }
 }
 
-@media not all and (min-resolution: 0.001dpcm) {
-  .jumbotron {
-    display: none;
-  }
-}
-
 @media only screen and (min-width: 0px) and (max-width: 350px) {
   div.subscription-message-div {
     display: none !important;