diff options
| author | Jeremy Bise <jeremy.bise@thosegeeks.com> | 2019-04-16 18:03:44 +0300 |
|---|---|---|
| committer | Jeremy Bise <jeremy.bise@thosegeeks.com> | 2019-04-16 18:03:44 +0300 |
| commit | 765f26d2e64fb1a9886ae928f001f6da754ca8cb (patch) | |
| tree | 5f240f259c13f7ebff478b8bb783a805942d2de0 | |
| parent | 72efe7bbcf636f2d141d74e80af3111014f1d617 (diff) | |
pagination works
| -rw-r--r-- | assets/scss/main.scss | 5 | ||||
| -rw-r--r-- | layouts/partials/icons/ui/chevron-left.html | 4 | ||||
| -rw-r--r-- | layouts/partials/icons/ui/chevron-right.html | 4 | ||||
| -rw-r--r-- | layouts/partials/pagination.html | 0 | ||||
| -rw-r--r-- | layouts/partials/posts/post-list.html | 33 |
5 files changed, 44 insertions, 2 deletions
diff --git a/assets/scss/main.scss b/assets/scss/main.scss index 0b6d516..8d22076 100644 --- a/assets/scss/main.scss +++ b/assets/scss/main.scss @@ -71,4 +71,9 @@ $color__border-abbr: #666; font-size: 0.8rem; padding: 2px 4px; border-radius: 2px; +} + +.navigation.pagination svg { + width: 22px; + height: 22px; }
\ No newline at end of file diff --git a/layouts/partials/icons/ui/chevron-left.html b/layouts/partials/icons/ui/chevron-left.html new file mode 100644 index 0000000..033c424 --- /dev/null +++ b/layouts/partials/icons/ui/chevron-left.html @@ -0,0 +1,4 @@ +<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></path> + <path d="M0 0h24v24H0z" fill="none"></path> +</svg>
\ No newline at end of file diff --git a/layouts/partials/icons/ui/chevron-right.html b/layouts/partials/icons/ui/chevron-right.html new file mode 100644 index 0000000..33620b3 --- /dev/null +++ b/layouts/partials/icons/ui/chevron-right.html @@ -0,0 +1,4 @@ +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> + <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path> + <path d="M0 0h24v24H0z" fill="none"></path> +</svg>
\ No newline at end of file diff --git a/layouts/partials/pagination.html b/layouts/partials/pagination.html new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/layouts/partials/pagination.html diff --git a/layouts/partials/posts/post-list.html b/layouts/partials/posts/post-list.html index 9d245ad..b079894 100644 --- a/layouts/partials/posts/post-list.html +++ b/layouts/partials/posts/post-list.html @@ -1,4 +1,6 @@ -{{ range where .Pages.ByPublishDate.Reverse "Section" "posts" }} +{{ $paginator := .Paginate (where .Pages "Type" "posts") }} + +{{ range $paginator.Pages }} <article class="post entry"> <header class="entry-header"> <h2 class="entry-title"> @@ -22,4 +24,31 @@ {{ partial "entry-meta" . }} </footer> </article> -{{ end }}
\ No newline at end of file +{{ end }} + +<nav class="navigation pagination" role="navigation"> + <h2 class="screen-reader-text">Posts navigation</h2> + <div class="nav-links"> + {{ if $paginator.HasPrev }} + <a class="prev page-numbers" href="{{ $paginator.Prev.URL }}"> + {{ partial "icons/ui/chevron-left" }} + <span class="nav-prev-text">Newer posts</span> + </a> + {{ end }} + + {{ range $paginator.Pagers }} + {{ if eq . $paginator }} + <span aria-current="page" class="page-numbers current">{{ .PageNumber }}</span> + {{ else }} + <a href="{{ .URL }}" class="page-numbers">{{ .PageNumber }}</a> + {{ end }} + {{ end }} + + {{ if $paginator.HasNext }} + <a class="next page-numbers" href="{{ $paginator.Next.URL }}"> + <span class="nav-next-text">Older posts</span> + {{ partial "icons/ui/chevron-right" }} + </a> + {{ end }} + </div> +</nav>
\ No newline at end of file |