From c2f112a41b20b0327c5db4d3880855c16207b49c Mon Sep 17 00:00:00 2001
From: Devin Haska <wonderfulfrog@users.noreply.github.com>
Date: Thu, 22 Feb 2024 11:32:31 -0800
Subject: [PATCH] feat: reorg layouts and pages

---
 src/_includes/macros/date.njk                 |  2 +-
 src/_layouts/book.html                        | 24 +++------------
 src/_layouts/catalogue-item.html              | 30 +++++++++++++++++++
 .../catalogue-type.html}                      |  0
 src/_layouts/catalogue.html                   | 27 +++++++++--------
 src/_layouts/comic.html                       |  7 +++++
 src/_layouts/game.html                        | 19 +++---------
 src/_layouts/podcast.html                     | 28 +++++------------
 src/_layouts/post.html                        |  4 +--
 src/{content/pages => _layouts}/tag.html      |  0
 src/{content/pages => _layouts}/tags.html     |  0
 .../victoria-ortiz-dissenter-on-the-bench.md  |  1 +
 src/content/catalogue/catalogue.json          |  4 ++-
 src/content/catalogue/comics/comics.json      |  2 +-
 .../catalogue/comics/monstress-image-1.md     |  2 +-
 .../monstress-the-blood-image-comics-2.md     |  2 +-
 .../comics/the-monster-sisters-orca-books.md  |  2 +-
 src/content/catalogue/games/her-story.md      |  2 +-
 src/content/pages/books.html                  |  6 ----
 src/content/pages/catalogue.html              | 19 ------------
 src/css/blocks/catalogue.css                  | 10 +++----
 src/css/blocks/categories.css                 | 19 ++++--------
 src/{content/pages => }/robots.njk            |  0
 src/{content/pages => }/rss.njk               |  0
 src/{content/pages => }/sitemap.njk           |  0
 25 files changed, 91 insertions(+), 119 deletions(-)
 create mode 100644 src/_layouts/catalogue-item.html
 rename src/{content/catalogue/catalogueType.html => _layouts/catalogue-type.html} (100%)
 create mode 100644 src/_layouts/comic.html
 rename src/{content/pages => _layouts}/tag.html (100%)
 rename src/{content/pages => _layouts}/tags.html (100%)
 delete mode 100644 src/content/pages/books.html
 delete mode 100644 src/content/pages/catalogue.html
 rename src/{content/pages => }/robots.njk (100%)
 rename src/{content/pages => }/rss.njk (100%)
 rename src/{content/pages => }/sitemap.njk (100%)

diff --git a/src/_includes/macros/date.njk b/src/_includes/macros/date.njk
index 648197a..be2a954 100644
--- a/src/_includes/macros/date.njk
+++ b/src/_includes/macros/date.njk
@@ -1,5 +1,5 @@
 {% macro format(dateString) %}
-    <time class="[ date ] [ flex items-center gap-0.5 my-1 ]" datetime="{{ date }}">
+    <time class="[ date ] [ flex items-center gap-0.5 ]" datetime="{{ date }}">
         {% include "svgs/calendar.svg" %}{{ dateString | formatDate("MMMM Do YYYY") }}
     </time>
 {% endmacro %}
diff --git a/src/_layouts/book.html b/src/_layouts/book.html
index b08cf13..3d5851f 100644
--- a/src/_layouts/book.html
+++ b/src/_layouts/book.html
@@ -1,23 +1,7 @@
 ---
-layout: base
+layout: "catalogue-item"
+eleventyComputed:
+    tertiary: "<p> <span class=\"[ text-fadeText ]\">by</span> {{ author }}</p>"
 ---
 
-{% set filteredTags = tags | filterCatalogueTags %}
-<article class="[ catalogue ] [ flow ]">
-    {% from "macros/date.njk" import format %}
-    {{ format(date) }}
-    <section class="[ catalogue-meta ] [ flow ]">
-        {% if image %}
-            {% image image, "", "" %}
-        {% endif %}
-        <h1>{{ title }}</h1>
-        {% if subtitle %}<h3 class="[ text-fadeText my-0.5 ]">{{ subtitle }}</h3>{% endif %}
-        {% if author %}
-            <p>
-                <span class="[ text-fadeText ]">by</span> {{ author }}
-            </p>
-        {% endif %}
-    </section>
-    <hr class="[ my-3 ]" />
-    {{ content | safe }}
-</article>
+{{ content | safe }}
diff --git a/src/_layouts/catalogue-item.html b/src/_layouts/catalogue-item.html
new file mode 100644
index 0000000..da5e187
--- /dev/null
+++ b/src/_layouts/catalogue-item.html
@@ -0,0 +1,30 @@
+---
+layout: base
+imageAlt: ""
+imageCaption: ""
+---
+
+{% set filteredTags = tags | filterCatalogueTags %}
+<article class="[ catalogue ] [ flow ]">
+    <div style="--flow-space: 2em">
+        {% block image %}
+            {% if image %}
+                {% image image, imageAlt, imageCaption %}
+            {% endif %}
+        {% endblock %}
+    </div>
+    <section class="[ catalogue-meta ] [ flow ]">
+        {% block title %}<h1>{{ title }}</h1>{% endblock %}
+        {% block subtitle %}<h2 class="[ text-fadeText ]" style="--flow-space: 0.25em">{{ subtitle }}</h2>{% endblock %}
+        {{ tertiary | safe }}
+        {% if filteredTags | length > 0 %}
+            <ul class="[ categories list-none p-0 ] [ cluster justify-center ]">
+                {% for tag in filteredTags %}<li class="[ flex gap-0.25 ]">{{ tag }}</li>{% endfor %}
+            </ul>
+        {% endif %}
+    </section>
+    <hr class="[ my-1 ]" />
+    {% from "macros/date.njk" import format %}
+    {{ format(date) }}
+    {% block content %}{{ content | safe }}{% endblock %}
+</article>
diff --git a/src/content/catalogue/catalogueType.html b/src/_layouts/catalogue-type.html
similarity index 100%
rename from src/content/catalogue/catalogueType.html
rename to src/_layouts/catalogue-type.html
diff --git a/src/_layouts/catalogue.html b/src/_layouts/catalogue.html
index ad4aa82..fe0da8b 100644
--- a/src/_layouts/catalogue.html
+++ b/src/_layouts/catalogue.html
@@ -1,16 +1,19 @@
 ---
 layout: base
+permalink: /catalogue/index.html
+title: Catalogue
 ---
 
-<article class="[ catalogue ] [ flow ]">
-    <section class="[ catalogue-meta ] [ gap-1 mb-1 ]">
-        {% if image %}
-            {% image image, "", "" %}
-        {% endif %}
-        <div>
-            <h1>{{ title }}</h1>
-            <h2 class="[ text-fadeText ]">{{ subtitle }}</h2>
-        </div>
-    </section>
-    {{ content | safe }}
-</article>
+<h1>Catalogue</h1>
+<p>A collection of my thoughts on various forms of media that I consume.</p>
+{% set items = collections.catalogue %}
+{% set catalogueTypes = collections.catalogueByType | keys %}
+<ul class="[ cluster list-none p-0 ]" style="--gap: 0.5rem">
+    {% for type in catalogueTypes %}
+        <li>
+            <a class="[ pill ] [ flex px-1 py-0.5 gap-0.5 ]"
+               href="/catalogue/{{ type | pluralize }}">{{ type | pluralize }}<span class="[ pill-count ]">{{ collections.catalogueByType[ type ] | length }}</span></a>
+        </li>
+    {% endfor %}
+</ul>
+{% include "partials/catalogue.html" %}
diff --git a/src/_layouts/comic.html b/src/_layouts/comic.html
new file mode 100644
index 0000000..a859e51
--- /dev/null
+++ b/src/_layouts/comic.html
@@ -0,0 +1,7 @@
+---
+layout: "catalogue-item"
+eleventyComputed:
+    subtitle: "{{ author }} ({{ year }})"
+---
+
+{{ content | safe }}
diff --git a/src/_layouts/game.html b/src/_layouts/game.html
index cf2e280..cbb614f 100644
--- a/src/_layouts/game.html
+++ b/src/_layouts/game.html
@@ -1,18 +1,7 @@
 ---
-layout: base
+layout: "catalogue-item"
+eleventyComputed:
+    subtitle: "{{ year }}"
 ---
 
-{% set filteredTags = tags | filterCatalogueTags %}
-<article class="[ catalogue ] [ flow ]">
-    {% from "macros/date.njk" import format %}
-    {{ format(date) }}
-    <section class="[ catalogue-meta ] [ flow ]">
-        {% if image %}
-            {% image image, "", "" %}
-        {% endif %}
-        <h1>{{ title }}</h1>
-        <h2 class="[ text-fadeText my-0.5 ]">{{ year }}</h2>
-    </section>
-    <hr class="[ my-3 ]" />
-    {{ content | safe }}
-</article>
+{{ content | safe }}
diff --git a/src/_layouts/podcast.html b/src/_layouts/podcast.html
index 4fdfea0..ee73110 100644
--- a/src/_layouts/podcast.html
+++ b/src/_layouts/podcast.html
@@ -1,23 +1,11 @@
 ---
-layout: base
+layout: "catalogue-item"
 ---
 
-<article class="[ catalogue ] [ flow ]">
-    {% from "macros/date.njk" import format %}
-    {{ format(date) }}
-    <section class="[ catalogue-meta ] [ flow ]">
-        {% if image %}
-            {% image image, "", "" %}
-        {% endif %}
-        <h1>{{ title }}</h1>
-        {% if subtitle %}<h2 class="[ text-fadeText ]">{{ subtitle }}</h2>{% endif %}
-    </section>
-    <hr class="[ my-3 ]" />
-    {{ content | safe }}
-    <a href="{{ url }}"
-       class="[ flex mt-1 items-center gap-0.5 ]"
-       target="_blank"
-       rel="external noreferrer noopener">
-        {% include "svgs/link.svg" %}
-    Listen to the podcast</a>
-</article>
+{{ content | safe }}
+<a href="{{ url }}"
+   class="[ flex mt-1 items-center gap-0.5 ]"
+   target="_blank"
+   rel="external noreferrer noopener">
+    {% include "svgs/link.svg" %}
+Listen to the podcast</a>
diff --git a/src/_layouts/post.html b/src/_layouts/post.html
index 1c9dbb8..c994ae8 100644
--- a/src/_layouts/post.html
+++ b/src/_layouts/post.html
@@ -9,8 +9,8 @@ layout: base
         <h1>{{ title }}</h1>
         <ul class="[ categories ] [ cluster list-none p-0 ]">
             {% for tag in tags | filter(["post"]) %}
-                <li>
-                    <a class="[ flex ]" href="/tags/{{ tag | slugify }}">{{ tag }}</a>
+                <li class="[ flex gap-0.25 ]">
+                    <a href="/tags/{{ tag | slugify }}">{{ tag }}</a>
                 </li>
             {% endfor %}
         </ul>
diff --git a/src/content/pages/tag.html b/src/_layouts/tag.html
similarity index 100%
rename from src/content/pages/tag.html
rename to src/_layouts/tag.html
diff --git a/src/content/pages/tags.html b/src/_layouts/tags.html
similarity index 100%
rename from src/content/pages/tags.html
rename to src/_layouts/tags.html
diff --git a/src/content/catalogue/books/victoria-ortiz-dissenter-on-the-bench.md b/src/content/catalogue/books/victoria-ortiz-dissenter-on-the-bench.md
index 3d5a58e..1b4e4d1 100644
--- a/src/content/catalogue/books/victoria-ortiz-dissenter-on-the-bench.md
+++ b/src/content/catalogue/books/victoria-ortiz-dissenter-on-the-bench.md
@@ -1,5 +1,6 @@
 ---
 title: Dissenter on the Bench
+subtitle: Ruth Bader Ginsburg's Life & Work
 author: Victoria Ortiz
 isbn: 978054497364
 rating: 4
diff --git a/src/content/catalogue/catalogue.json b/src/content/catalogue/catalogue.json
index 1ede474..86c3ad0 100644
--- a/src/content/catalogue/catalogue.json
+++ b/src/content/catalogue/catalogue.json
@@ -1,3 +1,5 @@
 {
-  "tags": "catalogue"
+  "layout": "catalogue",
+  "tags": "catalogue",
+  "permalink": "catalogue/index.html"
 }
diff --git a/src/content/catalogue/comics/comics.json b/src/content/catalogue/comics/comics.json
index fcfe7a0..03e5d19 100644
--- a/src/content/catalogue/comics/comics.json
+++ b/src/content/catalogue/comics/comics.json
@@ -1,5 +1,5 @@
 {
-  "layout": "catalogue",
+  "layout": "comic",
   "tags": "comic",
   "permalink": "catalogue/comics/{{ page.fileSlug }}/index.html"
 }
diff --git a/src/content/catalogue/comics/monstress-image-1.md b/src/content/catalogue/comics/monstress-image-1.md
index b78600b..bdece9e 100644
--- a/src/content/catalogue/comics/monstress-image-1.md
+++ b/src/content/catalogue/comics/monstress-image-1.md
@@ -1,7 +1,7 @@
 ---
 title: "Monstress: Awakening"
 publisher: Image Comics
-subtitle: Majorie Liu, Sana Takeda
+author: Majorie Liu, Sana Takeda
 volume: 1
 year: 2017
 image: https://cdn.wonderfulfrog.com/monstress-vol-1.jpeg
diff --git a/src/content/catalogue/comics/monstress-the-blood-image-comics-2.md b/src/content/catalogue/comics/monstress-the-blood-image-comics-2.md
index 87662d2..6edbd8d 100644
--- a/src/content/catalogue/comics/monstress-the-blood-image-comics-2.md
+++ b/src/content/catalogue/comics/monstress-the-blood-image-comics-2.md
@@ -1,7 +1,7 @@
 ---
 title: "Monstress: The Blood"
 publisher: Image Comics
-subtitle: Majorie Lui, Sana Takeda
+author: Majorie Lui, Sana Takeda
 volume: 2
 year: 2017
 image: https://cdn.wonderfulfrog.com/monstress-vol-2-tp_77ea1f170a.jpg
diff --git a/src/content/catalogue/comics/the-monster-sisters-orca-books.md b/src/content/catalogue/comics/the-monster-sisters-orca-books.md
index b4ca0b6..ea64bd5 100644
--- a/src/content/catalogue/comics/the-monster-sisters-orca-books.md
+++ b/src/content/catalogue/comics/the-monster-sisters-orca-books.md
@@ -1,7 +1,7 @@
 ---
 title: "The Monster Sisters"
 publisher: "Orca Books"
-subtitle: "Gareth Gaudin"
+author: "Gareth Gaudin"
 year: 2021
 isbn: 9781459822290
 rating: 4
diff --git a/src/content/catalogue/games/her-story.md b/src/content/catalogue/games/her-story.md
index 4af937c..4373803 100644
--- a/src/content/catalogue/games/her-story.md
+++ b/src/content/catalogue/games/her-story.md
@@ -1,6 +1,6 @@
 ---
 title: Her Story
-subtitle: PC
+platform: PC
 date: 2024-01-07
 image: https://cdn.wonderfulfrog.com/Her_Story_store_art.jpg
 tags: ["pc", "narrative", "simulator"]
diff --git a/src/content/pages/books.html b/src/content/pages/books.html
deleted file mode 100644
index 4e42e79..0000000
--- a/src/content/pages/books.html
+++ /dev/null
@@ -1,6 +0,0 @@
----
-layout: base
-permalink: /books/index.html
----
-
-Books will eventually go here.
diff --git a/src/content/pages/catalogue.html b/src/content/pages/catalogue.html
deleted file mode 100644
index fe0da8b..0000000
--- a/src/content/pages/catalogue.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-layout: base
-permalink: /catalogue/index.html
-title: Catalogue
----
-
-<h1>Catalogue</h1>
-<p>A collection of my thoughts on various forms of media that I consume.</p>
-{% set items = collections.catalogue %}
-{% set catalogueTypes = collections.catalogueByType | keys %}
-<ul class="[ cluster list-none p-0 ]" style="--gap: 0.5rem">
-    {% for type in catalogueTypes %}
-        <li>
-            <a class="[ pill ] [ flex px-1 py-0.5 gap-0.5 ]"
-               href="/catalogue/{{ type | pluralize }}">{{ type | pluralize }}<span class="[ pill-count ]">{{ collections.catalogueByType[ type ] | length }}</span></a>
-        </li>
-    {% endfor %}
-</ul>
-{% include "partials/catalogue.html" %}
diff --git a/src/css/blocks/catalogue.css b/src/css/blocks/catalogue.css
index ec40698..4bb8abe 100644
--- a/src/css/blocks/catalogue.css
+++ b/src/css/blocks/catalogue.css
@@ -3,11 +3,11 @@
   border-radius: 0.5rem;
 }
 
+.catalogue source,
+.catalogue img {
+  max-width: 300px;
+}
+
 .catalogue-meta {
   text-align: center;
 }
-
-.catalogue source,
-.catalogue img {
-  max-width: 50%;
-}
diff --git a/src/css/blocks/categories.css b/src/css/blocks/categories.css
index 41ce530..180d299 100644
--- a/src/css/blocks/categories.css
+++ b/src/css/blocks/categories.css
@@ -1,23 +1,16 @@
-.categories {
-  color: var(--text-color);
-}
-
 .categories li {
-  --text-color: var(--color-fadeText);
+  color: var(--color-fadeText);
 }
 
-.categories > li > a {
-  color: var(--text-color);
-  text-decoration-color: var(--text-color);
+.categories li > a {
+  text-decoration-color: var(--color-fadeText);
 }
 
-.categories li:has(a:hover) {
-  --text-color: var(--color-primary);
+.categories li > a:hover {
+  text-decoration-color: inherit;
 }
 
-.categories > li > a::before {
+.categories li::before {
   content: "#";
-  color: var(--text-color);
   user-select: none;
-  transition: color var(--transition-duration);
 }
diff --git a/src/content/pages/robots.njk b/src/robots.njk
similarity index 100%
rename from src/content/pages/robots.njk
rename to src/robots.njk
diff --git a/src/content/pages/rss.njk b/src/rss.njk
similarity index 100%
rename from src/content/pages/rss.njk
rename to src/rss.njk
diff --git a/src/content/pages/sitemap.njk b/src/sitemap.njk
similarity index 100%
rename from src/content/pages/sitemap.njk
rename to src/sitemap.njk