Use flexbox for more stuff

assets/css/bobastyle.css

@@ -4,10 +4,19 @@
 
 
 /* Post layout (in list pages) */
+.list-page-content {
+  display: flex;
+  flex-direction: column;
+  gap: 40px;
+}
+
 .page-list ul,
 .series-taxonomy ul {
+  display: flex;
+  flex-direction: column;
   list-style: none;
   padding: 0;
+  gap: 40px;
 }
 
 .page-list li,
@@ -20,11 +29,6 @@
   background-color: #222;
 }
 
-.page-list li+li,
-.series-taxonomy > ul > li+li {
-  margin: 40px 0;
-}
-
 .post-title {
   margin-bottom: 10px;
 }
@@ -81,8 +85,13 @@
 
 
 /* Subsection formatting */
+.sections {
+  display: flex;
+  flex-direction: column;
+  gap: 40px;
+}
+
 .section {
-  margin-bottom: 40px;
   background-color: #222;
   border-radius: 12px;
   padding: 1px 25px;

layouts/_default/list.html

@@ -10,8 +10,9 @@
     </span>
 </h1>
 
-{{ with .Sections }}
-<div class="sections">
+<div class="list-page-content">
+    {{ with .Sections }}
+    <div class="sections">
         {{ range . }}
 
         <a class="section-anchor" href="{{ .Permalink }}">
@@ -34,10 +35,10 @@
         </a>
 
         {{ end }}
-</div>
-{{ end }}
+    </div>
+    {{ end }}
 
-<div class="page-list">
+    <div class="page-list">
         <ul>
             {{ range .Paginator.Pages }}
             <li>{{ .Render "summary" }}</li>
@@ -47,6 +48,7 @@
             </div>
             {{ end }}
         </ul>
+    </div>
 </div>
 
 {{ if gt .Paginator.TotalPages 1 }}