Add emoji to posts list

themes/hello-friend-ng/assets/scss/_list.scss

@@ -73,6 +73,11 @@
         align-items: baseline;
         padding: 12px 0;
         text-decoration: none;
+        position: relative;
+
+        &:hover .post-emoji {
+          opacity: 1;
+        }
       }
     }
 
@@ -81,5 +86,13 @@
       margin-left: 1em;
       @include dimmed;
     }
+
+    &-emoji {
+      position: absolute;
+      left: -1.5em;
+      line-height: 1.8em;
+      opacity: 0;
+      transition: opacity 0.2s ease-in-out;
+    }
   }
 }

themes/hello-friend-ng/layouts/_default/list.html

@@ -16,6 +16,7 @@
                     {{ range .Pages }}
                         <li class="post-item">
                             <a href="{{.Permalink}}">
+                                {{ if .Params.emoji }}<span class="post-emoji">{{ .Params.emoji }}</span>{{ end }}
                                 <span class="post-title">{{ if .Title }}{{.Title}}{{ else }}<i>Untitled post</i>{{ end }}</span>
                                 <span class="post-day">
                                     {{ if .Site.Params.dateformShort }}