Skip to content

Commit

Permalink
Changing pagination results number (#956)
Browse files Browse the repository at this point in the history
* docs(pagination): update results indexes on pagination example

The paginion component example shows as page 2, but also outputs
"showing results 10-20 of 30". This commit updates that to be results
11-20 as would actually be displayed.

* fix(pagination): fix aria label for pages to use total pages instead of total results

The `aria-label` for each page entry was of the form "page x of y" where y was the total number of
results, rather than the total number of pages. This PR fixes the error

---------

Co-authored-by: Chris Pymm <chris@chrispymm.co.uk>
  • Loading branch information
robertjmccarthy and chrispymm committed Dec 10, 2024
1 parent 599dc0e commit e1563c3
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 3 deletions.
2 changes: 1 addition & 1 deletion docs/examples/pagination/index.njk
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ arguments: pagination
}],
results: {
count: 30,
from: 10,
from: 11,
to: 20,
text: 'results'
},
Expand Down
4 changes: 2 additions & 2 deletions src/moj/components/pagination/template.njk
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,9 @@
<li class="moj-pagination__item moj-pagination__item--dots">…</li>
{% else %}
{%- if item.selected %}
<li class="moj-pagination__item moj-pagination__item--active" aria-label="Page {{ item.text }} of {{ params.results.count }}" aria-current="page">{{ item.text }}</li>
<li class="moj-pagination__item moj-pagination__item--active" aria-label="Page {{ item.text }} of {{ params.items | length }}" aria-current="page">{{ item.text }}</li>
{% else %}
<li class="moj-pagination__item"><a class="moj-pagination__link" href="{{ item.href }}" aria-label="Page {{ item.text }} of {{ params.results.count }}">{{ item.text }}</a></li>
<li class="moj-pagination__item"><a class="moj-pagination__link" href="{{ item.href }}" aria-label="Page {{ item.text }} of {{ params.items | length }}">{{ item.text }}</a></li>
{% endif -%}
{% endif -%}
{% endfor -%}
Expand Down

0 comments on commit e1563c3

Please sign in to comment.