From 5c4f2af9d6f459798bfe993c0b8d505678be41eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hampus=20Ed=C3=A9n?=
 <139706227+lego-eden@users.noreply.github.com>
Date: Sat, 9 Nov 2024 21:11:38 +0100
Subject: [PATCH] fix: tab navigation not working for theme toggle (#555)

---
 src/routes/DarkLightToggle.svelte | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/routes/DarkLightToggle.svelte b/src/routes/DarkLightToggle.svelte
index 1f1fe537a..313c9783f 100644
--- a/src/routes/DarkLightToggle.svelte
+++ b/src/routes/DarkLightToggle.svelte
@@ -16,17 +16,14 @@
   };
 </script>
 
-<label class={twMerge("btn btn-ghost swap swap-rotate *:text-2xl", clazz)}>
-  <!-- this hidden checkbox controls the state -->
-  <input
-    type="checkbox"
-    bind:checked={isCurrentThemeLight}
-    on:click={toggleTheme}
-  />
-
+<button
+  class={twMerge("btn btn-ghost swap swap-rotate *:text-2xl", clazz)}
+  class:swap-active={isCurrentThemeLight}
+  on:click={toggleTheme}
+>
   <!-- moon icon -->
   <span class="swap-on i-mdi-weather-night" />
 
   <!-- sun icon -->
   <span class="swap-off i-mdi-weather-sunny" />
-</label>
+</button>