improves layout responsiveness for article list

layouts/_default/taxonomy.html

@@ -1,6 +1,6 @@
 {{ define "main" }}
 <header class="my-8">
-  <p class="text-center font-iosevka">Topic</p>
+  <p class="text-center font-iosevka capitalize">{{ .Data.Singular }}</p>
   <h1 class="text-4xl font-bold text-center capitalize">{{ .Title }}</h1>
 </header>
 <main class="container mx-auto">
@@ -9,15 +9,19 @@
   </ul>
   
   <section>
-    <h2 class="text-4xl my-8 font-iosevka text-center">Other Topics</h2>
+    <h2 class="text-4xl my-8 font-bold text-center">Other {{ .Data.Plural | title }}</h2>
-    <div class="tag-cloud font-iosevka text-gray-600">
+    <div class="tag-cloud font-iosevka text-gray-600 text-center">
-      {{ $tags := .Site.Taxonomies.tags }}
+      {{ $terms := index .Site.Taxonomies .Data.Plural }}
-      {{ range $tag, $pages := $tags }}
+      {{ range $term, $pages := $terms }}
-      <a href="{{ "/tags/" | relLangURL }}{{ $tag | urlize }}" style="font-size: {{ add 1 (div (len $pages) 2) }}em;"
+        {{ if ne $term $.Title }}
-        class="tag text-sm inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap">
+        {{ with $.Site.GetPage (printf "/%s/%s" $.Data.Plural ($term | urlize)) }}
-        {{ $tag }}
+        <a href="{{ .RelPermalink }}" 
+           class="tag inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap">
+          {{ .Title }}
         </a>
         {{ end }}
+        {{ end }}
+      {{ end }}
     </div>
   </section>
 </main>

layouts/articles/single.html

@@ -6,13 +6,23 @@
 
       <div class="flex gap-4">
         <aside class="lg:sticky lg:top-0 lg:h-screen lg:overflow-y-auto lg:w-1/3 p-4 font-iosevka">
-          <p class="text-3xl font-light mb-4">
+          <p><strong>Date:</strong> <time datetime="{{ .Date.Format " 2006-01-02" }}">{{ .Date.Format "January 2, 2006" }}</time></p>
-            <time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "January 2, 2006" }}</time>
+          <p><strong>Narrator:</strong> <a href="{{ "/narrator/" | relLangURL }}{{ .Params.narrator | urlize }}">{{ .Params.narrator }}</a></p>
-          </p>
+          <p><strong>Facilitator:</strong> <a href="{{ "/facilitator/" | relLangURL }}{{ .Params.facilitator | urlize }}">{{ .Params.facilitator }}</a></p>
-          <p><strong>Narrator:</strong> {{ .Params.narrator }}</p>
-          <p><strong>Facilitator:</strong> {{ .Params.facilitator }}</p>
           <p><strong>Subject:</strong> {{ .Params.subject }}</p>
-          <p><strong>Tags:</strong> {{ partial "tags.html" . }}</p>
+          <p><strong>Topics:</strong> {{ partial "tags.html" . }}</p>
+          {{ if .Params.links }}
+            <div class="mt-4">
+              <p><strong>Narrator Links:</strong></p>
+              <ul class="list-disc pl-4 ml-4 mt-2">
+                {{ range .Params.links }}
+                  <li class="mb-2">
+                    <a href="{{ .url }}" target="_blank" rel="noopener noreferrer">{{ .text }} <sup>↗</sup></a>
+                  </li>
+                {{ end }}
+              </ul>
+            </div>
+          {{ end }}
         </aside>
         <div class="prose lg:prose-xl lg:w-2/3 p-4">
           <p class="font-bold text-4xl">{{ partial "article-title" . }}</p>

layouts/facilitator/term.html

@@ -1,28 +0,0 @@
-{{ define "main" }}
-<header class="my-8">
-  <p class="text-center font-iosevka">Facilitator</p>
-  <h1 class="text-4xl font-bold text-center capitalize">{{ .Title }}</h1>
-</header>
-<main class="container mx-auto">
-  <ul class="mt-4 space-y-4">
-    {{ $pages := .Pages }}
-    {{ partial "article-list.html" (dict "Pages" $pages) }}
-  </ul>
-  
-  {{ if gt .Site.Taxonomies.facilitator 1 }}
-  <section>
-    <h2 class="text-4xl my-8 font-iosevka text-center">Other Facilitators</h2>
-    <div class="tag-cloud font-iosevka text-gray-600">
-      {{ range $facilitator, $pages := .Site.Taxonomies.facilitator }}
-        {{ if ne $facilitator $.Title }}
-        <a href="{{ "/facilitator/" | relLangURL }}{{ $facilitator | urlize }}"
-           class="tag text-sm inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap">
-          {{ $facilitator }}
-        </a>
-        {{ end }}
-      {{ end }}
-    </div>
-  </section>
-  {{ end }}
-</main>
-{{ end }}

layouts/index.html

@@ -7,32 +7,12 @@
   <aside class="max-w-prose w-1/4 flex flex-col gap-8 mb-8">
 
     <section>
-      <h2 class="text-4xl mb-4 font-iosevka">About</h2>
+      <h2 class="text-2xl mb-4 font-bold">About</h2>
       {{ .Content }}
     </section>
 
     <section>
-      <h2 class="text-4xl mb-4 font-iosevka">Narrators</h2>
+      <h2 class="text-2xl mb-4 font-bold">Topics</h2>
-      <div class="tag-cloud font-iosevka text-gray-600">
-        {{ $narrators := slice }}
-        {{ range .Site.RegularPages }}
-          {{ with .Params.narrator }}
-            {{ $narrators = $narrators | append . }}
-          {{ end }}
-        {{ end }}
-        {{ $narrators = $narrators | uniq | sort }}
-        {{ range $narrator := $narrators }}
-          <a href="{{ "/narrator/" | relLangURL }}{{ $narrator | urlize }}"
-            class="tag inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap"
-            style="font-size: 1rem;">
-            {{ $narrator }}
-          </a>
-        {{ end }}
-      </div>
-    </section>
-
-    <section>
-      <h2 class="text-4xl mb-4 font-iosevka">Topics</h2>
       <div class="tag-cloud font-iosevka text-gray-600 text-sm">
         {{ $tags := .Site.Taxonomies.tags }}
         {{ range $tag, $pages := $tags }}

layouts/narrator/term.html

@@ -1,25 +0,0 @@
-{{ define "main" }}
-<header class="my-8">
-  <p class="text-center font-iosevka">Narrator</p>
-  <h1 class="text-4xl font-bold text-center capitalize">{{ .Title }}</h1>
-</header>
-<main class="container mx-auto">
-  <ul class="mt-4 space-y-4">
-    {{ $pages := .Pages }}
-    {{ partial "article-list.html" (dict "Pages" $pages) }}
-  </ul>
-  
-  <section>
-    <h2 class="text-4xl my-8 font-iosevka text-center">Other Narrators</h2>
-    <div class="tag-cloud font-iosevka text-gray-600 text-center">
-      {{ $narrators := .Site.Taxonomies.narrator }}
-      {{ range $narrator, $pages := $narrators }}
-      <a href="{{ "/narrator/" | relLangURL }}{{ $narrator | urlize }}" 
-         class="tag inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap">
-        {{ $narrator| humanize }}
-      </a>
-      {{ end }}
-    </div>
-  </section>
-</main>
-{{ end }}

layouts/partials/article-list.html

@@ -5,13 +5,13 @@
     {{- $page = .page -}}
 {{- end -}}
 <li class="flex gap-4 items-center">
-  <a class="flex-grow" href="{{ $page.RelPermalink }}">{{ partial "article-wompum.html" $page }}</a>
+  <a class="flex-1 min-w-0" href="{{ $page.RelPermalink }}">{{ partial "article-wompum.html" $page }}</a>
-  <time class="text-gray-800 font-iosevka" datetime="{{ $page.Date.Format "2006-01-02" }}">
+  <time class="text-gray-800 font-iosevka w-12 flex-shrink-0" datetime="{{ $page.Date.Format "2006-01-02" }}">
     <p>{{ $page.Date.Format "Jan" }}</p>
     <p>{{ $page.Date.Format "02" }}</p>
     <p>{{ $page.Date.Format "2006" }}</p>
   </time>
-  <div class="flex-shrink-0 max-w-max">
+  <div class="w-3/5 flex-shrink-0">
     <a class="text-2xl font-bold hover:text-green-900 underline" href="{{ $page.RelPermalink }}">{{ partial "article-title" $page }}</a>
     <p class="max-w-prose">{{ $page.Params.summary }}</p>
     {{ partial "tags.html" $page }}

layouts/partials/facilitator-list.html

@@ -1,5 +1,5 @@
 <section>
-  <h2 class="text-4xl mb-4 font-iosevka">Facilitators</h2>
+  <h2 class="text-4xl mb-4">Facilitators</h2>
   <div class="tag-cloud font-iosevka text-gray-600">
     {{ $facilitators := slice }}
     {{ range .Site.RegularPages }}

layouts/partials/related-articles.html

@@ -29,7 +29,7 @@
 
 {{- if gt (len $finalArticles) 0 -}}
 <div class="related-articles flex flex-col gap-4">
-    <h2 class="title text-3xl">Related Articles</h2>
+    <h2 class="title text-3xl font-bold">Related Articles</h2>
     <ul class="flex flex-col gap-4 w-full">
       {{ partial "article-list" (dict "Pages" $finalArticles) }}
     </ul>

layouts/partials/tags.html

@@ -1,5 +1,5 @@
 {{- if .Params.tags }}
-<div class="flex flex-wrap gap-2 my-2 text-xs">
+<div class="flex flex-wrap gap-2 my-2 text-xs font-iosevka">
   {{- range .Params.tags }}
   <a href="{{ "tags/" | relURL }}{{ . | urlize }}"
     class="px-3 py-1 border border-green-100 hover:bg-green-300 text-green-900 rounded no-underline">