More work on getting blog looking good

src/blog/index.html

@@ -3,21 +3,28 @@ title: Blog
 layout: base.njk
 pagination:
     data: collections.posts
-    size: 10
+    size: 5
     reverse: true
 ---
 <main class="wrapper-lg stack-lg">
-<h1>Blog posts</h1>
+    <h1>Blog posts</h1>
 
-<ol class="stack-md">
-    {% for item in pagination.items %}
-    <li>
-        <h2><a href="{{ item.url }}">{{ item.data.title }}</a></h2>
-        <p>
-            {% set excerpt = item.page.excerpt %}
-            {% renderFile "./src/_includes/components/excerpt.md", item.page %}
-        </p>
-    </li>
-    {% endfor %}
-</ol>
+    <ol class="stack-xl">
+        {% for item in pagination.items %}
+        <li class="stack-xs">
+            <h2><a href="{{ item.url }}">{{ item.data.title }}</a></h2>
+            <time class="block">{{ item.date | dateDisplay }}</time>
+            {{ item.page.excerpt | md | safe }}
+            <a href="{{ item.url }}" class="inline-block">Read more</a>
+        </li>
+        {% endfor %}
+    </ol>
+    <nav class="blog-nav row" data-spacing="between">
+        {% if pagination.href.next %}
+            <a href="{{ pagination.href.next }}">Older</a>
+        {% endif %}
+        {% if pagination.href.previous %}
+            <a href="{{ pagination.href.previous }}">Newer</a>
+        {% endif %}
+    </nav>
 </main>