From 2313e8ff0ef8ce98cacb0fa4ed82df4897a4399a Mon Sep 17 00:00:00 2001
From: Sean Morley <git@seanmorley.com>
Date: Tue, 31 Mar 2026 22:02:30 -0400
Subject: [PATCH] Set tabindex to -1 for dropdown menus to improve
 accessibility

---
 frontend/src/lib/components/Avatar.svelte                     | 2 +-
 frontend/src/lib/components/CategoryDropdown.svelte           | 1 +
 frontend/src/lib/components/Navbar.svelte                     | 4 ++--
 frontend/src/lib/components/StravaActivityCard.svelte         | 2 +-
 frontend/src/lib/components/cards/CollectionCard.svelte       | 2 ++
 .../components/collections/CollectionItineraryPlanner.svelte  | 1 +
 frontend/src/lib/components/map/MapStyleSelector.svelte       | 1 +
 frontend/src/lib/components/shared/CurrencyDropdown.svelte    | 2 +-
 frontend/src/routes/collections/+page.svelte                  | 1 +
 frontend/src/routes/collections/[id]/+page.svelte             | 1 +
 frontend/src/routes/locations/+page.svelte                    | 1 +
 frontend/src/routes/locations/[id]/+page.svelte               | 1 +
 12 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/components/Avatar.svelte b/frontend/src/lib/components/Avatar.svelte
index 135b077a..2bc807ed 100644
--- a/frontend/src/lib/components/Avatar.svelte
+++ b/frontend/src/lib/components/Avatar.svelte
@@ -88,7 +88,7 @@
 
 	<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
 	<ul
-		tabindex="0"
+		tabindex="-1"
 		class="dropdown-content z-[100] menu p-4 shadow-2xl bg-base-100 border border-base-300 rounded-2xl w-72 mt-2"
 	>
 		<!-- User Info Header -->
diff --git a/frontend/src/lib/components/CategoryDropdown.svelte b/frontend/src/lib/components/CategoryDropdown.svelte
index 61b2a779..bc2195a1 100644
--- a/frontend/src/lib/components/CategoryDropdown.svelte
+++ b/frontend/src/lib/components/CategoryDropdown.svelte
@@ -342,6 +342,7 @@
 		</div>
 
 		<div
+			tabindex="-1"
 			class="dropdown-content z-[1] w-full mt-1 bg-base-100 rounded-box shadow-xl border border-base-300 max-h-[28rem] overflow-y-auto hidden sm:block"
 		>
 			<div class="p-4 border-b border-base-300 space-y-3">
diff --git a/frontend/src/lib/components/Navbar.svelte b/frontend/src/lib/components/Navbar.svelte
index ce2cdb86..02a7acfc 100644
--- a/frontend/src/lib/components/Navbar.svelte
+++ b/frontend/src/lib/components/Navbar.svelte
@@ -133,7 +133,7 @@
 			</div>
 			<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
 			<ul
-				tabindex="0"
+				tabindex="-1"
 				class="menu dropdown-content mt-3 z-[999] p-4 shadow-2xl bg-base-100 border border-base-300 rounded-2xl gap-2 w-80 max-h-[80vh] overflow-y-auto"
 			>
 				{#if data.user}
@@ -276,7 +276,7 @@
 			</div>
 			<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
 			<ul
-				tabindex="0"
+				tabindex="-1"
 				class="dropdown-content bg-base-100 border border-base-300 shadow-2xl z-[999] menu p-4 rounded-2xl w-80"
 			>
 				<!-- Quick Actions -->
diff --git a/frontend/src/lib/components/StravaActivityCard.svelte b/frontend/src/lib/components/StravaActivityCard.svelte
index 8598d8ff..1d03b330 100644
--- a/frontend/src/lib/components/StravaActivityCard.svelte
+++ b/frontend/src/lib/components/StravaActivityCard.svelte
@@ -164,7 +164,7 @@
 						</div>
 						<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
 						<ul
-							tabindex="0"
+							tabindex="-1"
 							class="dropdown-content menu bg-base-100 rounded-box z-[1] w-52 p-2 shadow"
 						>
 							<li>
diff --git a/frontend/src/lib/components/cards/CollectionCard.svelte b/frontend/src/lib/components/cards/CollectionCard.svelte
index 4b59ce96..2098ce0c 100644
--- a/frontend/src/lib/components/cards/CollectionCard.svelte
+++ b/frontend/src/lib/components/cards/CollectionCard.svelte
@@ -336,6 +336,7 @@
 								<DotsHorizontal class="w-5 h-5" />
 							</button>
 							<ul
+								tabindex="-1"
 								class="dropdown-content menu bg-base-100 rounded-box z-[1] w-64 p-2 shadow-xl border border-base-300"
 							>
 								{#if type != 'viewonly'}
@@ -437,6 +438,7 @@
 								<DotsHorizontal class="w-5 h-5" />
 							</button>
 							<ul
+								tabindex="-1"
 								class="dropdown-content menu bg-base-100 rounded-box z-[1] w-64 p-2 shadow-xl border border-base-300"
 							>
 								<li>
diff --git a/frontend/src/lib/components/collections/CollectionItineraryPlanner.svelte b/frontend/src/lib/components/collections/CollectionItineraryPlanner.svelte
index 2a6e2fbe..31b9a042 100644
--- a/frontend/src/lib/components/collections/CollectionItineraryPlanner.svelte
+++ b/frontend/src/lib/components/collections/CollectionItineraryPlanner.svelte
@@ -1967,6 +1967,7 @@
 										<Plus class="w-5 h-5" />
 									</button>
 									<ul
+										tabindex="-1"
 										class="dropdown-content menu p-2 shadow bg-base-300 rounded-box w-56"
 										role="menu"
 									>
diff --git a/frontend/src/lib/components/map/MapStyleSelector.svelte b/frontend/src/lib/components/map/MapStyleSelector.svelte
index ec56a042..9044e10e 100644
--- a/frontend/src/lib/components/map/MapStyleSelector.svelte
+++ b/frontend/src/lib/components/map/MapStyleSelector.svelte
@@ -42,6 +42,7 @@
 	</div>
 	{#if basemapOptions?.length}
 		<div
+			tabindex="-1"
 			class="dropdown-content z-20 shadow-lg bg-base-200 rounded-box w-54 max-h-80 overflow-y-auto overflow-x-hidden p-3"
 			role="menu"
 		>
diff --git a/frontend/src/lib/components/shared/CurrencyDropdown.svelte b/frontend/src/lib/components/shared/CurrencyDropdown.svelte
index af909fa7..8654c772 100644
--- a/frontend/src/lib/components/shared/CurrencyDropdown.svelte
+++ b/frontend/src/lib/components/shared/CurrencyDropdown.svelte
@@ -127,7 +127,7 @@
 		</svg>
 	</button>
 
-	<div class="dropdown-content z-50 w-full">
+	<div tabindex="-1" class="dropdown-content z-50 w-full">
 		<div class="card border border-base-300 bg-base-100 shadow-xl w-80 max-w-full">
 			<div class="p-3 space-y-3">
 				<label class="input input-bordered flex items-center gap-2">
diff --git a/frontend/src/routes/collections/+page.svelte b/frontend/src/routes/collections/+page.svelte
index 4280fcb5..7b6d07d2 100644
--- a/frontend/src/routes/collections/+page.svelte
+++ b/frontend/src/routes/collections/+page.svelte
@@ -797,6 +797,7 @@
 					<Plus class="w-8 h-8" />
 				</div>
 				<ul
+					tabindex="-1"
 					class="dropdown-content z-[1] menu p-4 shadow-2xl bg-base-100 rounded-2xl w-64 border border-base-300"
 				>
 					<div class="text-center mb-4">
diff --git a/frontend/src/routes/collections/[id]/+page.svelte b/frontend/src/routes/collections/[id]/+page.svelte
index 8cfd8257..e184a225 100644
--- a/frontend/src/routes/collections/[id]/+page.svelte
+++ b/frontend/src/routes/collections/[id]/+page.svelte
@@ -1536,6 +1536,7 @@
 				<Plus class="w-8 h-8" />
 			</div>
 			<ul
+				tabindex="-1"
 				class="dropdown-content z-[1] menu p-4 shadow bg-base-300 text-base-content rounded-box w-52 gap-4"
 			>
 				<p class="text-center font-bold text-lg">{$t('adventures.link_new')}</p>
diff --git a/frontend/src/routes/locations/+page.svelte b/frontend/src/routes/locations/+page.svelte
index b1ed0ca2..cc2137a4 100644
--- a/frontend/src/routes/locations/+page.svelte
+++ b/frontend/src/routes/locations/+page.svelte
@@ -547,6 +547,7 @@
 				<Plus class="w-8 h-8" />
 			</div>
 			<ul
+				tabindex="-1"
 				class="dropdown-content z-[40] menu p-4 shadow-2xl bg-base-100 rounded-2xl w-64 border border-base-300"
 			>
 				<div class="text-center mb-4">
diff --git a/frontend/src/routes/locations/[id]/+page.svelte b/frontend/src/routes/locations/[id]/+page.svelte
index 150dcd40..28539a54 100644
--- a/frontend/src/routes/locations/[id]/+page.svelte
+++ b/frontend/src/routes/locations/[id]/+page.svelte
@@ -220,6 +220,7 @@
 					<DotsVertical class="w-8 h-8" />
 				</button>
 				<ul
+					tabindex="-1"
 					class="dropdown-content menu bg-base-100 rounded-box w-52 p-2 shadow-lg border border-base-300 mb-2"
 				>
 					<li>