From 414391ce09a70e75341df44424419db692550976 Mon Sep 17 00:00:00 2001
From: Robert Kaussow <mail@geeklabor.de>
Date: Sat, 29 Jan 2022 14:38:08 +0100
Subject: [PATCH] feat: add taxonomy list template (#172)

---
 layouts/_default/list.html     |  8 ++++--
 layouts/_default/single.html   | 16 +++++------
 layouts/_default/taxonomy.html | 49 ++++++++++++++++++++++++++++++++++
 layouts/partials/metadata.html | 14 +++++-----
 src/icons/star.svg             |  5 ++++
 src/icons/tag.svg              |  5 ++++
 src/sass/_base.scss            | 34 +++++++++--------------
 7 files changed, 91 insertions(+), 40 deletions(-)
 create mode 100644 layouts/_default/taxonomy.html
 create mode 100644 src/icons/star.svg
 create mode 100644 src/icons/tag.svg

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 7c6844f..61ff6ed 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -8,7 +8,9 @@
   {{ range $paginator.Pages }}
     <article class="gblog-post">
       <header class="gblog-post__header">
-        <h1><a href="{{ .RelPermalink }}">{{ partial "title" . }}</a></h1>
+        <h1 class="gblog-post__title">
+          <a href="{{ .RelPermalink }}">{{ partial "title" . }}</a>
+        </h1>
       </header>
 
       <section class="gblog-markdown">
@@ -28,7 +30,9 @@
       </div>
 
       <footer class="gblog-post__footer">
-        {{ partial "metadata.html" . }}
+        <div class="flex flex-wrap align-center gblog-post__meta">
+          {{ partial "metadata.html" . }}
+        </div>
       </footer>
     </article>
   {{ end }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 4bf0654..08090b1 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -16,16 +16,14 @@
       {{ end }}
 
 
-      <h1>{{ partial "title" . }}</h1>
-    </header>
-
-    {{ if or (eq .Type (default "posts" .Site.Params.GeekblogContentSection)) (eq .Type "post") }}
-      <div class="gblog-post__meta">
-        {{ partial "metadata.html" . }}
-      </div>
-    {{ end }}
-
+      <h1 class="gblog-post__title">{{ partial "title" . }}</h1>
 
+      {{ if or (eq .Type (default "posts" .Site.Params.GeekblogContentSection)) (eq .Type "post") }}
+        <div class="flex flex-wrap align-center gblog-post__meta gblog-post__meta--head">
+          {{ partial "metadata.html" . }}
+        </div>
+      {{ end }}
+    </header>
     <section class="gblog-markdown">
       {{ partial "content" . }}
     </section>
diff --git a/layouts/_default/taxonomy.html b/layouts/_default/taxonomy.html
new file mode 100644
index 0000000..46bb48e
--- /dev/null
+++ b/layouts/_default/taxonomy.html
@@ -0,0 +1,49 @@
+{{ define "main" }}
+  {{ $paginator := .Paginate .Paginator.Pages }}
+  {{ range $paginator.Pages.ByTitle }}
+    <article class="gblog-post">
+      <header class="gblog-post__header">
+        <h1 class="gblog-post__title">
+          <a href="{{ .RelPermalink }}">{{ partial "title" . }}</a>
+        </h1>
+      </header>
+
+      <footer class="gblog-post__meta flex align-center">
+        <span class="flex align-center no-wrap">
+          {{ $pageCount := len .Pages }}
+          <svg class="icon gblog_tag"><use xlink:href="#gblog_tag"></use></svg>
+          <span class="gblog-post__tag">
+            {{ $pageCount }}
+            post{{ if ne $pageCount 1 }}s{{ end }}
+          </span>
+        </span>
+
+        <span class="flex align-center no-wrap">
+          <svg class="icon gblog_star"><use xlink:href="#gblog_star"></use></svg>
+          <span>
+            {{ $latet := index .Pages.ByDate 0 }}
+            {{ with $latet }}
+              <a href="{{ .RelPermalink }}">{{ partial "title" . }}</a>
+            {{ end }}
+            <i>by</i>
+            {{ $ac := 0 }}
+            {{ with $latet.Params.authors }}
+              {{ range sort . }}
+                {{ $author := index $.Site.Data.authors . }}
+                {{ with $.Site.GetPage (printf "/authors/%s" . | urlize) }}
+                  {{ if eq $ac 0 }}
+                    {{ template "post-author" dict "name" $author.name "page" . }}
+                  {{ else }}
+                    {{ template "post-author" dict "name" $author.name "page" . }}
+                  {{ end }}
+                {{ end }}
+                {{ $ac = (add $ac 1) }}
+              {{ end }}
+            {{ end }}
+          </span>
+        </span>
+      </footer>
+    </article>
+  {{ end }}
+  {{ partial "pagination.html" . }}
+{{ end }}
diff --git a/layouts/partials/metadata.html b/layouts/partials/metadata.html
index fa1b01f..cc14149 100644
--- a/layouts/partials/metadata.html
+++ b/layouts/partials/metadata.html
@@ -1,4 +1,4 @@
-<span class="no-wrap">
+<span class="flex align-center no-wrap">
   <svg class="icon gblog_date"><use xlink:href="#gblog_date"></use></svg>
   <span class="gblog-post__tag">
     <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}">
@@ -10,13 +10,13 @@
   </span>
 </span>
 
-<span class="no-wrap">
+<span class="flex align-center no-wrap">
   <svg class="icon gblog_timer"><use xlink:href="#gblog_timer"></use></svg>
   <span class="gblog-post__tag">{{ .ReadingTime }} min read</span>
 </span>
 
 {{ if eq .Params.weight 1 }}
-  <span class="no-wrap">
+  <span class="flex align-center no-wrap">
     <svg class="icon gblog_pin"><use xlink:href="#gblog_pin"></use></svg>
     <span class="gblog-post__tag">Pinned</span>
   </span>
@@ -28,7 +28,7 @@
     {{ $author := index $.Site.Data.authors . }}
     {{ with $.Site.GetPage (printf "/authors/%s" . | urlize) }}
       {{ if eq $ac 0 }}
-        <span class="no-wrap">
+        <span class="flex align-center no-wrap">
           <svg class="icon gblog_person"><use xlink:href="#gblog_person"></use></svg>
           {{ template "post-author" dict "name" $author.name "page" . }}
         </span>
@@ -46,7 +46,7 @@
     {{ $name := . }}
     {{ with $.Site.GetPage (printf "/tags/%s" $name | urlize) }}
       {{ if eq $tc 0 }}
-        <span class="no-wrap">
+        <span class="flex align-center no-wrap">
           <svg class="icon gblog_bookmark"><use xlink:href="#gblog_bookmark"></use></svg>
           {{ template "post-tag" dict "name" $name "page" . }}
         </span>
@@ -59,7 +59,7 @@
 {{ end }}
 
 {{ define "post-tag" }}
-  <span class="gblog-post__tag gblog-button">
+  <span class="gblog-post__tag gblog-button gblog-button--regular">
     <a
       class="gblog-button__link"
       href="{{ .page.RelPermalink }}"
@@ -71,7 +71,7 @@
 {{ end }}
 
 {{ define "post-author" }}
-  <span class="gblog-post__tag gblog-button">
+  <span class="gblog-post__tag gblog-button gblog-button--regular">
     <a class="gblog-button__link" href="{{ .page.RelPermalink }}" title="All posts of this author">
       {{ .name }}
     </a>
diff --git a/src/icons/star.svg b/src/icons/star.svg
new file mode 100644
index 0000000..aa5bacd
--- /dev/null
+++ b/src/icons/star.svg
@@ -0,0 +1,5 @@
+<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 28 28">
+<title>star</title>
+<path d="M14 22.052l-8.676 5.258 2.3-9.859-7.624-6.638 10.056-0.854 3.944-9.267 3.944 9.267 10.056 0.854-7.624 6.638 2.3 9.859z"></path>
+</svg>
diff --git a/src/icons/tag.svg b/src/icons/tag.svg
new file mode 100644
index 0000000..9cbcdc4
--- /dev/null
+++ b/src/icons/tag.svg
@@ -0,0 +1,5 @@
+<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 28 28">
+<title>tag</title>
+<path d="M17.52 17.52v-7.041h-7.041v7.041h7.041zM28 10.479h-7.041v7.041h7.041v3.439h-7.041v7.041h-3.439v-7.041h-7.041v7.041h-3.439v-7.041h-7.041v-3.439h7.041v-7.041h-7.041v-3.439h7.041v-7.041h3.439v7.041h7.041v-7.041h3.439v7.041h7.041v3.439z"></path>
+</svg>
diff --git a/src/sass/_base.scss b/src/sass/_base.scss
index f3426e6..92b3eae 100644
--- a/src/sass/_base.scss
+++ b/src/sass/_base.scss
@@ -291,10 +291,8 @@ img {
   border-top: $border-2 dashed var(--accent-color-dark);
   padding: $padding-32 0;
 
-  &__header {
-    h1 {
-      margin-top: 0;
-    }
+  &__title {
+    margin-top: 0;
 
     a,
     a:visited {
@@ -327,18 +325,6 @@ img {
     }
   }
 
-  &__tag {
-    margin: $padding-4 0 !important;
-
-    .gblog-button__link {
-      padding: $padding-4 $padding-8;
-
-      &:hover {
-        background: none;
-      }
-    }
-  }
-
   &__anchorwrap {
     &:hover .gblog-post__anchor .icon {
       color: var(--control-icons);
@@ -401,14 +387,10 @@ img {
   }
 
   &__meta {
-    padding-bottom: $padding-16;
-
-    .icon {
-      font-size: 1.2em;
+    span:first-child .icon {
+      margin-left: -5px;
     }
-  }
 
-  &__footer {
     :not(:first-child).no-wrap {
       margin-left: $padding-8;
     }
@@ -416,6 +398,14 @@ img {
     .icon {
       font-size: 1.2em;
     }
+
+    .gblog-button {
+      margin-left: $padding-4;
+    }
+
+    &--head {
+      padding-bottom: $padding-16;
+    }
   }
 
   &__figure {