App: Add shadows to buttons (except for the header)

This commit is contained in:
2025-01-27 19:44:03 +01:00
parent 986a49377b
commit ec75f97ee5
5 changed files with 39 additions and 15 deletions

View File

@ -133,32 +133,40 @@
<!-- Menu Drawer -->
<!-- Menu Drawer -->
<div class="flex flex-col gap-2 p-2 pt-3">
<Button href="/racepicks" onclick={close_drawer} color="surface" width="w-full">
<Button href="/racepicks" onclick={close_drawer} color="surface" width="w-full" shadow>
Race Picks
</Button>
<Button href="/seasonpicks" onclick={close_drawer} color="surface" width="w-full">
<Button href="/seasonpicks" onclick={close_drawer} color="surface" width="w-full" shadow>
Season Picks
</Button>
<Button href="/leaderboard" onclick={close_drawer} color="surface" width="w-full">
<Button href="/leaderboard" onclick={close_drawer} color="surface" width="w-full" shadow>
Leaderboard
</Button>
<Button href="/statistics" onclick={close_drawer} color="surface" width="w-full">
<Button href="/statistics" onclick={close_drawer} color="surface" width="w-full" shadow>
Statistics
</Button>
<Button href="/rules" onclick={close_drawer} color="surface" width="w-full">Rules</Button>
<Button href="/rules" onclick={close_drawer} color="surface" width="w-full" shadow>
Rules
</Button>
</div>
{:else if $drawerStore.id === "data_drawer"}
<!-- Data Drawer -->
<!-- Data Drawer -->
<!-- Data Drawer -->
<div class="flex flex-col gap-2 p-2 pt-3">
<Button href="/data/raceresults" onclick={close_drawer} color="surface" width="w-full">
<Button href="/data/raceresults" onclick={close_drawer} color="surface" width="w-full" shadow>
Race Results
</Button>
<Button href="/data/season/teams" onclick={close_drawer} color="surface" width="w-full">
<Button
href="/data/season/teams"
onclick={close_drawer}
color="surface"
width="w-full"
shadow
>
Season
</Button>
<Button href="/data/users" onclick={close_drawer} color="surface" width="w-full">
<Button href="/data/users" onclick={close_drawer} color="surface" width="w-full" shadow>
Users
</Button>
</div>
@ -181,7 +189,13 @@
<PasswordIcon />
</Input>
<div class="flex justify-end gap-2">
<Button formaction="/profile?/login" onclick={close_drawer} color="tertiary" submit>
<Button
formaction="/profile?/login"
onclick={close_drawer}
color="tertiary"
submit
shadow
>
Login
</Button>
<Button
@ -189,6 +203,7 @@
onclick={close_drawer}
color="tertiary"
submit
shadow
>
Register
</Button>
@ -225,7 +240,9 @@
name="avatar"
onchange={get_avatar_preview_event_handler("user_avatar_preview")}
>
<svelte:fragment slot="message"><span class="font-bold">Upload Avatar</span></svelte:fragment>
<svelte:fragment slot="message"
><span class="font-bold">Upload Avatar</span></svelte:fragment
>
</FileDropzone>
<div class="flex justify-end gap-2">
<Button
@ -233,10 +250,17 @@
onclick={close_drawer}
color="secondary"
submit
shadow
>
Save Changes
</Button>
<Button formaction="/profile?/logout" onclick={close_drawer} color="primary" submit>
<Button
formaction="/profile?/logout"
onclick={close_drawer}
color="primary"
submit
shadow
>
Logout
</Button>
</div>

View File

@ -100,7 +100,7 @@
</script>
<div class="pb-2">
<Button width="w-full" color="tertiary" onclick={create_driver_handler}>
<Button width="w-full" color="tertiary" onclick={create_driver_handler} shadow>
<span class="font-bold">Create New Driver</span>
</Button>
</div>

View File

@ -72,7 +72,7 @@
</script>
<div class="pb-2">
<Button width="w-full" color="tertiary" onclick={create_race_handler}>
<Button width="w-full" color="tertiary" onclick={create_race_handler} shadow>
<span class="font-bold">Create New Race</span>
</Button>
</div>

View File

@ -129,7 +129,7 @@
</script>
<div class="pb-2">
<Button width="w-full" color="tertiary" onclick={create_substitution_handler}>
<Button width="w-full" color="tertiary" onclick={create_substitution_handler} shadow>
<span class="font-bold">Create New Substitution</span>
</Button>
</div>

View File

@ -59,7 +59,7 @@
</script>
<div class="pb-2">
<Button width="w-full" color="tertiary" onclick={create_team_handler}>
<Button width="w-full" color="tertiary" onclick={create_team_handler} shadow>
<span class="font-bold">Create New Team</span>
</Button>
</div>