fix: Navigation Bar Accessibility (#196)

* added aria labels to the Navbar

* wrapped <li> element in <ul>

* Update src/layout/Navbar/NavHost.svelte

Co-authored-by: Ushie <ushiekane@gmail.com>

* update: wrap <li> element in <ul>

---------

Co-authored-by: oSumAtrIX <johan.melkonyan1@web.de>
Co-authored-by: João André Marques <joaoandremarques@MacBook-Pro.local>
Co-authored-by: Ushie <ushiekane@gmail.com>
This commit is contained in:
André
2023-11-25 14:46:20 +00:00
committed by GitHub
parent 6a1db68779
commit 8c7f17cc30
3 changed files with 28 additions and 32 deletions

View File

@@ -3,18 +3,19 @@
export let icon = '';
export let href = '';
export let target = '';
export let label = '';
</script>
<button on:click>
{#if href}
<a {href} {target} {...$$restProps} class={`button-${type}`}>
<a {href} {target} {...$$restProps} class={`button-${type}`} aria-label={label}>
{#if icon}
<img src="../icons/{icon}.svg" alt={icon} />
{/if}
<slot />
</a>
{:else}
<div {...$$restProps} class={`button-${type}`}>
<div {...$$restProps} class={`button-${type}`} aria-label={label}>
{#if icon}
<img src="../icons/{icon}.svg" alt={icon} />
{/if}