Fix: Better mobile menu + rules padding

This commit is contained in:
zuma 2025-04-14 14:06:59 +02:00
parent 57436d6782
commit dd32378294
4 changed files with 12 additions and 9 deletions

View file

@ -6,13 +6,13 @@
<details class="group">
<summary class="flex items-center justify-center marker:content-none hover:cursor-pointer">
<summary class="flex items-center justify-center text-center marker:content-none hover:cursor-pointer">
<div class="flex flex-row items-center justify-between">
<span>{title}</span>
<ChevronRight class="size-4 transition group-open:rotate-90"/>
<ChevronRight class="size-4"/>
</div>
</summary>
<article class="mt-2 mb-2">
<article class="border-l-1 border-orange-500 pl-4 mt-2 mb-2">
{@render children()}
</article>
</details>

View file

@ -144,8 +144,11 @@
<label class="relative z-40 cursor-pointer block md:hidden" for="mobile-menu">
<input class="peer hidden" bind:checked={openMobileMenu} type="checkbox" id="mobile-menu" />
<MenuIcon />
<div class="fixed inset-0 z-40 hidden h-full w-full peer-checked:block">
&nbsp;
</div>
<div onclick={(e) => {if(e.target.nodeName == "A") {openMobileMenu = false}}} class="fixed top-16 left-0 z-40 h-fit w-screen hidden peer-checked:block bg-white p-4 shadow-md">
<ul class="w-full flex flex-col items-center">
<ul class="w-full flex flex-col items-center gap-4">
<li>
<Accordion title="Commandants">
<ul class="w-full">
@ -230,7 +233,7 @@
</li>
<li><a href="/regles">Règles</a></li>
<li><a href="/faq">F.A.Q</a></li>
<li><div class="mt-4 mb-4 max-w-screen w-64 block h-[1px] bg-stone-500 content-[' ']"></div></li>
<li><div class="max-w-screen w-64 block h-[1px] bg-stone-500 content-[' ']"></div></li>
{#if isLoggedIn}
<li><a href="/profil">{username}</a></li>
{:else}