@visual-framework/vf-pagination
v1.1.2
Published
vf-pagination component
Downloads
1,759
Readme
Pagination component
About
A simple pagination component for long listings such as search results.
Usage
When to use this component
Use pagination:
- for long listings (such as
search resultsand article archives) that consist of more than 100 items. If your list consists of fewer items you may not need to add pagination. - when most users will only look at the content on the first page or first few pages.
When not to use this component
Do not use pagination:
- for linear content such as a long page or article.
- when you are asking the user to complete a form. Instead, use
vf-buttonto let the user move to the next page and a Back link to let them move to the previous page.
Also see the recommendations by Nielsen Norman and the pagination compoment in gov.uk.
Accessibility
This component targets WCAG 2.1 AA accessibility.
Install
This repository is distributed with npm. After installing npm and yarn, you can install with this command.
$ yarn add --dev @visual-framework/vf-paginationSass/CSS
The style files included are written in Sass. If you're using a VF-core project, you can import it like this:
@import "@visual-framework/vf-pagination/index.scss";Make sure you import Sass requirements along with the modules. You can use a project boilerplate or the vf-sass-starter