From 6dd4f6cb81019e2806315fb5e123084d4ea69340 Mon Sep 17 00:00:00 2001 From: James Panther <4462786+jpanther@users.noreply.github.com> Date: Tue, 8 Nov 2022 12:15:25 +1100 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Complete=20rewrite=20of=20paginatio?= =?UTF-8?q?n=20logic?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Add a new `paginationWidth` parameter to control how many links are output - Fix pagination links overflow page Fixes #299 --- CHANGELOG.md | 2 + config/_default/params.toml | 1 + exampleSite/config/_default/params.toml | 1 + exampleSite/content/docs/configuration.md | 1 + layouts/partials/pagination.html | 131 +++++++++++++++------- 5 files changed, 97 insertions(+), 39 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 35973255..a34b9af0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ### Added - Traditional Chinese (Taiwan) translation ([#262](https://github.com/jpanther/congo/pull/262)) +- New `list.paginationWidth` parameter to specify how many pagination links are generated before they are truncated - Tailwind plugin for Prettier to standardise the order of CSS classes ([#268](https://github.com/jpanther/congo/pull/268)) - External links in article content will now open in a new browser tab ([#312](https://github.com/jpanther/congo/pull/312)) - Independent control over the display of taxonomy listings on article and list pages ([#326](https://github.com/jpanther/congo/pull/326)) @@ -28,6 +29,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), - Appearance switcher title doesn't update when switching appearance ([#235](https://github.com/jpanther/congo/issues/235)) - Article updated date logic doesn't consider formatted date values ([#259](https://github.com/jpanther/congo/issues/259)) +- Pagination links overflow the page area on large datasets ([#299](https://github.com/jpanther/congo/issues/299)) - Order of articles on list pages would not follow Hugo conventions when grouped by year ([#313](https://github.com/jpanther/congo/issues/313)) - Button shortcode overlaps table of contents when at the top of the article content ([#337](https://github.com/jpanther/congo/issues/337)) - Providing a `colorScheme` value containing uppercase characters breaks some deployments ([#347](https://github.com/jpanther/congo/issues/347)) diff --git a/config/_default/params.toml b/config/_default/params.toml index a5068884..342309c0 100644 --- a/config/_default/params.toml +++ b/config/_default/params.toml @@ -53,6 +53,7 @@ enableCodeCopy = false showTableOfContents = false showTaxonomies = false groupByYear = true + paginationWidth = 1 [sitemap] excludedKinds = ["taxonomy", "term"] diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml index e0d0f42c..a99f9500 100644 --- a/exampleSite/config/_default/params.toml +++ b/exampleSite/config/_default/params.toml @@ -53,6 +53,7 @@ mainSections = ["samples"] showTableOfContents = true showTaxonomies = false groupByYear = false + paginationWidth = 1 [sitemap] excludedKinds = ["taxonomy", "term"] diff --git a/exampleSite/content/docs/configuration.md b/exampleSite/content/docs/configuration.md index 1731b875..a1fd1ec4 100644 --- a/exampleSite/content/docs/configuration.md +++ b/exampleSite/content/docs/configuration.md @@ -152,6 +152,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |`list.showTaxonomies`|`false`|Whether or not the taxonomies related to this article are displayed on list pages.| |`list.showSummary`|`false`|Whether or not article summaries are displayed on list pages. If a summary is not provided in the [front matter]({{< ref "front-matter" >}}), one will be auto generated using the `summaryLength` parameter in the [site configuration](#site-configuration).| |`list.groupByYear`|`true`|Whether or not articles are grouped by year on list pages.| +|`list.paginationWidth`|`1`|How many pagination links to output either side of the current page when the page list needs to be truncated. A width of `1` will output one link either side of the current page when the list needs to be truncated. Links to the current, first and last pages are always displayed and are in addition to this value.| |`sitemap.excludedKinds`|`["taxonomy", "term"]`|Kinds of content that should be excluded from the generated `/sitemap.xml` file. Refer to the [Hugo docs](https://gohugo.io/templates/section-templates/#page-kinds) for acceptable values.| |`taxonomy.showTermCount`|`true`|Whether or not the number of articles within a taxonomy term is displayed on the taxonomy listing.| |`fathomAnalytics.site`|_Not set_|The site code generated by Fathom Analytics for the website. Refer to the [Analytics docs]({{< ref "partials#analytics" >}}) for more details.| diff --git a/layouts/partials/pagination.html b/layouts/partials/pagination.html index 8f4cf25d..4228b332 100644 --- a/layouts/partials/pagination.html +++ b/layouts/partials/pagination.html @@ -1,39 +1,92 @@ -{{ $paginator := .Paginator }} -{{ if gt $paginator.TotalPages 1 }} - -{{ end }} +{{- with .Paginator }} + {{- $width := $.Site.Params.list.paginationWidth | default 1 }} + {{- $currentPageNumber := .PageNumber }} + {{- if gt .TotalPages 1 }} + {{- $start := math.Max 1 (sub .PageNumber $width) }} + {{- $end := math.Min .TotalPages (add $start (mul $width 2)) }} + + + {{- end }} +{{- end }}