Fascinated/scoresaber-reloaded-v2
1
2
Fork 0
Code Issues 1 Pull Requests 10 Actions Activity

add accessability to pagination
All checks were successful
deploy / deploy (push) Successful in 53s
Details

Browse Source
This commit is contained in:
Lee 2023-10-24 13:38:15 +01:00
parent ec23a73e0e
commit 647b9621c5
1 changed files with 5 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Pagination.tsx
View File

@ -31,6 +31,7 @@ export default function Pagination(props: PaginationProps) {
<button
className="px-3 py-1"
onClick={() => onPageChange(currentPage - 1)}
aria-label="Previous Page"
>
<ArrowUturnLeftIcon width={20} height={20} />
</button>
@ -43,6 +44,7 @@ export default function Pagination(props: PaginationProps) {
<button
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
onClick={() => onPageChange(1)}
aria-label="First Page"
>
1
</button>
@ -60,6 +62,7 @@ export default function Pagination(props: PaginationProps) {
: "bg-neutral-700 hover:opacity-80"
}`}
onClick={() => onPageChange(pageNumber)}
aria-label={`Page ${pageNumber}`}
>
{pageNumber}
</button>
@ -74,6 +77,7 @@ export default function Pagination(props: PaginationProps) {
<button
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
onClick={() => onPageChange(totalPages)}
aria-label="Last Page"
>
{totalPages}
</button>
@ -86,6 +90,7 @@ export default function Pagination(props: PaginationProps) {
<button
className="px-3 py-1"
onClick={() => onPageChange(currentPage + 1)}
aria-label="Next Page"
>
<ArrowUturnRightIcon width={20} height={20} />
</button>