mirror of
https://github.com/jcreek/SvelteKitSaasBoilerplate.git
synced 2026-07-15 20:13:50 +00:00
feat(#76): Improve accessibility
This commit is contained in:
@@ -170,7 +170,11 @@
|
|||||||
|
|
||||||
<!-- Pagination Form -->
|
<!-- Pagination Form -->
|
||||||
<form method="post" action="?/paginate" use:enhance={handlePaginationSubmit}>
|
<form method="post" action="?/paginate" use:enhance={handlePaginationSubmit}>
|
||||||
<div class="flex justify-center items-center space-x-2 mt-4">
|
<div
|
||||||
|
class="flex justify-center items-center space-x-2 mt-4"
|
||||||
|
role="navigation"
|
||||||
|
aria-label="Transactions pagination"
|
||||||
|
>
|
||||||
<input type="hidden" name="startingAfter" value={startingAfter} />
|
<input type="hidden" name="startingAfter" value={startingAfter} />
|
||||||
<input type="hidden" name="endingBefore" value={endingBefore} />
|
<input type="hidden" name="endingBefore" value={endingBefore} />
|
||||||
|
|
||||||
@@ -180,6 +184,7 @@
|
|||||||
value="previous"
|
value="previous"
|
||||||
class="btn btn-outline"
|
class="btn btn-outline"
|
||||||
disabled={!hasPreviousPage || loading}
|
disabled={!hasPreviousPage || loading}
|
||||||
|
aria-label="View previous page of transactions"
|
||||||
on:click={() => {
|
on:click={() => {
|
||||||
if (transactions.length) {
|
if (transactions.length) {
|
||||||
endingBefore = transactions[0].id;
|
endingBefore = transactions[0].id;
|
||||||
@@ -196,6 +201,7 @@
|
|||||||
value="next"
|
value="next"
|
||||||
class="btn btn-outline"
|
class="btn btn-outline"
|
||||||
disabled={!hasNextPage || loading}
|
disabled={!hasNextPage || loading}
|
||||||
|
aria-label="View next page of transactions"
|
||||||
on:click={() => {
|
on:click={() => {
|
||||||
if (transactions.length) {
|
if (transactions.length) {
|
||||||
startingAfter = transactions[transactions.length - 1].id;
|
startingAfter = transactions[transactions.length - 1].id;
|
||||||
|
|||||||
Reference in New Issue
Block a user