christoph/svelte-formula11
1
Fork 0
Code Issues 23 Actions Packages Projects 1 Activity

Skeleton: Update drawer switch timeout

Browse Source
This commit is contained in:
Christoph Urlacher
2024-12-16 18:17:43 +01:00
parent 8bf96e3380
commit 3cffab193b
1 changed files with 26 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/routes/+layout.svelte
View File

@ -48,7 +48,7 @@
} else { } else {
// We clicked another button to open another drawer // We clicked another button to open another drawer
drawerStore.close(); drawerStore.close();
setTimeout(() => drawerStore.open(settings), 200); setTimeout(() => drawerStore.open(settings), 175);
} }
} else { } else {
drawerStore.open(settings); drawerStore.open(settings);
@ -116,11 +116,11 @@
<Drawer> <Drawer>
<!-- Use p-3 because the drawer has a 5px overlap with the navbar --> <!-- Use p-3 because the drawer has a 5px overlap with the navbar -->
<div class="flex flex-col gap-2 p-3">
{#if $drawerStore.id === "menu_drawer"} {#if $drawerStore.id === "menu_drawer"}
<!-- Menu Drawer --> <!-- Menu Drawer -->
<!-- Menu Drawer --> <!-- Menu Drawer -->
<!-- Menu Drawer --> <!-- Menu Drawer -->
<div class="flex flex-col gap-2 p-3">
<Button href="/racepicks" onclick={close_drawer} color="surface" fullwidth>Race Picks</Button> <Button href="/racepicks" onclick={close_drawer} color="surface" fullwidth>Race Picks</Button>
<Button href="/seasonpicks" onclick={close_drawer} color="surface" fullwidth <Button href="/seasonpicks" onclick={close_drawer} color="surface" fullwidth
>Season Picks >Season Picks
@ -132,19 +132,23 @@
>Statistics >Statistics
</Button> </Button>
<Button href="/rules" onclick={close_drawer} color="surface" fullwidth>Rules</Button> <Button href="/rules" onclick={close_drawer} color="surface" fullwidth>Rules</Button>
</div>
{:else if $drawerStore.id === "data_drawer"} {:else if $drawerStore.id === "data_drawer"}
<!-- Data Drawer --> <!-- Data Drawer -->
<!-- Data Drawer --> <!-- Data Drawer -->
<!-- Data Drawer --> <!-- Data Drawer -->
<div class="flex flex-col gap-2 p-3">
<Button href="/data/raceresult" onclick={close_drawer} color="surface" fullwidth <Button href="/data/raceresult" onclick={close_drawer} color="surface" fullwidth
>Race Results >Race Results
</Button> </Button>
<Button href="/data/season" onclick={close_drawer} color="surface" fullwidth>Season</Button> <Button href="/data/season" onclick={close_drawer} color="surface" fullwidth>Season</Button>
<Button href="/data/user" onclick={close_drawer} color="surface" fullwidth>Users</Button> <Button href="/data/user" onclick={close_drawer} color="surface" fullwidth>Users</Button>
</div>
{:else if $drawerStore.id === "login_drawer"} {:else if $drawerStore.id === "login_drawer"}
<!-- Login Drawer --> <!-- Login Drawer -->
<!-- Login Drawer --> <!-- Login Drawer -->
<!-- Login Drawer --> <!-- Login Drawer -->
<div class="flex flex-col gap-2 p-3">
<h4 class="h4 select-none">Enter Username and Password</h4> <h4 class="h4 select-none">Enter Username and Password</h4>
<form method="POST" class="contents"> <form method="POST" class="contents">
<!-- Supply the pathname so the form can redirect to the current page. --> <!-- Supply the pathname so the form can redirect to the current page. -->
@ -168,10 +172,12 @@
</Button> </Button>
</div> </div>
</form> </form>
</div>
{:else if $drawerStore.id === "profile_drawer" && data.user} {:else if $drawerStore.id === "profile_drawer" && data.user}
<!-- Profile Drawer --> <!-- Profile Drawer -->
<!-- Profile Drawer --> <!-- Profile Drawer -->
<!-- Profile Drawer --> <!-- Profile Drawer -->
<div class="flex flex-col gap-2 p-3">
<h4 class="h4 select-none">Edit Profile</h4> <h4 class="h4 select-none">Edit Profile</h4>
<form method="POST" enctype="multipart/form-data" class="contents"> <form method="POST" enctype="multipart/form-data" class="contents">
<!-- Supply the pathname so the form can redirect to the current page. --> <!-- Supply the pathname so the form can redirect to the current page. -->
@ -205,8 +211,8 @@
</Button> </Button>
</div> </div>
</form> </form>
{/if}
</div> </div>
{/if}
</Drawer> </Drawer>
<nav> <nav>