Add breadcrumbs and cleanup writeup ui

2026-10-02 14:46:25 +00:00 · 2024-11-22 00:52:19 +01:00
parent 0576d99b9d
commit e326ae01d7
17 changed files with 159 additions and 88 deletions
@@ -2,6 +2,8 @@
 {{ $paginator := .Paginate .Data.Pages }}

 <main class="posts">
+    <p class="posts-breadcrumbs">{{ partial "breadcrumbs.html" (dict "page" . "end" ">" "min" 1) }}</p>
+
    <h1>{{ .Title }}</h1>

    {{- if and .Content (not .Paginator.HasPrev) }}
@@ -43,6 +45,7 @@
            {{- end }}

            {{- if .Params.Cover }}
+            <a href="{{ .Permalink }}" class="nostyle">
            <figure class="post-cover">
                {{- partial "image.html" (dict "path" .Params.Cover "alt" (.Title | plainify)) }}

@@ -50,6 +53,7 @@
                <figcaption class="center">{{ .Params.CoverCaption | markdownify }}</figcaption>
                {{- end }}
            </figure>
+            </a>
            {{- end }}

            <div class="post-content">
@@ -9,23 +9,29 @@
        <circle cx="12" cy="12" r="10"></circle>
        <polyline points="12 6 12 12 16 14"></polyline>
      </svg>
-      {{ i18n "readingTime" .Page.ReadingTime }}
+      {{- $readingTime := .Page.ReadingTime }}
+      {{- if eq .Type "writeups" }}
+      {{- $readingTime = mul 1.5 .Page.ReadingTime | int }}
+      {{- end }}
+      {{ i18n "readingTime" $readingTime }}

      {{- if .IsTranslated }} | {{ i18n "postAvailable" }}
      {{- range .Translations }}
      <a href="{{ .Permalink }}"><span
          class="flag flag-icon flag-icon-{{ index $.Site.Data.langFlags (.Lang) }} flag-icon-squared"></span></a>
-      {{- end}}
+      {{- end }}
      {{- end }}
    </p>
  </div>

  <article>
+    <p class="post-breadcrumbs">{{ partial "breadcrumbs.html" (dict "page" . "end" ">" "min" 1) }}</p>
+
    <h1 class="post-title">
      <a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
    </h1>
-    {{- with .Params.Subtitle }}
-    <p class="post-subtitle">{{ . | markdownify }}</p>
+    {{- with .Params.Description }}
+    <p class="post-description">{{ . | markdownify }}</p>
    {{- end }}

    {{- if .Params.Cover }}
@@ -0,0 +1,26 @@
+{{- $breadcrumbs := slice }}
+{{- $path := .page.RelPermalink }}
+{{- $path = trim $path "/" }}
+{{- $currentPath := "" }}
+{{- range split $path "/" }}
+{{- $currentPath = printf "%s/%s" $currentPath . }}
+{{- $page := $.page.GetPage $currentPath }}
+{{- if ne (trim $currentPath "/") $path }}
+{{- $title := $page.Title }}
+{{- with $page.Params.breadcrumb }}
+{{- $title = . }}
+{{- end }}
+{{- $breadcrumbs = $breadcrumbs | append (dict "name" $title "url" $page.Permalink) }}
+{{- end }}
+{{- end }}
+{{- $breadcrumbs = after (int .page.IsPage) $breadcrumbs}}
+{{- if ne .page.Type "page"}}
+{{- if lt (default 0 .min) (len $breadcrumbs) }}
+{{- range $index, $breadcrumb := $breadcrumbs }}
+<a href="{{ $breadcrumb.url }}">{{ $breadcrumb.name }}</a>{{ if ne $index (sub (len $breadcrumbs) 1) }}<span> > </span>{{ end }}
+{{- end }}
+{{- if and $breadcrumbs .end }}
+{{ .end }}
+{{- end }}
+{{- end }}
+{{- end }}
@@ -21,6 +21,9 @@
 {{- $breadcrumbs = $breadcrumbs | append (dict "name" "Not Found" "url" (printf "%s%s" $.Site.BaseURL (strings.TrimLeft "/" $currentPath))) }}
 {{- else }}
 {{- $title := $page.Title }}
+{{- with $page.Params.breadcrumb }}
+{{- $title = . }}
+{{- end }}
 {{- if eq (trim $currentPath "/") $path }}
 {{- $breadcrumbs = $breadcrumbs | append (dict "name" $visiblePage.Title "url" $visiblePage.Permalink) }}
 {{- else }}
@@ -1,6 +1,8 @@
 {{ define "main" }}

 <main class="portfolios">
+    <p class="posts-breadcrumbs">{{ partial "breadcrumbs.html" (dict "page" . "end" ">") }}</p>
+
    <h1>Portfolio</h1>

    {{- if and .Content (not .Paginator.HasPrev) }}
@@ -1,6 +1,5 @@
 {{ define "main" }}
 <main class="portfolio">
-
  <div class="portfolio-info">
    <p>
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
@@ -21,6 +20,8 @@
  </div>

  <article>
+    <p class="post-breadcrumbs">{{ partial "breadcrumbs.html" (dict "page" . "end" ">" "min" 1) }}</p>
+
    <h1 class="portfolio-title">
      <a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
    </h1>
@@ -2,6 +2,8 @@
 {{ $paginator := (.Paginate .RegularPagesRecursive) }}

 <main class="posts">
+    <p class="posts-breadcrumbs">{{ partial "breadcrumbs.html" (dict "page" . "end" ">") }}</p>
+
    <h1>{{ .Title }}</h1>

    {{- if and .Content (not .Paginator.HasPrev) }}
@@ -14,60 +16,67 @@

    <div class="posts-list masonry">
        {{ range $paginator.Pages }}
-        <div class="post masonry-item">
-            <div class="masonry-item-content">
-                <h2 class="post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
-                {{- with .Params.Subtitle }}
-                <p class="post-subtitle">{{ . | markdownify }}</p>
-                {{- end }}
-                <div class="post-meta">
-                    {{- if .Date }}
-                    <span class="post-date">
-                        {{ .Date.Format ($.Site.Params.DateFormatList | default "2006-01-02") }}
-                    </span>
-                    {{- end }}
-                    {{- with .Params.Author }}
-                    <span class="post-author">{{ $.Site.Params.WrittenBy | default "Written by" }} {{ . }}</span>
-                    {{- end }}
-                    {{- if $.Site.Params.ShowReadingTimeInList }}
-                    <span class="post-read-time">— {{ .ReadingTime }}
-                        {{ $.Site.Params.MinuteReadingTime | default "min read" }}</span>
-                    {{- end }}
-                </div>
+        <div class="post">
+            <h2 class="post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>

-                {{- if .Params.tags }}
-                <span class="post-tags">
-                    {{- range .Params.tags }}
-                    #<a href="{{ (urlize (printf "tags/%s" . )) | absURL }}/">{{ . }}</a>&nbsp;
-                    {{- end }}
+            <p class="post-subtitle">
+                {{/*  {{- with .Params.Subtitle }}
+                {{ . | markdownify }}
+                <br>
+                {{- end }}  */}}
+
+                {{ partial "breadcrumbs.html" (dict "page" . "min" 0) }}
+            </p>
+
+            <div class="post-meta">
+                {{- if .Date }}
+                <span class="post-date">
+                    {{ .Date.Format ($.Site.Params.DateFormatList | default "2006-01-02") }}
                </span>
                {{- end }}
-
-                {{- if .Params.Cover }}
-                <figure class="post-cover">
-                    {{- partial "image.html" (dict "path" .Params.Cover "alt" (.Title | plainify)) }}
-
-                    {{- if .Params.CoverCaption }}
-                    <figcaption class="center">{{ .Params.CoverCaption | markdownify }}</figcaption>
-                    {{- end }}
-                </figure>
+                {{- with .Params.Author }}
+                <span class="post-author">{{ $.Site.Params.WrittenBy | default "Written by" }} {{ . }}</span>
                {{- end }}
-
-                <div class="post-content">
-                    {{- with .Description }}
-                    {{ . | markdownify }}
-                    {{- else }}
-                    {{- if .Truncated }}
-                    {{ .Summary | markdownify }}
-                    {{- end }}
-                    {{- end }}
-                </div>
-                {{- if not .Params.hideReadMore }}
-                <div><a class="read-more button"
-                        href="{{.Permalink}}">{{ $.Site.Params.ReadMore | default "Read more" }}
-                        →</a></div>
+                {{- if $.Site.Params.ShowReadingTimeInList }}
+                <span class="post-read-time">— {{ .ReadingTime }}
+                    {{ $.Site.Params.MinuteReadingTime | default "min read" }}</span>
                {{- end }}
            </div>
+
+            {{- if .Params.tags }}
+            <span class="post-tags">
+                {{- range .Params.tags }}
+                #<a href="{{ (urlize (printf "tags/%s" . )) | absURL }}/">{{ . }}</a>&nbsp;
+                {{- end }}
+            </span>
+            {{- end }}
+
+            {{- if .Params.Cover }}
+            <a href="{{ .Permalink }}" class="nostyle">
+            <figure class="post-cover">
+                {{- partial "image.html" (dict "path" .Params.Cover "alt" (.Title | plainify)) }}
+
+                {{- if .Params.CoverCaption }}
+                <figcaption class="center">{{ .Params.CoverCaption | markdownify }}</figcaption>
+                {{- end }}
+            </figure>
+            </a>
+            {{- end }}
+
+            <div class="post-content">
+                {{- with .Description }}
+                {{ . | markdownify }}
+                {{- else }}
+                {{- if .Truncated }}
+                {{ .Summary | markdownify }}
+                {{- end }}
+                {{- end }}
+            </div>
+            {{- if not .Params.hideReadMore }}
+            <div><a class="read-more button"
+                    href="{{.Permalink}}">{{ $.Site.Params.ReadMore | default "Read more" }}
+                    →</a></div>
+            {{- end }}
        </div>
        {{- end }}
    </div>