♿ Added aria-labels
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
@@ -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"
|
||||||
|
|||||||
@@ -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"
|
||||||
|
|||||||
Reference in New Issue
Block a user