Use spaced classes

source/articles/archive.html.twig

@@ -10,9 +10,9 @@ use: [posts]
 {% endblock %}
 
 {% block content %}
-    <ul class="list-reset -mt-4 -mx-4">
+    <ul class="list-reset -mt-4 -mx-4 spaced-y-4">
         {% for post in data.posts %}
-            <li class="p-4 mb-6 {{ post.draft ? 'bg-blue-lighter' }}">
+            <li class="p-4 {{ post.draft ? 'bg-blue-lighter' }}">
                 {% include 'blog/post-summary' %}
             </li>
         {% endfor %}

source/articles/index.html.twig

@@ -3,11 +3,13 @@ layout: default
 title: Articles
 use: [posts]
 ---
-{% for post in data.posts if post.favourite %}
-    <div class="mb-10">
-        {% include 'blog/post-summary' %}
-    </div>
-{% endfor %}
+<div class="mb-10 spaced-y-10">
+    {% for post in data.posts if post.favourite %}
+        <div>
+            {% include 'blog/post-summary' %}
+        </div>
+    {% endfor %}
+</div>
 
 <div class="markup">
     <a href="/articles/archive">Archive</a>