From 090eef5beed32303f782784cd7e59d33c46a4516 Mon Sep 17 00:00:00 2001
From: Eryn Wells <eryn@erynwells.me>
Date: Sat, 30 Sep 2023 11:06:30 -0700
Subject: [PATCH] Fix the alignment of the post title <h1>

---
 assets/styles/root/002_columns.css          | 30 +++++++++------------
 assets/styles/root/050_typography.css       |  4 ++-
 content/test/index.md                       | 22 +++++++--------
 layouts/partials/content_header.html        | 11 ++++++--
 layouts/partials/development/draft_tag.html |  2 +-
 5 files changed, 37 insertions(+), 32 deletions(-)

diff --git a/assets/styles/root/002_columns.css b/assets/styles/root/002_columns.css
index 126acde..4626806 100644
--- a/assets/styles/root/002_columns.css
+++ b/assets/styles/root/002_columns.css
@@ -114,14 +114,6 @@
     grid-column: content-start / content-end;
   }
 
-  header > span.series {
-    margin-inline-start: 0.5em;
-  }
-
-  header > span.series::before {
-    margin-inline-end: 0.25em;
-  }
-
   img {
     height: auto;
     max-width: 100%;
@@ -143,6 +135,18 @@
     grid-column: wide-content-start / wide-content-end;
   }
 
+  main > header > span.series {
+    margin-inline-start: 0.5em;
+  }
+
+  main > header > span.series::before {
+    margin-inline-end: 0.25em;
+  }
+
+  main > :is(h1, h2, h3, h4, h5, h6):not(:first-child) {
+      padding-block-start: 0.5em;
+  }
+
   nav.bulleted>li:first-child::before {
     margin-inline: 0;
   }
@@ -171,7 +175,7 @@
     margin-inline-start: 0;
     margin-block-start: calc(var(--body-item-spacing) / 2);
   }
-
+  
   table {
     border-collapse: collapse;
     margin-inline: auto;
@@ -258,14 +262,6 @@
     grid-column: content-start / content-end;
   }
 
-  .page > header > :is(h1, h2, h3, h4, h5, h6) {
-    grid-column: 1;
-  }
-
-  .page > header > time {
-    grid-column: 2;
-  }
-
   .page > article > * {
     grid-column: gutter-start / gutter-end;
   }
diff --git a/assets/styles/root/050_typography.css b/assets/styles/root/050_typography.css
index 56d5ad7..5487b7b 100644
--- a/assets/styles/root/050_typography.css
+++ b/assets/styles/root/050_typography.css
@@ -152,7 +152,9 @@
         font-weight: normal;
     }
 
-    p { line-height: var(--line-height); }
+    p {
+        line-height: var(--line-height);
+    }
 
 
     .title {
diff --git a/content/test/index.md b/content/test/index.md
index a0aa50c..2d121ca 100644
--- a/content/test/index.md
+++ b/content/test/index.md
@@ -12,7 +12,7 @@ tags: ["Test A", "Test B", "テスト"]
 toc: open
 ---
 
-# Body Text
+## Body Text
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
 incididunt ut labore et dolore `magna aliqua`. Interdum velit laoreet id donec
@@ -31,7 +31,7 @@ interdum varius sit amet mattis vulputate enim. Eget nunc lobortis mattis
 aliquam faucibus purus in massa. Amet consectetur adipiscing elit ut aliquam
 purus sit. Tincidunt dui ut ornare lectus sit amet est.
 
-# Code Highlighting
+## Code Highlighting
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
 incididunt ut labore et dolore `magna aliqua`.
@@ -58,7 +58,7 @@ int main(int argc, char *argv[])
 Amet consectetur adipiscing elit ut aliquam purus sit. Tincidunt dui ut ornare
 lectus sit amet est.
 
-# Figures
+## Figures
 
 Iaculis nunc sed augue lacus viverra vitae congue. Non curabitur gravida arcu
 ac. Viverra orci sagittis eu volutpat odio facilisis mauris sit. Scelerisque in
@@ -107,7 +107,7 @@ faucibus nisl tincidunt. Lectus vestibulum mattis ullamcorper velit sed
 ullamcorper morbi tincidunt. Tellus elementum sagittis vitae et leo duis. Nunc
 sed id semper risus in hendrerit gravida.
 
-# Block Quotes
+## Block Quotes
 
 Here's a block quote:
 
@@ -122,7 +122,7 @@ Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Sem viverra
 aliquet eget sit amet tellus cras adipiscing enim. Libero nunc consequat
 interdum varius sit amet mattis vulputate enim.
 
-# Lists
+## Lists
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
 incididunt ut labore et dolore `magna aliqua`. Interdum velit laoreet id donec
@@ -158,30 +158,30 @@ Great! Here's a nested list:
 
 Woah!
 
-# Headers
+## Headers
 
 Here are some headers.
 
-# H1
+### H3
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
 incididunt ut labore et dolore `magna aliqua`. Interdum velit laoreet id donec
 ultrices. Augue eget arcu dictum varius duis at consectetur lorem donec. Donec
 ac odio tempor orci dapibus ultrices.
 
-## H2
+#### H4
 
 Et leo duis ut diam. Pellentesque id nibh tortor id aliquet lectus. Ac orci
 `phasellus` egestas tellus rutrum tellus pellentesque eu. Amet commodo nulla
 facilisi nullam vehicula ipsum.
 
-### H3
+##### H5
 
 Posuere urna nec tincidunt praesent semper feugiat nibh. Phasellus vestibulum
 lorem sed risus. Consequat semper viverra nam libero justo laoreet sit amet
 cursus.
 
-#### H4
+###### H6
 
 Ipsum dolor sit amet consectetur adipiscing elit. Molestie ac feugiat sed lectus
 vestibulum mattis ullamcorper velit. Sem viverra aliquet eget sit amet tellus
@@ -190,7 +190,7 @@ vulputate enim. Eget nunc lobortis mattis aliquam faucibus purus in massa. Amet
 consectetur adipiscing elit ut aliquam purus sit. Tincidunt dui ut ornare lectus
 sit amet est.
 
-# {{< ruby Japanese ja >}}日本語{{< /ruby >}}
+## {{< ruby Japanese ja >}}日本語{{< /ruby >}}
 
 Here's some text in {{< ruby Japanese ja >}}日本語{{< /ruby >}} with {{< ruby
 furigana ja >}}ふりがな{{< /ruby >}}.
diff --git a/layouts/partials/content_header.html b/layouts/partials/content_header.html
index 868d0be..93877a7 100644
--- a/layouts/partials/content_header.html
+++ b/layouts/partials/content_header.html
@@ -1,16 +1,23 @@
 <header>
-  {{ partial "development/draft_tag.html" . }}
   <h1>{{ .Title }}</h1>
+
   {{ if and (not (eq .Section "about")) .Date }}
     <time>{{ .Date | time.Format "January 2, 2006" }}</time>
   {{ end }}
+
   {{- if .Params.series -}}
     {{- $series := .GetTerms "series" -}}
+
     {{- if gt (len $series) 1 -}}
       {{- errorf "More than one series for %s" .Permalink -}}
     {{- end -}}
+
     {{- with index $series 0 -}}
-      <span class="series"><a href="{{ .Permalink }}">{{ .Title }}</a></span>
+      <span class="series">
+        <a href="{{ .Permalink }}">{{ .Title }}</a>
+      </span>
     {{- end -}}
   {{- end -}}
+
+  {{ partial "development/draft_tag.html" . }}
 </header>
diff --git a/layouts/partials/development/draft_tag.html b/layouts/partials/development/draft_tag.html
index ee7f673..d12573e 100644
--- a/layouts/partials/development/draft_tag.html
+++ b/layouts/partials/development/draft_tag.html
@@ -1 +1 @@
-{{ if .Draft }}<span class="draft">d</span>{{ end }}
+{{ if .Draft }}<span class="draft">draft</span>{{ end }}