Apparence et navigation dans les taxonomies

themes/42/assets/css/keywords.css

@@ -9,4 +9,9 @@ ul.keywords {
     max-width: var(--width-content-max);
     width: 100%;
     font-size: 1rem;
+
+    li {
+        display: block;
+        white-space: nowrap;
+    }
 }

themes/42/assets/css/variables/structure.css

@@ -8,6 +8,7 @@
     --padding-hero-panel: var(--padding-panel);
     --footer-padding: var(--padding);
     --list-padding: var(--padding-double);
+    --padding-keyword: var(--padding-half);
 
     --gap: 1.5rem;
     --gap-half: 0.75rem;
@@ -40,4 +41,4 @@
 
     --grid-columns: 4;
     --width-card-min: 300px;
-}
+}

themes/42/layouts/_partials/breadcrumbs.html

@@ -1,10 +1,20 @@
 {{- $page := . -}}
 {{- with .Page }}{{ $page = . }}{{ end -}}
+{{- $taxonomiesRoot := site.GetPage "section" "taxonomies" -}}
 {{- $trail := slice -}}
 {{- if $page }}
+    {{- $isTaxonomy := or (eq $page.Kind "taxonomy") (eq $page.Kind "term") -}}
+    {{- if and $isTaxonomy $taxonomiesRoot -}}
+        {{- if not (in $trail $taxonomiesRoot) -}}
+            {{- $trail = $trail | append $taxonomiesRoot -}}
+        {{- end -}}
+    {{- end -}}
+
     {{- range $page.Ancestors.Reverse -}}
         {{- if ne .RelPermalink "/" -}}
-            {{- $trail = $trail | append . -}}
+            {{- if not (in $trail .) -}}
+                {{- $trail = $trail | append . -}}
+            {{- end -}}
         {{- end -}}
     {{- end -}}
 
@@ -21,10 +31,12 @@
                 {{- $trail = $trail | append . -}}
             {{- end -}}
         {{- end -}}
-    {{- else if and (eq $page.Kind "taxonomy") (eq (len $trail) 0) }}
+    {{- else if eq $page.Kind "taxonomy" }}
-        {{- with site.Home }}
+        {{- if and (eq (len $trail) 0) (not $taxonomiesRoot) }}
-            {{- if ne .RelPermalink "/" -}}
+            {{- with site.Home }}
-                {{- $trail = $trail | append . -}}
+                {{- if ne .RelPermalink "/" -}}
+                    {{- $trail = $trail | append . -}}
+                {{- end -}}
             {{- end -}}
         {{- end -}}
     {{- end }}

themes/42/layouts/_partials/keywords.html

@@ -3,11 +3,19 @@
 <ul class="keywords">
   {{- range (sort $items "Title") }}
     {{- $type := printf "%T" . -}}
-    {{- if or (strings.HasPrefix $type "*hugolib.") (strings.HasPrefix $type "page.") }}
+    {{- $isPage := or (strings.HasPrefix $type "*hugolib.") (strings.HasPrefix $type "page.") -}}
-    <li><a href="{{ .RelPermalink }}">{{ with .LinkTitle }}{{ . }}{{ else }}{{ .Title }}{{ end }}</a></li>
+    <li>
-    {{- else }}
+      {{- if $isPage -}}
-    <li>{{ . }}</li>
+        <a href="{{ .RelPermalink }}">{{ with .LinkTitle }}{{ . }}{{ else }}{{ .Title }}{{ end }}</a>
-    {{- end }}
+        {{ with .Pages -}}
+          <sub>{{ len . }}</sub>
+        {{- else -}}
+          <sub>0</sub>
+        {{- end -}}
+      {{- else -}}
+        {{ . }}<sub>—</sub>
+      {{- end }}
+    </li>
   {{- end }}
 </ul>
 {{- end }}

themes/42/layouts/_partials/page-meta.html

@@ -1,6 +1,7 @@
 <div class="page-meta">
-    {{ with .Date }}
+    {{ with .Params.date }}
-    <time datetime="{{ . }}">{{ . | time.Format ":date_long" }}</time>
+    {{- $date := time.AsTime . -}}
+    <time datetime="{{ time.Format "2006-01-02" $date }}">{{ $date | time.Format ":date_long" }}</time>
     {{ end }}
     {{ partial "breadcrumbs.html" . }}
     {{- if ge .ReadingTime 5 -}}

themes/42/layouts/taxonomies/taxonomies.html

@@ -0,0 +1,22 @@
+{{ define "main" }}
+{{ partial "hero-page.html" . }}
+<main>
+    {{ with .Content }}
+    <article class="article-body">
+        {{ . }}
+    </article>
+    {{ end }}
+
+    {{ $ctx := . }}
+    <ul class="keywords">
+        {{- range $taxonomy, $terms := $ctx.Site.Taxonomies -}}
+            {{ with $ctx.Site.GetPage $taxonomy }}
+            <li>
+                <a href="{{ .RelPermalink }}">{{ .Title }}</a>
+                <sub>{{ len $terms }}</sub>
+            </li>
+            {{- end }}
+        {{ end }}
+    </ul>
+</main>
+{{ end }}

themes/default/assets/css/variables/aesthetics.css

@@ -13,7 +13,7 @@
     --color-page-meta: var(--color-text);
     --color-home-link: var(--gray-500);
     --color-home-link-hover: var(--blue-300);
-    --color-figure-media-background: #ffffff;
+    --color-figure-media-background: var(--gray-0);
     --color-link: var(--blue-300);
     --color-link-hover: var(--blue-100);
     --color-card-title: var(--color-site-title);
@@ -23,17 +23,21 @@
     --color-link-affiliated-hover: var(--pink-300);
     --color-link-dead: var(--red-500);
     --color-link-dead-hover: var(--red-300);
+    --color-keyword: var(--gray-500);
+    --color-keyword-hover: var(--gray-0);
 
     /* Border tokens */
     --border-outer-color: var(--gray-800);
     --border-panel: 1px solid var(--border-outer-color);
     --border-panel-outer: 1px solid var(--border-outer-color);
     --border-panel-top: 2px solid var(--border-outer-color);
+    --border-keyword: none;
 
     /* Radius tokens */
     --radius-base: 0;
     --radius-panel: var(--radius-base);
     --radius-pagination: var(--radius-base);
+    --radius_keyword: var(--radius-base);
 
     /* Shadow tokens */
     --color-shadow-base: var(--gray-900);