Pagination

Paginering

Gebruik de paginering component om te navigeren tussen meerder pagina's met (zoek)resultaten.

Pagination voor een list met links naar meerdere resultaten pagina’s. Geef alle list items de class pagination__item. Plaats alle pagination__items vóór de --previous en --next items. Deze 2 links worden automatisch verborgen wanneer ze niet van toepassing zijn.

Gebruik geen link op de pagina waar je bent, maar zet daar een span die aangeeft dat dat de huidige pagina is. Zet daar de class pagination__item--active op, zodat alleen screenreaders het zien.

Een link naar de eerste of laatste resultaten pagina kan opgenomen worden met een class class pagination__item--first en pagination__item--last.
De teksten ‘Volgende’ en ‘Vorige’ worden visueel verborgen op kleine schermen (wel zichtbaar voor screenreaders).

Paginering simple

Een simpele paginering die gebruikt kan worden bij bijvoorbeeld Google Search resultaten.

Benodigde stylesheets

  • /uno/components/pagination/pagination.css