60 lines
2.9 KiB
HTML
60 lines
2.9 KiB
HTML
|
{{- $p := . }}
|
||
|
|
{{- if gt $p.TotalPages 1 }}
|
||
|
|
<nav aria-label="Pagination"
|
||
|
|
class="flex items-center justify-center gap-1
|
||
|
|
px-[var(--pad)] py-[clamp(24px,3vw,40px)]
|
||
|
|
border-t border-[var(--rule)] mt-[var(--gap)]">
|
||
|
|
|
||
|
|
{{/* Prev */}}
|
||
|
|
{{- if $p.HasPrev }}
|
||
|
|
<a href="{{ $p.Prev.URL }}"
|
||
|
|
class="flex items-center gap-1.5 px-4 py-2 mr-3
|
||
|
|
font-sans font-medium text-[11px] leading-none tracking-[.14em] uppercase text-ink-soft
|
||
|
|
border border-[var(--rule)] transition-colors duration-200 hover:text-ink hover:border-ink">
|
||
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m15 18-6-6 6-6"/></svg>
|
||
|
|
Prev
|
||
|
|
</a>
|
||
|
|
{{- else }}
|
||
|
|
<span class="flex items-center gap-1.5 px-4 py-2 mr-3
|
||
|
|
font-sans font-medium text-[11px] leading-none tracking-[.14em] uppercase
|
||
|
|
text-ink-soft opacity-30 border border-[var(--rule-2)]">
|
||
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m15 18-6-6 6-6"/></svg>
|
||
|
|
Prev
|
||
|
|
</span>
|
||
|
|
{{- end }}
|
||
|
|
|
||
|
|
{{/* Page numbers */}}
|
||
|
|
{{- range $p.Pagers }}
|
||
|
|
{{- if eq .PageNumber $p.PageNumber }}
|
||
|
|
<span class="w-9 h-9 grid place-items-center
|
||
|
|
font-mono text-[11px] tabular-nums
|
||
|
|
bg-ink text-paper border border-ink">{{ .PageNumber }}</span>
|
||
|
|
{{- else }}
|
||
|
|
<a href="{{ .URL }}"
|
||
|
|
class="w-9 h-9 grid place-items-center
|
||
|
|
font-mono text-[11px] tabular-nums text-ink-soft
|
||
|
|
border border-[var(--rule)] transition-colors duration-200 hover:text-ink hover:border-ink">{{ .PageNumber }}</a>
|
||
|
|
{{- end }}
|
||
|
|
{{- end }}
|
||
|
|
|
||
|
|
{{/* Next */}}
|
||
|
|
{{- if $p.HasNext }}
|
||
|
|
<a href="{{ $p.Next.URL }}"
|
||
|
|
class="flex items-center gap-1.5 px-4 py-2 ml-3
|
||
|
|
font-sans font-medium text-[11px] leading-none tracking-[.14em] uppercase text-ink-soft
|
||
|
|
border border-[var(--rule)] transition-colors duration-200 hover:text-ink hover:border-ink">
|
||
|
|
Next
|
||
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 6 6 6-6 6"/></svg>
|
||
|
|
</a>
|
||
|
|
{{- else }}
|
||
|
|
<span class="flex items-center gap-1.5 px-4 py-2 ml-3
|
||
|
|
font-sans font-medium text-[11px] leading-none tracking-[.14em] uppercase
|
||
|
|
text-ink-soft opacity-30 border border-[var(--rule-2)]">
|
||
|
|
Next
|
||
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 6 6 6-6 6"/></svg>
|
||
|
|
</span>
|
||
|
|
{{- end }}
|
||
|
|
|
||
|
|
</nav>
|
||
|
|
{{- end }}
|