Fix broken styles from global <nav> styles
MODIFY
src/components/docs/mobile-menu/sub-menu.svelte
src/components/docs/mobile-menu/sub-menu.svelte
</div>
</button>
- <nav class={`px-4 ${$subMenuState ? "block" : "hidden"}`} id="sub-menu">
+ <div
+ aria-label={currentSection.title}
+ role="navigation"
+ class={`px-4 ${$subMenuState ? "block" : "hidden"}`}
+ id="sub-menu"
+ >
<ul>
{#each currentSection.subMenu as sub}
<MenuItem href={sub.path} onClick={() => ($subMenuState = false)}>
</MenuItem>
{/each}
</ul>
- </nav>
+ </div>
</div>
{/if}

MODIFY
src/components/docs/mobile-menu/topics.svelte
src/components/docs/mobile-menu/topics.svelte
export let MENU;
</script>
-<nav>
+<div role="navigation" aria-label="All topics">
<ul>
{#each MENU as menuItem}
<MenuItem
</MenuItem>
{/each}
</ul>
-</nav>
+</div>

Fix broken styles from global <nav> styles