Add paid post indicator and fix couple of bugs

assets/css/screen.css

@@ -16,11 +16,15 @@
 .gh-head-menu,
 .gh-head-actions {
     font-size: 1.2rem;
-    font-weight: 600;
+    font-weight: 500;
     text-transform: uppercase;
     letter-spacing: 0.01em;
 }
 
+.gh-head-btn {
+    font-weight: 600;
+}
+
 .gh-head-btn svg {
     width: 16px;
     height: 16px;
@@ -164,6 +168,17 @@
     color: var(--ghost-accent-color);
 }
 
+.gh-card-meta-wrapper {
+    display: inline-flex;
+    align-items: center;
+}
+
+.gh-card-meta-wrapper svg {
+    position: relative;
+    top: -1px;
+    margin-left: 0.6rem;
+}
+
 .gh-sidebar {
     padding-left: 4rem;
     font-size: 1.4rem;
@@ -326,7 +341,7 @@
     text-transform: uppercase;
 }
 
-.gh-article-header > * {
+.gh-article:not(.no-image) .gh-article-header > * {
     grid-column: wide-start / wide-end;
 }
 

index.hbs

@@ -7,7 +7,10 @@
                 <article class="gh-latest gh-card {{post_class}}">
                     <aside class="gh-card-meta">
                         <span class="gh-card-date">Latest — <time datetime="{{date format="YYYY-MM-DD"}}">{{date}}</time></span>
-                        <span class="gh-card-duration">{{reading_time}}</span>
+                        <span class="gh-card-meta-wrapper">
+                            <span class="gh-card-duration">{{reading_time}}</span>
+                            {{> icons/star}}
+                        </span>
                     </aside>
 
                     <div class="gh-card-wrapper">

partials/icons/star.hbs

@@ -0,0 +1,3 @@
+<svg width="11" height="11" viewBox="0 0 12 12" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+    <path d="M6 1L7.545 4.13L11 4.635L8.5 7.07L9.09 10.51L6 8.885L2.91 10.51L3.5 7.07L1 4.635L4.455 4.13L6 1Z" />
+</svg>

partials/loop.hbs

@@ -9,7 +9,13 @@
         <footer class="gh-card-meta">
             <time class="gh-card-date" datetime="{{date format="YYYY-MM-DD"}}">{{date}}</time>
             —
-            <span class="gh-card-duration">{{reading_time}}</span>
+            <span class="gh-card-meta-wrapper">
+                <span class="gh-card-duration">{{reading_time}}</span>
+
+                {{^has visibility="public"}}
+                    {{> icons/star}}
+                {{/has}}
+            </span>
         </footer>
     </a>
 </article>