fix: move hamburger backdrop outside <header> so drawer items are not blurred
All checks were successful
Release / Test backend (push) Successful in 47s
Release / Check ui (push) Successful in 1m49s
Release / Docker (push) Successful in 6m21s
Release / Gitea Release (push) Successful in 28s

This commit is contained in:
root
2026-04-11 23:22:32 +05:00
parent adacd8944b
commit ac3d6e1784

View File

@@ -754,15 +754,6 @@
></div> ></div>
{/if} {/if}
<!-- Backdrop for mobile hamburger menu -->
{#if menuOpen}
<div
class="fixed top-14 inset-x-0 bottom-0 z-40 sm:hidden"
style="background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);"
onpointerdown={() => { menuOpen = false; }}
aria-hidden="true"
></div>
{/if}
{:else} {:else}
<div class="ml-auto"> <div class="ml-auto">
<a <a
@@ -895,6 +886,17 @@
{/if} {/if}
</header> </header>
<!-- Backdrop for mobile hamburger menu — outside <header> so the blur
only affects page content below, not the drawer items themselves -->
{#if menuOpen}
<div
class="fixed top-14 inset-x-0 bottom-0 z-40 sm:hidden"
style="background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);"
onpointerdown={() => { menuOpen = false; }}
aria-hidden="true"
></div>
{/if}
<main class="flex-1 max-w-6xl mx-auto w-full px-4 py-8"> <main class="flex-1 max-w-6xl mx-auto w-full px-4 py-8">
{#key page.url.pathname + page.url.search} {#key page.url.pathname + page.url.search}
<div in:fade={{ duration: 180, delay: 60 }} out:fade={{ duration: 100 }}> <div in:fade={{ duration: 180, delay: 60 }} out:fade={{ duration: 100 }}>