menu improvements

This commit is contained in:
itsMapleLeaf
2023-03-12 16:28:51 -05:00
parent af3d1c5058
commit f0ad743080
3 changed files with 6 additions and 4 deletions

View File

@@ -6,7 +6,7 @@ export type Props = {
---
<div
class="px-3 py-2 transition text-left font-medium block w-full opacity-50 inline-flex gap-1 items-center"
class="px-3 py-2 transition text-left font-medium block w-full opacity-50 inline-flex gap-1 items-center hover:opacity-100 hover:text-emerald-500"
>
<Astro.props.icon class="inline-icon" className="inline-icon" />
<span class="flex-1">{Astro.props.label}</span>

View File

@@ -1,9 +1,11 @@
<details class="md:hidden relative" data-menu>
<summary class="list-none p-2 -m-2">
<summary
class="list-none p-2 -m-2 cursor-pointer hover:text-emerald-500 transition"
>
<slot name="button" />
</summary>
<div
class="w-48 max-h-[calc(100vh-5rem)] bg-slate-800 shadow rounded-lg overflow-x-hidden overflow-y-auto top-[calc(100%+8px)] right-0 absolute"
class="w-48 max-h-[calc(100vh-5rem)] bg-slate-800 shadow rounded-lg overflow-x-hidden overflow-y-auto top-[calc(100%+8px)] right-0 absolute z-10"
>
<slot />
</div>

View File

@@ -20,7 +20,7 @@ import MainNavigation from "~/components/main-navigation.astro"
<div class="flex flex-col gap-4 my-auto px-4">
<AppLogo class="w-full max-w-lg mx-auto" />
<div class="max-w-md w-full mx-auto">
<div class="max-w-md w-full mx-auto isolate">
<LandingAnimation client:only />
</div>