import React from 'react'; import { Container, Row, Col, Card, CardTitle, CardBody, Pagination, PaginationItem, PaginationLink } from './../../../components'; import { HeaderMain } from "../../components/HeaderMain"; import { HeaderDemo } from "../../components/HeaderDemo"; const Paginations = () => ( { /* START Header 1 */} Documentation and examples for showing pagination to indicate a series of related content exists across m ultiple pages. )} /> { /* END Header 1 */} { /* START Section 1 */} Pagination: Basic Example #1.01

Default example

Previous 1 2 3 Next
Pagination: Disabled State #1.02

Disabled example

Previous 1 2 3 Next
Pagination: Active State #1.03

Active example

Previous 1 2 3 Next
{ /* END Section 1 */} { /* START Header 2 */} Looking to use an icon or symbol in place of text for some pagination links? Be sure to provide proper screen reader support with aria attributes and the .sr-only utility. )} /> { /* END Header 2 */} { /* START Section 2 */} Pagination: Icons #2.01

Icons example

1 2 3
Pagination: Icons #2.02

Icons example

1 2 3
Pagination: Icons #2.03

Icons example

1 2 3
Pagination: Icons #2.04

Icons example

1 2 3
Pagination: Icons #2.05

Icons example

1 2 3
Pagination: Icons #2.05

Icons example

1 2 3
{ /* END Section 2 */} { /* START Header 3 */} Fancy larger or smaller pagination? Add .pagination-lg or .pagination-sm for additional sizes. )} /> { /* END Header 3 */} { /* START Section 3 */} Pagination: Large #3.01

Large example

1 2 3
Pagination: Default #3.02

Default example

1 2 3
Pagination: Small #3.03

Small example

1 2 3
{ /* END Section 3 */} ); export default Paginations;