diff options
| -rw-r--r-- | src/lib/Layout/Dropdown.svelte | 16 | ||||
| -rw-r--r-- | src/routes/+layout.svelte | 7 |
2 files changed, 15 insertions, 8 deletions
diff --git a/src/lib/Layout/Dropdown.svelte b/src/lib/Layout/Dropdown.svelte index 95b763ad..dcdd7f7c 100644 --- a/src/lib/Layout/Dropdown.svelte +++ b/src/lib/Layout/Dropdown.svelte @@ -184,13 +184,15 @@ const handleItemKey = async (e: KeyboardEvent, index: number) => { transform: var(--dropdown-transform); } - .dropdown:hover .dropdown-content { - opacity: 1; - transform: translateY(0); - visibility: visible; - transition-delay: 0s, 0s, 0s; - left: var(--dropdown-left); - transform: var(--dropdown-transform); + @media (hover: hover) { + .dropdown:hover .dropdown-content { + opacity: 1; + transform: translateY(0); + visibility: visible; + transition-delay: 0s, 0s, 0s; + left: var(--dropdown-left); + transform: var(--dropdown-transform); + } } .dropdown-content a { diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index a7a03066..04c155eb 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -217,7 +217,12 @@ $: { <HeadTitle /> -<svelte:window on:keydown={(e) => { if (e.key === 'Escape' && isMenuOpen) isMenuOpen = false; }} /> +<svelte:window + on:keydown={(e) => { if (e.key === 'Escape' && isMenuOpen) isMenuOpen = false; }} + on:click={(e) => { + if (isMenuOpen && !(e.target as HTMLElement).closest('.header')) isMenuOpen = false; + }} +/> <CommandPalette items={[ |