Base adjustments

assets/css/screen.css

@@ -51,7 +51,6 @@ html,
     margin: 0 auto;
 }
 
-
 .gh-head-actions a {
     display: inline-flex;
     align-items: center;
@@ -72,9 +71,37 @@ html,
     height: 2rem;
 }
 
-/* Post header
+/* Index
 /* ---------------------------------------------------------- */
 
+.post-card {
+    margin: 0 0 4vw;
+}
+
+.post-card-link {
+    display: flex;
+    justify-content: space-between;
+}
+
+.post-card-image {
+    margin-left: 4vw;
+    width: 300px;
+    height: 200px;
+    object-fit: cover;
+}
+
+
+/* Post
+/* ---------------------------------------------------------- */
+
+.gh-header {
+    padding: 0 0 4vw 0;
+}
+
+.gh-title {
+    margin-top: 4vw;
+}
+
 .gh-image {
     grid-column: full-start / full-end;
     width: 100%;

partials/post-card.hbs

@@ -5,6 +5,9 @@ Re-usable card for linking to posts
 <article class="post-card {{post_class}} {{#if feature_image}}with-image{{else}}no-image{{/if}}">
     <a class="post-card-link" href="{{url}}">
         <div class="post-card-content">
+            <h2 class="post-card-title">{{title}}</h2>
+            <p>{{excerpt}}</p>
+        </div>
         {{#if feature_image}}
             <img class="post-card-image"
                 srcset="{{img_url feature_image size="s"}} 300w,
@@ -16,8 +19,5 @@ Re-usable card for linking to posts
                 alt="{{title}}"
             />
         {{/if}}
-            <h2 class="post-card-title">{{title}}</h2>
-            <p>{{excerpt}}</p>
-        </div>
     </a>
 </article>