Some more styling work

src/_includes/page.njk

@@ -4,7 +4,9 @@ includeFA: true
 ---
 
 <main class="wrapper-lg stack-lg">
-	<h1>{{ title }}</h1>
+	<h1 class="text-center">{{ title }}</h1>
-	{{ content | safe }}
+	<div class="wrapper-md stack-lg">
+		{{ content | safe }}
+	</div>
 </main>
 

src/_includes/post.njk

@@ -1,12 +1,15 @@
 ---
 layout: base.njk
 ---
+<main class="wrapper-md stack-lg">
+    <article class="stack-md">
+        <h1><a href="{{ post.url }}">{{ title }}</a></h1>
+        {{ content | safe }}
+    </article>
 
-<article class="wrapper-lg stack-md">
+    <div class="h-card">
-    <h1><a href="{{ post.url }}">{{ title }}</a></h1>
+        <h2>About Lewis</h2>
-    {{ content | safe }}
+        
-</article>
+        {% image metadata.author.avatar, "My face", "u-photo box circle", "150px", [150] %}
-
+    </div>
-<author class="wrapper-lg">
+</main>
-    {% image metadata.author.avatar, "My face", "box circle", "150px", [150] %}
-</author>

src/blog/index.html

@@ -6,7 +6,7 @@ pagination:
     size: 5
     reverse: true
 ---
-<main class="wrapper-lg stack-lg">
+<main class="wrapper-md stack-lg">
     <h1>Blog posts</h1>
 
     <ol class="stack-xl">

src/css/globals.css

@@ -20,6 +20,7 @@ h1 {
   font-size: var(--text-size-xl);
   word-wrap: normal;
   text-underline-offset: var(--space-size-3xs);
+  text-align: center;
 }
 
 h2 {