From ca69a65980de6168997d5211477b9fc214767f8e Mon Sep 17 00:00:00 2001
From: Peter <sonichu@tuta.io>
Date: Mon, 17 Mar 2025 17:26:54 -0400
Subject: [PATCH] add pagination to blog, categories and tags, and fix some
 issues and typos

---
 i18n/es.toml                      |   2 +-
 layouts/blog/list.html            |  44 +++++++++++
 layouts/categories/list.html      |  44 +++++++++++
 layouts/partials/custom-head.html |  29 ++++++++
 layouts/partials/pagination.html  | 120 ++++++++++++++++++++++++++++++
 layouts/tags/list.html            |  44 +++++++++++
 6 files changed, 282 insertions(+), 1 deletion(-)
 create mode 100644 layouts/blog/list.html
 create mode 100644 layouts/categories/list.html
 create mode 100644 layouts/partials/pagination.html
 create mode 100644 layouts/tags/list.html

diff --git a/i18n/es.toml b/i18n/es.toml
index 63c01c7..45dd777 100644
--- a/i18n/es.toml
+++ b/i18n/es.toml
@@ -2,7 +2,7 @@
     other = "NO ENCONTRADO"
 
 [not_found_desc]
-    other = "Haz tomado una ruta que no existe..."
+    other = "Has tomado una ruta que no existe..."
 
 [home]
     other = "Inicio"
diff --git a/layouts/blog/list.html b/layouts/blog/list.html
new file mode 100644
index 0000000..0bff877
--- /dev/null
+++ b/layouts/blog/list.html
@@ -0,0 +1,44 @@
+{{ define "title"}}
+{{ .Title }} | {{ .Site.Params.author.name }}
+{{ end }}
+
+{{ define "main" }}
+
+<div>
+    <div class="listHeader">
+        <h1>{{ .Title }}</h1>
+    </div>
+
+    {{ with .Content }}
+    <div class="listContent">
+        {{- . -}}
+    </div>
+    {{ end }}
+
+    <div>
+        {{ $pages := where site.RegularPages "Type" "blog" }}
+        {{ $paginator := .Paginate $pages.ByDate.Reverse 10 }}
+
+        {{ range $paginator.Pages.ByDate.Reverse }}
+
+        <a class="postListLink" href="{{ .Permalink }}">
+            <!-- [html-validate-disable-next prefer-native-element] -->
+            <div class="postListItem" role="listitem">
+                <div class="postHeader">
+                    <span class="postTitle">{{ .Title }}</span>
+                    {{ $formattedDate := .Date.Format "2006-01-02" }}
+                    <time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
+                </div>
+                <div class="postExcerpt">
+                    <p>{{ .Summary }}</p>
+                </div>
+            </div>
+        </a>
+
+
+        {{end}}
+        {{ template "partials/pagination.html" . }}
+    </div>
+</div>
+
+{{ end }}
diff --git a/layouts/categories/list.html b/layouts/categories/list.html
new file mode 100644
index 0000000..11d6990
--- /dev/null
+++ b/layouts/categories/list.html
@@ -0,0 +1,44 @@
+{{ define "title"}}
+{{ .Title }} | {{ .Site.Params.author.name }}
+{{ end }}
+
+{{ define "main" }}
+
+<div>
+    <div class="listHeader">
+        <h1>{{ .Title }}</h1>
+    </div>
+
+    {{ with .Content }}
+    <div class="listContent">
+        {{- . -}}
+    </div>
+    {{ end }}
+
+    <div>
+        {{ $pages := where site.RegularPages "Type" "categories" }}
+        {{ $paginator := .Paginate (where .Data.Pages "Type" "blog") 10 }}
+
+        {{ range $paginator.Pages.ByDate.Reverse }}
+
+        <a class="postListLink" href="{{ .Permalink }}">
+            <!-- [html-validate-disable-next prefer-native-element] -->
+            <div class="postListItem" role="listitem">
+                <div class="postHeader">
+                    <span class="postTitle">{{ .Title }}</span>
+                    {{ $formattedDate := .Date.Format "2006-01-02" }}
+                    <time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
+                </div>
+                <div class="postExcerpt">
+                    <p>{{ .Summary }}</p>
+                </div>
+            </div>
+        </a>
+
+
+        {{end}}
+        {{ template "partials/pagination.html" . }}
+    </div>
+</div>
+
+{{ end }}
diff --git a/layouts/partials/custom-head.html b/layouts/partials/custom-head.html
index 4a789ff..4445f4c 100644
--- a/layouts/partials/custom-head.html
+++ b/layouts/partials/custom-head.html
@@ -3,6 +3,35 @@
 <head>
 <style>
 code { padding: 2px 4px; font-size: 90%; border-radius: 4px; background-color: #1c1c1d; }
+
+.pagination {
+  list-style: none;
+  margin: 3;
+  padding: 0;
+  margin-top: 1em;
+  padding-top: 0.5em;
+  font: 1.2em FiraMono;
+  display: flex;
+  justify-content: center;
+}
+
+.pagination li {
+  margin: 0 1px;
+}
+
+.pagination a {
+  display: block;
+  padding: 0.1em 0.8em;
+  margin: 1px;
+  border-radius: 0.5em;
+  text-decoration: none;
+  background-color: #2f2f2f;
+}
+
+.pagination a:hover {
+  color: #f8f8ff; 
+  background-color: #f26d63; 
+}
 .searchprompt {
   color: #4b4b4b;
   font-size: 12px;
diff --git a/layouts/partials/pagination.html b/layouts/partials/pagination.html
new file mode 100644
index 0000000..7860404
--- /dev/null
+++ b/layouts/partials/pagination.html
@@ -0,0 +1,120 @@
+<!--
+//
+//  PAGE NUMBERS
+//––––––––––––––––––––––––––––––––––––––––––––––––––
+-->
+{{ $paginator := .Paginator }}
+
+<!-- Number of links either side of the current page. -->
+{{ $adjacent_links := 2 }}
+
+<!-- $max_links = ($adjacent_links * 2) + 1 -->
+{{ $max_links := (add (mul $adjacent_links 2) 1) }}
+
+<!-- $lower_limit = $adjacent_links + 1 -->
+{{ $lower_limit := (add $adjacent_links 1) }}
+
+<!-- $upper_limit = $paginator.TotalPages - $adjacent_links -->
+{{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }}
+
+<!-- If there's more than one page. -->
+{{ if gt $paginator.TotalPages 1 }}
+
+  <ul class="pagination">
+    
+    <!-- First page. -->
+    {{ if ne $paginator.PageNumber 1 }}
+    <li class="pagination__item pagination__item--first">
+      <a class="pagination__link pagination__link--first" href="{{ $paginator.First.URL }}">
+        ««
+      </a>
+    </li>
+    {{ end }}
+
+    <!-- Previous page. -->
+    {{ if $paginator.HasPrev }}
+    <li class="pagination__item pagination__item--previous">
+      <a href="{{ $paginator.Prev.URL }}" class="pagination__link pagination__link--previous">
+        «
+      </a>
+    </li>
+    {{ end }}
+  
+    <!-- Page numbers. -->
+    {{ range $paginator.Pagers }}
+    
+      {{ $.Scratch.Set "page_number_flag" false }}
+
+      
+      <!-- Advanced page numbers. -->
+      {{ if gt $paginator.TotalPages $max_links }}
+
+
+        <!-- Lower limit pages. -->
+        <!-- If the user is on a page which is in the lower limit.  -->
+        {{ if le $paginator.PageNumber $lower_limit }}
+
+          <!-- If the current loop page is less than max_links. -->
+          {{ if le .PageNumber $max_links }}
+            {{ $.Scratch.Set "page_number_flag" true }}
+          {{ end }}
+
+
+        <!-- Upper limit pages. -->
+        <!-- If the user is on a page which is in the upper limit. -->
+        {{ else if ge $paginator.PageNumber $upper_limit }}
+
+          <!-- If the current loop page is greater than total pages minus $max_links -->
+          {{ if gt .PageNumber (sub $paginator.TotalPages $max_links) }}
+            {{ $.Scratch.Set "page_number_flag" true }}
+          {{ end }}
+
+
+        <!-- Middle pages. -->
+        {{ else }}
+          
+          {{ if and ( ge .PageNumber (sub $paginator.PageNumber $adjacent_links) ) ( le .PageNumber (add $paginator.PageNumber $adjacent_links) ) }}
+            {{ $.Scratch.Set "page_number_flag" true }}
+          {{ end }}
+
+        {{ end }}
+
+      
+      <!-- Simple page numbers. -->
+      {{ else }}
+
+        {{ $.Scratch.Set "page_number_flag" true }}
+
+      {{ end }}
+
+      <!-- Output page numbers. -->
+      {{ if eq ($.Scratch.Get "page_number_flag") true }}
+        <li class="pagination__item{{ if eq . $paginator }} pagination__item--current{{ end }}">
+          <a href="{{ .URL }}" class="pagination__link">
+            {{ .PageNumber }}
+          </a>
+        </li>
+      {{ end }}
+
+    {{ end }}
+
+    <!-- Next page. -->
+    {{ if $paginator.HasNext }}
+    <li class="pagination__item pagination__item--next">
+      <a href="{{ $paginator.Next.URL }}" class="pagination__link pagination__link--next">
+        »
+      </a>
+    </li>
+    {{ end }}
+
+    <!-- Last page. -->
+    {{ if ne $paginator.PageNumber $paginator.TotalPages }}
+    <li class="pagination__item pagination__item--last">
+      <a class="pagination__link pagination__link--last" href="{{ $paginator.Last.URL }}">
+        »»
+      </a>
+    </li>
+    {{ end }}
+
+  </ul><!-- .pagination -->
+{{ end }}
diff --git a/layouts/tags/list.html b/layouts/tags/list.html
new file mode 100644
index 0000000..08872b9
--- /dev/null
+++ b/layouts/tags/list.html
@@ -0,0 +1,44 @@
+{{ define "title"}}
+{{ .Title }} | {{ .Site.Params.author.name }}
+{{ end }}
+
+{{ define "main" }}
+
+<div>
+    <div class="listHeader">
+        <h1>{{ .Title }}</h1>
+    </div>
+
+    {{ with .Content }}
+    <div class="listContent">
+        {{- . -}}
+    </div>
+    {{ end }}
+
+    <div>
+        {{ $pages := where site.RegularPages "Type" "tags" }}
+        {{ $paginator := .Paginate (where .Data.Pages "Type" "blog") 10 }}
+
+        {{ range $paginator.Pages.ByDate.Reverse }}
+
+        <a class="postListLink" href="{{ .Permalink }}">
+            <!-- [html-validate-disable-next prefer-native-element] -->
+            <div class="postListItem" role="listitem">
+                <div class="postHeader">
+                    <span class="postTitle">{{ .Title }}</span>
+                    {{ $formattedDate := .Date.Format "2006-01-02" }}
+                    <time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
+                </div>
+                <div class="postExcerpt">
+                    <p>{{ .Summary }}</p>
+                </div>
+            </div>
+        </a>
+
+
+        {{end}}
+        {{ template "partials/pagination.html" . }}
+    </div>
+</div>
+
+{{ end }}