Commit 6056d391 authored by Mike Jones's avatar Mike Jones

Add basic style for pagination

parent 10c6c6d1
Pipeline #139 canceled with stage
{"Target":"sass/application.min.17c02c1861c90c3dcf3c8c9932110bcac5415f6910ef2e363ac6ea9dc785a96c.css","MediaType":"text/css","Data":{"Integrity":"sha256-F8AsGGHJDD3PPIyZMhELysVBX2kQ7y42OsbqnceFqWw="}}
\ No newline at end of file
{"Target":"sass/application.min.a8d36c9d07a15c63683e1feb47b5c3f89756775689045c17a3f92ae394b63352.css","MediaType":"text/css","Data":{"Integrity":"sha256-qNNsnQehXGNoPh/rR7XD+JdWd1aJBFwXo/kq45S2M1I="}}
\ No newline at end of file
......@@ -9,3 +9,4 @@
@import "segments/body";
@import "segments/navigation";
@import "segments/article-summary";
@import "segments/post-pagination";
......@@ -6,4 +6,4 @@ $eggshell: hsla(3, 51%, 92%, 1);
$skin: hsla(6, 41%, 85%, 1);
$link-inactive: hsla(0, 0%, 50%, 1);
$link-active: hsla(148, 62%, 39%, 1);
$active: hsla(148, 62%, 39%, 1);
......@@ -29,7 +29,7 @@ a:hover {
}
h2 a {
border-radius: 2px;
border-radius: $border-radius;
padding: $small-padding;
}
......
nav.pagination-nav {
float: right;
margin-top: 1rem;
a.disabled:hover {
background: none;
}
.page-item.active .page-link {
background: $active;
}
.page-link {
color: $link-inactive;
}
.page-link {
border: 0;
}
.page-item:last-child .page-link {
border-radius: $border-radius;
}
}
{{ $paginator := .Paginator }}
{{ if or ($paginator.HasPrev) ($paginator.HasNext) }}
{{ $prev := "Back" }}
{{ $prev := "Previous" }}
{{ $next := "Next" }}
<nav class="pagination" role="pagination">
{{ if $paginator.HasPrev }}
<a href="{{ $paginator.Prev.URL }}">{{ $prev }}</a>
{{ else }}
{{ $prev }}
{{ end }}
<nav aria-label="Pagination tools" class="pagination-nav">
<ul class="pagination">
<li class="page-item">
{{ if $paginator.HasPrev }}
<a class="page-link" href="{{ $paginator.Prev.URL }}">{{ $prev }}</a>
{{ else }}
<a class="page-link disabled">{{ $prev }}</a>
{{ end }}
</li>
{{ range $paginator.Pagers }}
<li class="pagination__item{{ if eq . $paginator }} pagination__item--current{{ end }}">
<a href="{{ .URL }}" class="pagination__link">
<li class="page-item{{ if eq . $paginator }} active{{ end }}">
<a href="{{ .URL }}" class="page-link">
{{ .PageNumber }}
</a>
</li>
{{ end }}
</ul>
{{ if $paginator.HasNext }}
<a href="{{ $paginator.Next.URL }}">{{ $next }}</a>
{{ else }}
{{ $next }}
{{ end }}
<li class="page-item">
{{ if $paginator.HasNext }}
<a class="page-link" href="{{ $paginator.Next.URL }}">{{ $next }}</a>
{{ else }}
<a class="page-link disabled">{{ $next }}</a>
{{ end }}
</li>
</ul>
</nav>
<div class="clearfix"></div>
{{ end }}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment