feat: Enable pagination for all lists

assets/styles/millironx.css

@@ -166,6 +166,12 @@
   --container-border: light-dark(var(--swiss-brown-6), var(--eclipse-16));
   --container-background: light-dark(var(--swiss-brown-4), var(--eclipse-12));
   --motto-background: rgba(0, 0, 0, 0.66);
+  --page-button-text: var(--prickly-pear-yellow-1);
+  --page-button-background: var(--prickly-pear-yellow-8);
+  --page-button-background-hover: var(--prickly-pear-yellow-10);
+  --page-button-background-active: var(--prickly-pear-yellow-12);
+  --page-button-background-disabled: var(--prickly-pear-yellow-6);
+  --page-button-text-disabled: var(--eclipse-7);
 
   /*
     Fonts
@@ -466,6 +472,52 @@ textarea:invalid {
   max-width: 100%;
 }
 
+.pagination {
+  display: flex;
+  justify-content: center;
+  gap: 0.5em;
+}
+
+.pagination li {
+  list-style-type: none;
+  color: var(--nav-button-text);
+}
+
+.pagination li a {
+  color: var(--page-button-text);
+  background-color: var(--page-button-background);
+  border-radius: 0.05rem;
+  border-style: outset;
+  border-width: 0.2rem;
+  border-color: var(--page-button-background);
+  min-width: 2rem;
+  max-width: 2rem;
+  min-height: 2rem;
+  max-height: 2rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0.2rem;
+  text-decoration: none;
+  padding: 0 0.2rem;
+  font-family: var(--font-family-system-ui);
+}
+
+.pagination li a:hover {
+  background-color: var(--page-button-background-hover);
+}
+
+.pagination li.active a {
+  background-color: var(--page-button-background-active);
+}
+
+.pagination li.disabled a {
+  cursor: not-allowed;
+  background-color: var(--page-button-background-disabled);
+  color: var(--page-button-text-disabled);
+  border-style: solid;
+}
+
 /*
   Desktop screen size adjustments
 */
@@ -506,6 +558,9 @@ textarea:invalid {
   .person-profile {
     position: sticky;
     top: 0;
+    width: 300px;
+    min-width: 20vw;
+    max-width: 30vw;
   }
 
   /*

layouts/_default/index.html

@@ -13,7 +13,8 @@
     </div>
 
     <h2>Recent activity</h2>
-    {{ $pageinator := .Paginate .Site.RegularPages }}
+    {{ $featuredPages := where .Site.RegularPages "Params.featured" "eq" true }}
+    {{ $pageinator := .Paginate $featuredPages }}
     {{ range $pageinator.Pages }}
       {{ partial "itemcard.html" . }}
     {{ end }}

layouts/_default/list.html

@@ -12,8 +12,11 @@
       {{ end }}
     </div>
 
-    {{ range .Pages }}
+    {{ $pageinator := .Paginate .Pages }}
+    {{ range $pageinator.Pages }}
       {{ partial "itemcard.html" . }}
     {{ end }}
+
+    {{ template "_internal/pagination.html" . }}
   </section>
 {{ end }}

layouts/people/term.html

@@ -35,9 +35,12 @@
 
       <h2>Latest Activity</h2>
 
-      {{ range .Pages }}
+      {{ $pageinator := .Paginate .Pages }}
+      {{ range $pageinator.Pages }}
         {{ partial "itemcard.html" . }}
       {{ end }}
+      {{ template "_internal/pagination.html" . }}
+
     </div>
   </div>
 {{ end }}