Added aria-labels

This commit is contained in:
Mawoka
2022-09-17 11:11:44 +02:00
parent 2e979451e4
commit b19ae6ac8a
3 changed files with 11 additions and 0 deletions
+1
View File
@@ -118,6 +118,7 @@
set_language(selected_language); set_language(selected_language);
}} }}
class="p-2 rounded-lg bg-gray-800 focus:ring-2 ring-blue-600 text-white" class="p-2 rounded-lg bg-gray-800 focus:ring-2 ring-blue-600 text-white"
aria-label="Language-Selector"
> >
{#each languages as lang} {#each languages as lang}
<option value={lang.code}>{lang.flag} {lang.name} </option> <option value={lang.code}>{lang.flag} {lang.name} </option>
+4
View File
@@ -180,11 +180,13 @@
switchDarkMode(false); switchDarkMode(false);
}} }}
use:tippy={{ content: 'Switch light mode on' }} use:tippy={{ content: 'Switch light mode on' }}
aria-label="Activate light mode"
> >
<!-- Heroicons: sun --> <!-- Heroicons: sun -->
<svg <svg
class="w-6 h-6 text-black" class="w-6 h-6 text-black"
fill="none" fill="none"
aria-label="Sun-Icon"
stroke="currentColor" stroke="currentColor"
viewBox="0 0 24 24" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@@ -203,10 +205,12 @@
on:click={() => { on:click={() => {
switchDarkMode(true); switchDarkMode(true);
}} }}
aria-label="Activate darkmode"
use:tippy={{ content: 'Switch dark mode on' }} use:tippy={{ content: 'Switch dark mode on' }}
> >
<!-- Heroicons: moon --> <!-- Heroicons: moon -->
<svg <svg
aria-label="Moon-Icon"
class="w-6 h-6" class="w-6 h-6"
fill="none" fill="none"
stroke="currentColor" stroke="currentColor"
+6
View File
@@ -253,6 +253,7 @@
class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg" class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
> >
<svg <svg
aria-label="Pencil-Icon"
class="w-8 h-8" class="w-8 h-8"
fill="none" fill="none"
stroke="currentColor" stroke="currentColor"
@@ -287,6 +288,7 @@
stroke="currentColor" stroke="currentColor"
viewBox="0 0 24 24" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
aria-label="magnifying glass-Icon"
> >
<path <path
stroke-linecap="round" stroke-linecap="round"
@@ -316,6 +318,7 @@
stroke="currentColor" stroke="currentColor"
viewBox="0 0 24 24" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
aria-label="Cloud with arrow pointing down"
> >
<path <path
stroke-linecap="round" 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" class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
> >
<svg <svg
aria-label="Mouse-Click icon"
class="w-8 h-8" class="w-8 h-8"
fill="none" fill="none"
stroke="currentColor" 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" class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
> >
<svg <svg
aria-label="context-menu icon"
class="w-8 h-8" class="w-8 h-8"
fill="none" fill="none"
stroke="currentColor" 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" class="rounded-lg bg-emerald-300 w-fit p-1 bg-lime-500 hover:bg-lime-400 transition shadow-lg"
> >
<svg <svg
aria-label="sparkling stars-icon"
class="w-8 h-8" class="w-8 h-8"
fill="none" fill="none"
stroke="currentColor" stroke="currentColor"