Fix accessibility issues

src/components/atoms/ButtonCircle.svelte

@@ -7,6 +7,7 @@
     export let form: string = undefined
     export let clone: boolean = false
     export let disabled: boolean = undefined
+    export let label: string = undefined
 
     const className = 'button-circle'
     const classes = [
@@ -18,7 +19,7 @@
 </script>
 
 {#if tag === 'a'}
-    <a href={url} class={classes} tabindex="0" on:click>
+    <a href={url} class={classes} tabindex="0" aria-label={label} on:click>
         {#if clone}
             {#each Array(2) as _}
                 <slot />
@@ -28,7 +29,7 @@
         {/if}
     </a>
 {:else}
-    <button {type} {form} class={classes} disabled={disabled} tabindex="0" on:click>
+    <button {type} {form} class={classes} disabled={disabled} tabindex="0" aria-label={label} on:click>
         {#if clone}
             {#each Array(2) as _}
                 <slot />

src/components/molecules/EmailForm.svelte

@@ -25,6 +25,7 @@
                 type="submit" form="sib-form"
                 color="pink" size="small"
                 clone={true}
+                label="Subscribe"
             >
                 <IconArrow color="white" />
             </ButtonCircle>

src/components/molecules/Location.svelte

@@ -56,7 +56,7 @@
     }
 </script>
 
-<div class="location" role="listitem" bind:this={locationEl}
+<div class="location" bind:this={locationEl}
     style="--offset-x: {$offset.x}px; --offset-y: {$offset.y}px; --rotate: {$offset.x * 0.125}deg"
 >
     <a href="/{location.country.slug}/{location.slug}"

src/components/molecules/Switcher.svelte

@@ -56,20 +56,18 @@
     class:is-open={isOpen}
     class:is-over={isOver}
 >
-    <nav class="switcher__links">
+    <ul class="switcher__links">
-        <ul>
+        {#each links as { icon, iconLabel, url, text }}
-            {#each links as { icon, iconLabel, url, text }}
+            <li class:is-active={$page.path.startsWith(url)}>
-                <li class:is-active={$page.path.startsWith(url)}>
+                <a href={url} on:click={toggleSwitcher}
-                    <a href={url} on:click={toggleSwitcher}
+                    sveltekit:noscroll sveltekit:prefetch
-                        sveltekit:noscroll sveltekit:prefetch
+                >
-                    >
+                    <Icon class="icon" icon={icon} label={iconLabel} />
-                        <Icon class="icon" icon={icon} label={iconLabel} />
+                    <span>{text}</span>
-                        <span>{text}</span>
+                </a>
-                    </a>
+            </li>
-                </li>
+        {/each}
-            {/each}
+    </ul>
-        </ul>
-    </nav>
 
     <button class="switcher__button" title="{!isOpen ? 'Open' : 'Close'} menu" tabindex="0"
         on:click={toggleSwitcher}

src/components/organisms/Locations.svelte

@@ -43,7 +43,7 @@
         <p>{explore_list}</p>
     </div>
 
-    <ul class="browse__continents" role="navigation">
+    <ul class="browse__continents">
         {#each continents as { name, slug }}
             <li class:is-disabled={currentContinent && currentContinent !== slug}>
                 <Button

src/components/organisms/Shop.svelte

@@ -35,7 +35,7 @@
         </div>
 
         <div class="shop__content">
-            <h3 class="title-medium">{shop.module_title}</h3>
+            <h2 class="title-medium">{shop.module_title}</h2>
             <p class="text-small">{shop.module_text}</p>
             {#if shop.enabled}
                 <Button url="/shop" text="Shop" color="pinklight" />

src/routes/index.svelte

@@ -148,7 +148,7 @@
         </div>
     </div>
 
-    <section class="homepage__locations" id="locations">
+    <section class="homepage__locations">
         <InteractiveGlobe />
 
         <ScrollingTitle

src/routes/locations.svelte

@@ -23,7 +23,7 @@
         text="Explore the globe to discover unique locations across the world"
     />
 
-    <section class="explore__locations" id="locations">
+    <section class="explore__locations">
         <InteractiveGlobe />
         <Locations {locations} />
     </section>