From 5c5fc245b3e5200d465490af5a8053f816bc457f Mon Sep 17 00:00:00 2001
From: Josh Creek <8179928+jcreek@users.noreply.github.com>
Date: Tue, 12 Nov 2024 20:25:26 +0000
Subject: [PATCH] feat(#76): Improve accessibility

---
 src/routes/account/+page.svelte | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/routes/account/+page.svelte b/src/routes/account/+page.svelte
index 53d609e..e9bae73 100644
--- a/src/routes/account/+page.svelte
+++ b/src/routes/account/+page.svelte
@@ -170,7 +170,11 @@
 
 				<!-- Pagination Form -->
 				<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="endingBefore" value={endingBefore} />
 
@@ -180,6 +184,7 @@
 							value="previous"
 							class="btn btn-outline"
 							disabled={!hasPreviousPage || loading}
+							aria-label="View previous page of transactions"
 							on:click={() => {
 								if (transactions.length) {
 									endingBefore = transactions[0].id;
@@ -196,6 +201,7 @@
 							value="next"
 							class="btn btn-outline"
 							disabled={!hasNextPage || loading}
+							aria-label="View next page of transactions"
 							on:click={() => {
 								if (transactions.length) {
 									startingAfter = transactions[transactions.length - 1].id;