Add pagination

This commit is contained in:
vimux 2018-02-23 15:27:28 +03:00
parent 06db5f412f
commit 8dd523595d
3 changed files with 46 additions and 0 deletions

View file

@ -7,5 +7,6 @@
</div>
{{ end }}
</div>
{{ partial "pagination.html" . }}
</div>
{{ partial "footer.html" . }}

View 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">&hellip;</span>
{{- end }}
{{- end }}
{{- if not $pag.HasNext }}{{ else }}<a class="pagination__item" href="{{ if $pag.HasNext }}{{ $pag.Next.URL }}{{ end }}"></a>{{ end }}
</div>
{{- end }}

View file

@ -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;