post-to-post pagination and a few spacing tweaks

_includes/layouts/post.njk

@@ -34,4 +34,13 @@ layout: base.njk
 
     {{ content | safe }}
   </article>
+
+  {% set olderPost = collections.posts | getPreviousCollectionItem %}
+  {% set newerPost = collections.posts | getNextCollectionItem %}
+  {% set olderHref = olderPost.url %}
+  {% set newerHref = newerPost.url %}
+  {% set olderTitle = olderPost.data.title %}
+  {% set newerTitle = newerPost.data.title %}
+  {% set inPost = true %}
+  {% include "pagination.njk" %}
 </heading-anchors>

_includes/pagination.njk

@@ -1,17 +1,17 @@
 {% if olderHref or newerHref %}
 <nav aria-label="pagination">
-  <ol class="pagination">
+  <ol class="pagination {% if inPost %}post-pagination{% endif %}">
     {% if olderHref %}
     <li class="older">
       <a href="{{ olderHref }}">
-        <i class="fa-solid fa-hand-point-left" aria-hidden="true"></i> older
+        <i class="fa-solid fa-hand-point-left" aria-hidden="true"></i> {{ olderTitle or "older" }}
       </a>
     </li>
     {% endif %}
     {% if newerHref %}
     <li class="newer">
       <a href="{{ newerHref }}">
-        newer <i class="fa-solid fa-hand-point-right" aria-hidden="true"></i>
+        {{ newerTitle or "newer" }} <i class="fa-solid fa-hand-point-right" aria-hidden="true"></i>
       </a>
     </li>
     {% endif %}

css/main.css

@@ -109,6 +109,12 @@ h3 {
 	font-size: 1.6rem;
 }
 
+@media (max-width: 650px) {
+	h1 { font-size: 2.8rem; }
+	h2 { font-size: 1.8rem; }
+	h3 { font-size: 1.35rem; }
+}
+
 h4, h5, h6 {
 	margin-top: 1rem;
 	font-size: 1.2rem;
@@ -200,7 +206,7 @@ dd {
 
 /* Blockquotes */
 blockquote {
-	margin: .5rem 1rem;
+	margin: .5rem 0;
 	padding: 0 1rem;
 	border-radius: .25rem 1rem 1rem .25rem;
 	line-height: 1.25;
@@ -232,6 +238,10 @@ th {
 	background-color: var(--color-pink);
 }
 
+th code {
+	color: var(--color-text); /* Yes, I actually do this somewhere */
+}
+
 th, td {
 	padding: .5rem;
 	text-align: left;

css/nav.css

@@ -205,6 +205,7 @@ footer ul {
 	list-style: none;
 	gap: .5rem;
 	justify-content: center;
+	margin: 0;
 }
 
 footer li {
@@ -238,16 +239,27 @@ footer a:focus-visible {
 }
 
 /* Pagination */
+.pagination,
+.pagination li {
+	margin: 0;
+}
+
 .pagination {
 	display: grid;
 	grid-template-columns: repeat(2, 1fr);
 	grid-template-areas: "older newer";
 	list-style: none;
+	margin-top: 3rem;
 }
 
-.pagination,
-.pagination li {
-	margin: 0;
+@media (max-width: 650px) {
+	.post-pagination {
+		grid-template-columns: 1fr;
+		grid-template-areas:
+			"older"
+			"newer";
+		gap: .75rem;
+	}
 }
 
 .pagination .older {