From 4a647e854f443aedb7cbaeafb1edf25fd3792370 Mon Sep 17 00:00:00 2001
From: Eryn Wells <eryn@erynwells.me>
Date: Sun, 2 Apr 2023 10:05:29 -0700
Subject: [PATCH] Very roughly implement a 3 column grid on the <main> element

---
 assets/styles/page.css                   | 15 +++++++++++++++
 assets/styles/photos.css                 |  1 +
 assets/styles/root.css                   |  5 -----
 layouts/partials/resources/type_css.html |  9 +++++++++
 layouts/partials/single_styles.html      |  3 +++
 5 files changed, 28 insertions(+), 5 deletions(-)
 create mode 100644 assets/styles/page.css
 create mode 100644 layouts/partials/resources/type_css.html

diff --git a/assets/styles/page.css b/assets/styles/page.css
new file mode 100644
index 0000000..12bf56f
--- /dev/null
+++ b/assets/styles/page.css
@@ -0,0 +1,15 @@
+/* Eryn Wells <eryn@erynwells.me> */
+
+@layer template {
+
+main {
+    display: grid;
+    gap: var(--body-item-spacing) 0;
+    grid-template-columns: var(--body-item-spacing) var(--content-width) var(--body-item-spacing);
+    margin: var(--body-item-spacing) auto 0 auto;
+}
+main > * {
+    grid-column: 2 / 3;
+}
+
+}
diff --git a/assets/styles/photos.css b/assets/styles/photos.css
index aed5539..cc3e874 100644
--- a/assets/styles/photos.css
+++ b/assets/styles/photos.css
@@ -94,6 +94,7 @@
 
 .photos.page > figure.carousel {
     position: relative;
+    grid-column: 1 / 4;
     max-width: 100%;
     width: 100%;
 }
diff --git a/assets/styles/root.css b/assets/styles/root.css
index f6c49f9..cea755a 100644
--- a/assets/styles/root.css
+++ b/assets/styles/root.css
@@ -384,16 +384,11 @@ img.circular {
 main {
     box-sizing: border-box;
     max-width: calc(var(--content-width) + 2 * var(--body-item-spacing));
-    margin: var(--body-item-spacing) auto;
-    padding-inline: var(--body-item-spacing);
     width: 100%;
 }
 
-main > :first-child,
 main > article > :first-child { margin-block-start: 0; }
-main > :not(:last-child),
 main > article > :not(:last-child) { margin-block-end: var(--body-item-spacing); }
-main > :last-child,
 main > article > :last-child { margin-block-end: 0; }
 
 nav.bulleted > li:first-child::before {
diff --git a/layouts/partials/resources/type_css.html b/layouts/partials/resources/type_css.html
new file mode 100644
index 0000000..0c6b4be
--- /dev/null
+++ b/layouts/partials/resources/type_css.html
@@ -0,0 +1,9 @@
+{{ $typeCSS := dict }}
+{{ $stylesheet := "" }}
+{{ if not .IsHome }}
+  {{ $stylesheet = printf "styles/%s.css" .Kind }}
+  {{ with resources.Get $stylesheet }}
+    {{ $typeCSS = . | fingerprint "md5" }}
+  {{ end }}
+{{ end }}
+{{ return $typeCSS }}
diff --git a/layouts/partials/single_styles.html b/layouts/partials/single_styles.html
index dc636b4..9a10695 100644
--- a/layouts/partials/single_styles.html
+++ b/layouts/partials/single_styles.html
@@ -1,3 +1,6 @@
+{{ with resources.Get "styles/page.css" | fingerprint "md5" }}
+<link rel="stylesheet" href="{{ .RelPermalink }}">
+{{ end }}
 {{- range .Resources.Match "*.css" -}}
 {{- $stylesheet := . | fingerprint "md5" }}
 <link rel="stylesheet" href="{{ $stylesheet.RelPermalink }}">