From d72c30ca5130001cce4f6a352bf5b33a4fe40861 Mon Sep 17 00:00:00 2001
From: Shuveksha Tuladhar <tuladhar.shuveksha@gmail.com>
Date: Tue, 15 Oct 2024 17:02:41 -0700
Subject: [PATCH] Change aria-label for theme button

---
 src/views/Layout.jsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/views/Layout.jsx b/src/views/Layout.jsx
index b2566d0b..a1c152e 100644
--- a/src/views/Layout.jsx
+++ b/src/views/Layout.jsx
@@ -45,13 +45,18 @@ export function Layout() {
 					{/* Theme toggle button */}
 					<button
 						onClick={toggleTheme}
-						className="bg-gray-200 dark:bg-gray-800 rounded absolute top-[max(2vw,20px)] right-[max(2vw,20px)] "
-						aria-label="Toggle Dark Mode"
+						className="bg-transparent rounded absolute top-[max(2vw,20px)] right-[max(2vw,20px)]"
 					>
 						{theme === 'dark' ? (
-							<FaSun className="text-yellow-500 h-10 w-10 " />
+							<FaSun
+								className="text-yellow-500 h-10 w-10"
+								aria-label="Switch to light mode"
+							/>
 						) : (
-							<FaMoon className="text-blue-500 h-10 w-10" />
+							<FaMoon
+								className="text-blue-500 h-10 w-10"
+								aria-label="Switch to dark mode"
+							/>
 						)}
 					</button>
 				</header>