Add pagination
This commit is contained in:
parent
06db5f412f
commit
8dd523595d
3 changed files with 46 additions and 0 deletions
|
@ -7,5 +7,6 @@
|
|||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ partial "pagination.html" . }}
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
25
layouts/partials/pagination.html
Normal file
25
layouts/partials/pagination.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
{{- $pag := $.Paginator }}
|
||||
{{- if gt $pag.TotalPages 1 }}
|
||||
<div class="pagination block">
|
||||
{{- if not $pag.HasPrev }}{{ else}}<a class="pagination__item pagination__item-link" href="{{ if $pag.HasPrev }}{{ $pag.Prev.URL }}{{ end }}">❰</a>{{- end }}
|
||||
{{- $.Scratch.Set "__paginator.ellipsed" false }}
|
||||
{{- range $pag.Pagers }}
|
||||
{{- $right := sub .TotalPages .PageNumber }}
|
||||
{{- $showNumber := or (le .PageNumber 3) (eq $right 0) }}
|
||||
{{- $showNumber := or $showNumber (and (gt .PageNumber (sub $pag.PageNumber 2)) (lt .PageNumber (add $pag.PageNumber 2))) }}
|
||||
{{- if $showNumber }}
|
||||
{{- $.Scratch.Set "__paginator.ellipsed" false }}
|
||||
{{- $.Scratch.Set "__paginator.shouldEllipse" false }}
|
||||
{{ else }}
|
||||
{{- $.Scratch.Set "__paginator.shouldEllipse" (not ($.Scratch.Get "__paginator.ellipsed") ) }}
|
||||
{{- $.Scratch.Set "__paginator.ellipsed" true }}
|
||||
{{- end }}
|
||||
{{- if $showNumber }}
|
||||
{{- if eq . $pag }}<span class="pagination__item pagination__item--active" data-total="{{ $pag.TotalPages }}">{{ .PageNumber }}</span>{{ else }}<a class="pagination__item pagination__item--desktop" href="{{ .URL }}">{{ .PageNumber }}</a>{{- end }}
|
||||
{{ else if ($.Scratch.Get "__paginator.shouldEllipse") }}
|
||||
<span class="pagination__item pagination__item--gap">…</span>
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- if not $pag.HasNext }}{{ else }}<a class="pagination__item" href="{{ if $pag.HasNext }}{{ $pag.Next.URL }}{{ end }}">❱</a>{{ end }}
|
||||
</div>
|
||||
{{- end }}
|
|
@ -374,6 +374,26 @@ summary {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
.pagination {
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
background-color: #2a2a2a;
|
||||
}
|
||||
|
||||
.pagination__item {
|
||||
display: inline-block;
|
||||
padding: 4px 10px;
|
||||
font-weight: 700;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.pagination__item--gap {
|
||||
color: #888;
|
||||
cursor: default;
|
||||
border-color: #888;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.footer {
|
||||
padding: 10px 0;
|
||||
|
|
Loading…
Reference in a new issue