diff options
Diffstat (limited to 'ui/routes/+layout.svelte')
| -rw-r--r-- | ui/routes/+layout.svelte | 48 |
1 files changed, 34 insertions, 14 deletions
diff --git a/ui/routes/+layout.svelte b/ui/routes/+layout.svelte index 0140699..eb29179 100644 --- a/ui/routes/+layout.svelte +++ b/ui/routes/+layout.svelte @@ -1,21 +1,41 @@ <script> - import { AppBar } from '@skeletonlabs/skeleton'; - import "../app.css"; + import "../app.css"; + import logo from '$lib/assets/logo.png'; - import { currentUser } from '$lib/store'; - import CurrentUser from '$lib/components/CurrentUser.svelte'; + import { onMount } from 'svelte'; + + import { AppBar } from '@skeletonlabs/skeleton'; + import { showMenu, currentUser } from '$lib/store'; + + import CurrentUser from '$lib/components/CurrentUser.svelte'; + + function toggleMenu() { + showMenu.update((value) => !value); + } + + onMount(() => { + Notification.requestPermission().then((result) => { + console.log(result); + }); + }); </script> -<div id="app"> - <AppBar> - <svelte:fragment slot="lead">🌳</svelte:fragment> - <a href="/">understory</a> - <svelte:fragment slot="trail"> - {#if $currentUser} - <CurrentUser /> - {/if} - </svelte:fragment> - </AppBar> +<div id="app" class="m-0 p-0 h-vh w-full"> + <div class="w-full"> + <AppBar class="app-bar"> + <svelte:fragment slot="lead"> + <a on:click|preventDefault={toggleMenu} class="cursor-pointer"> + <img class="w-8 h-8" alt="logo" src={logo} /> + </a> + </svelte:fragment> + <a href="/">understory</a> + <svelte:fragment slot="trail"> + {#if $currentUser} + <CurrentUser /> + {/if} + </svelte:fragment> + </AppBar> + </div> <slot /> </div> |