From b19ae6ac8a5cb75fd4d9c6ec6ea56de642d45f83 Mon Sep 17 00:00:00 2001
From: Mawoka <git@mawoka.eu>
Date: Sat, 17 Sep 2022 11:11:44 +0200
Subject: [PATCH] :wheelchair: Added aria-labels

---
 frontend/src/lib/language-toggle.svelte | 1 +
 frontend/src/lib/navbar.svelte          | 4 ++++
 frontend/src/routes/+page.svelte        | 6 ++++++
 3 files changed, 11 insertions(+)

diff --git a/frontend/src/lib/language-toggle.svelte b/frontend/src/lib/language-toggle.svelte
index edf120d..9b4998c 100644
--- a/frontend/src/lib/language-toggle.svelte
+++ b/frontend/src/lib/language-toggle.svelte
@@ -118,6 +118,7 @@
 			set_language(selected_language);
 		}}
 		class="p-2 rounded-lg bg-gray-800 focus:ring-2 ring-blue-600 text-white"
+		aria-label="Language-Selector"
 	>
 		{#each languages as lang}
 			<option value={lang.code}>{lang.flag} {lang.name} </option>
diff --git a/frontend/src/lib/navbar.svelte b/frontend/src/lib/navbar.svelte
index 450a5d8..f41d75c 100644
--- a/frontend/src/lib/navbar.svelte
+++ b/frontend/src/lib/navbar.svelte
@@ -180,11 +180,13 @@
 					switchDarkMode(false);
 				}}
 				use:tippy={{ content: 'Switch light mode on' }}
+				aria-label="Activate light mode"
 			>
 				<!-- Heroicons: sun -->
 				<svg
 					class="w-6 h-6 text-black"
 					fill="none"
+					aria-label="Sun-Icon"
 					stroke="currentColor"
 					viewBox="0 0 24 24"
 					xmlns="http://www.w3.org/2000/svg"
@@ -203,10 +205,12 @@
 				on:click={() => {
 					switchDarkMode(true);
 				}}
+				aria-label="Activate darkmode"
 				use:tippy={{ content: 'Switch dark mode on' }}
 			>
 				<!-- Heroicons: moon -->
 				<svg
+					aria-label="Moon-Icon"
 					class="w-6 h-6"
 					fill="none"
 					stroke="currentColor"
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 555b048..8fc9357 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -253,6 +253,7 @@
 						class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
 					>
 						<svg
+							aria-label="Pencil-Icon"
 							class="w-8 h-8"
 							fill="none"
 							stroke="currentColor"
@@ -287,6 +288,7 @@
 							stroke="currentColor"
 							viewBox="0 0 24 24"
 							xmlns="http://www.w3.org/2000/svg"
+							aria-label="magnifying glass-Icon"
 						>
 							<path
 								stroke-linecap="round"
@@ -316,6 +318,7 @@
 							stroke="currentColor"
 							viewBox="0 0 24 24"
 							xmlns="http://www.w3.org/2000/svg"
+							aria-label="Cloud with arrow pointing down"
 						>
 							<path
 								stroke-linecap="round"
@@ -385,6 +388,7 @@
 						class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
 					>
 						<svg
+							aria-label="Mouse-Click icon"
 							class="w-8 h-8"
 							fill="none"
 							stroke="currentColor"
@@ -414,6 +418,7 @@
 						class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
 					>
 						<svg
+							aria-label="context-menu icon"
 							class="w-8 h-8"
 							fill="none"
 							stroke="currentColor"
@@ -443,6 +448,7 @@
 						class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
 					>
 						<svg
+							aria-label="sparkling stars-icon"
 							class="w-8 h-8"
 							fill="none"
 							stroke="currentColor"