diff options
Diffstat (limited to '')
| -rw-r--r-- | app/src/routes/+layout.svelte | 46 |
1 files changed, 33 insertions, 13 deletions
diff --git a/app/src/routes/+layout.svelte b/app/src/routes/+layout.svelte index 6ad0d22..519a11d 100644 --- a/app/src/routes/+layout.svelte +++ b/app/src/routes/+layout.svelte @@ -2,11 +2,19 @@ import { useRegisterSW } from 'virtual:pwa-register/svelte'; import { pwaInfo } from 'virtual:pwa-info'; import { onMount } from 'svelte'; + import { + AppShell, + AppBar, + getDrawerStore, + getToastStore, + initializeStores, + Toast, + Drawer + } from '@skeletonlabs/skeleton'; - import '../app.postcss'; - import { AppShell, AppBar, getToastStore, initializeStores, Toast } from '@skeletonlabs/skeleton'; import Navigation from '$lib/svelte/Navigation.svelte'; + import '../app.postcss'; // Floating UI for Popups // import { computePosition, autoUpdate, flip, shift, offset, arrow } from '@floating-ui/dom'; // import { storePopup } from '@skeletonlabs/skeleton'; @@ -14,8 +22,15 @@ initializeStores(); + const drawerStore = getDrawerStore(); const toastStore = getToastStore(); + function drawerOpen() { + drawerStore.open({ + width: 'w-[80px]' + }); + } + onMount(async () => { if (pwaInfo) { useRegisterSW({ @@ -46,25 +61,30 @@ {@html webManifestLink} </svelte:head> +<Drawer> + <Navigation /> +</Drawer> + <Toast position="br" /> <!-- App Shell --> -<AppShell> +<AppShell slotSidebarLeft="w-0 lg:w-64"> <svelte:fragment slot="header"> <!-- App Bar --> <AppBar> <svelte:fragment slot="lead"> + <div class="flex items-center"> + <button class="lg:hidden btn btn-sm mr-4" on:click={drawerOpen}> + <span> + <svg viewBox="0 0 100 80" class="fill-token w-4 h-4"> + <rect width="100" height="20" /> + <rect y="30" width="100" height="20" /> + <rect y="60" width="100" height="20" /> + </svg> + </span> + </button> <strong class="text-xl uppercase">A!</strong> - </svelte:fragment> - <svelte:fragment slot="trail"> - <a - class="btn btn-sm variant-ghost-surface" - href="https://github.com/rosstheross/rosstheross.github.io" - target="_blank" - rel="noreferrer" - > - Frontend Source - </a> + </div> </svelte:fragment> </AppBar> </svelte:fragment> |