site: fix nav

This commit is contained in:
Glen Huang
2025-10-10 10:59:54 +08:00
parent e6a9bcbb69
commit 5299fe7259

View File

@@ -21,7 +21,9 @@
<nav> <nav>
<div class={["menu", menuOpen && "open"]}> <div class={["menu", menuOpen && "open"]}>
<button onclick={() => (menuOpen = !menuOpen)}>Menu</button> <button onclick={() => (menuOpen = !menuOpen)}>Menu</button>
{@render navLinks(docs.navLinks)} <ul>
{@render navLinks(docs.navLinks)}
</ul>
</div> </div>
</nav> </nav>
</div> </div>
@@ -30,11 +32,9 @@
</main> </main>
{#snippet navLinks(nLinks: NavLink[])} {#snippet navLinks(nLinks: NavLink[])}
<ul> {#each nLinks as nLink}
{#each nLinks as nLink} {@render navLink(nLink)}
{@render navLink(nLink)} {/each}
{/each}
</ul>
{/snippet} {/snippet}
{#snippet navLink(nLink: NavLink)} {#snippet navLink(nLink: NavLink)}
@@ -42,7 +42,9 @@
<li> <li>
<details open={!nLink.collapsed}> <details open={!nLink.collapsed}>
<summary><span class="label group">{nLink.label}</span></summary> <summary><span class="label group">{nLink.label}</span></summary>
{@render navLinks(nLink.items)} <ul>
{@render navLinks(nLink.items)}
</ul>
</details> </details>
</li> </li>
{:else} {:else}
@@ -61,25 +63,27 @@
border-bottom: 1px solid; border-bottom: 1px solid;
padding: 0 var(--pagePadding); padding: 0 var(--pagePadding);
} }
.menu > ul { .menu {
visibility: hidden; & > ul {
position: fixed; visibility: hidden;
left: 0; position: fixed;
z-index: 10; left: 0;
top: var(--globalBarHeight); z-index: 10;
width: 100vw; top: var(--globalBarHeight);
height: 100vh; width: 100vw;
background: #fff; height: 100vh;
} background: #fff;
.menu.open > ul { }
visibility: visible; &.open > ul {
visibility: visible;
}
li {
padding-left: 1em;
}
} }
ul { ul {
list-style: none; list-style: none;
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
li {
padding-left: 1em;
}
</style> </style>