diff options
Diffstat (limited to '')
| -rw-r--r-- | app/src/lib/svelte/Navigation.svelte | 30 | 
1 files changed, 25 insertions, 5 deletions
| diff --git a/app/src/lib/svelte/Navigation.svelte b/app/src/lib/svelte/Navigation.svelte index 724f821..9246c28 100644 --- a/app/src/lib/svelte/Navigation.svelte +++ b/app/src/lib/svelte/Navigation.svelte @@ -1,6 +1,12 @@  <script lang="ts">    import { page } from '$app/stores'; +    import Icon from '@iconify/svelte'; +  import homeIcon from '@iconify/icons-carbon/home'; +  import logoGithub from '@iconify/icons-carbon/logo-github'; +  import menuIcon from '@iconify/icons-carbon/menu'; +  import pageBreak from '@iconify/icons-carbon/page-break'; +    import { AppRail, AppRailAnchor, getDrawerStore } from '@skeletonlabs/skeleton';    const drawerStore = getDrawerStore(); @@ -8,13 +14,25 @@    function drawerClose(): void {      drawerStore.close();    } + +  // Hamburgers +  export let menu = false;  </script>  <AppRail> -  <svelte:fragment slot="lead"></svelte:fragment> -  <AppRailAnchor href="/" selected={$page.url.pathname === '/'} on:click={drawerClose}> +  <svelte:fragment slot="lead"> +    {#if menu} +      <AppRailAnchor on:click={drawerClose} title="Close Menu" value={0}> +        <svelte:fragment slot="lead"> +          <Icon icon={menuIcon} width="25" /> +        </svelte:fragment> +        Close Menu +      </AppRailAnchor> +    {/if} +  </svelte:fragment> +  <AppRailAnchor href="/" selected={$page.url.pathname === '/'} on:click={drawerClose} title="Home">      <svelte:fragment slot="lead"> -      <Icon icon="carbon:home" width="35" /> +      <Icon icon={homeIcon} width="35" />      </svelte:fragment>      Home!    </AppRailAnchor> @@ -22,9 +40,10 @@      href="/truncate"      selected={$page.url.pathname === '/truncate'}      on:click={drawerClose} +    title="Truncate"    >      <svelte:fragment slot="lead"> -      <Icon icon="carbon:page-break" width="35" /> +      <Icon icon={pageBreak} width="35" />      </svelte:fragment>      Truncate!    </AppRailAnchor> @@ -33,9 +52,10 @@        href="https://github.com/rosstheross/rosstheross.github.io"        rel="noreferrer"        on:click={drawerClose} +      title=""      >        <svelte:fragment slot="lead"> -        <Icon icon="carbon:logo-github" width="35" /> +        <Icon icon={logoGithub} width="35" />        </svelte:fragment>        Source!      </AppRailAnchor> | 
