diff options
Diffstat (limited to 'app/src/lib/svelte')
| -rw-r--r-- | app/src/lib/svelte/Navigation.svelte | 42 |
1 files changed, 38 insertions, 4 deletions
diff --git a/app/src/lib/svelte/Navigation.svelte b/app/src/lib/svelte/Navigation.svelte index fd3c914..973924a 100644 --- a/app/src/lib/svelte/Navigation.svelte +++ b/app/src/lib/svelte/Navigation.svelte @@ -1,11 +1,45 @@ <script lang="ts"> - import { AppRail, AppRailAnchor } from '@skeletonlabs/skeleton'; + import Icon from '@iconify/svelte'; + import { AppRail, AppRailAnchor, getDrawerStore } from '@skeletonlabs/skeleton'; import { page } from '$app/stores'; + + const drawerStore = getDrawerStore(); + + function drawerClose(): void { + drawerStore.close(); + } </script> -<AppRail> +<AppRail data-sveltekit-reload> <svelte:fragment slot="lead"> - <AppRailAnchor href="/" selected={$page.url.pathname === '/'}>Home!</AppRailAnchor> + <AppRailAnchor href="/" selected={$page.url.pathname === '/'} on:click={drawerClose}> + <svelte:fragment slot="lead"> + <Icon icon="carbon:home" width="35" /> + </svelte:fragment> + Home! + </AppRailAnchor> + </svelte:fragment> + <AppRailAnchor + href="/truncate" + selected={$page.url.pathname === '/truncate'} + data-sveltekit-reload + on:click={drawerClose} + > + <svelte:fragment slot="lead"> + <Icon icon="carbon:page-break" width="35" /> + </svelte:fragment> + Truncate! + </AppRailAnchor> + <svelte:fragment slot="trail"> + <AppRailAnchor + href="https://github.com/rosstheross/rosstheross.github.io" + rel="noreferrer" + target="_blank" + > + <svelte:fragment slot="lead"> + <Icon icon="carbon:logo-github" width="35" /> + </svelte:fragment> + Source + </AppRailAnchor> </svelte:fragment> - <AppRailAnchor href="/truncate" selected={$page.url.pathname === '/truncate'}>Truncate!</AppRailAnchor> </AppRail> |