fix: Team-Panel unter seinen Menuepunkt, ohne toten Spalt

Zwei Fehler, einer je Anlauf.

Der Inhalt gehoert ohne Viewport gerendert: Dann haengt er am
NavigationMenu.Item, das ohnehin `relative` ist, und steht damit unter
"Team". Mit Viewport ist er eine eigene Flaeche unter der ganzen Leiste
und beginnt an deren linkem Rand — unter "Dashboard".

Und der Standardabstand mt-1.5 war ein toter Streifen zwischen
Menuepunkt und Panel. Wer den Zeiger hinunterbewegte, verliess beides
zugleich; nach delayDuration klappte das Menue zu, bevor ein Eintrag zu
treffen war. Ein Hover-Menue darf keine Luecke haben.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01P32KoesVtABd6xWsqMKzhr
This commit is contained in:
Daniel Michelberger 2026-09-07 22:28:41 +02:00
parent 52dbde2a25
commit 43d6508369
2 changed files with 14 additions and 10 deletions

View file

@ -63,7 +63,13 @@
{/snippet} {/snippet}
</NavigationMenu.Trigger> </NavigationMenu.Trigger>
<NavigationMenu.Content class="min-w-56"> <!--
mt-0 statt der 1.5 aus dem Standard: Der Abstand war ein toter Streifen
zwischen Menuepunkt und Panel. Wer den Zeiger hinunterbewegte, verliess
beides zugleich, und nach delayDuration klappte das Menue zu, bevor ein
Eintrag zu treffen war. Ein Hover-Menue darf keine Luecke haben.
-->
<NavigationMenu.Content class="min-w-56 group-data-[viewport=false]/navigation-menu:mt-0">
{#each teams.records as t (t.id)} {#each teams.records as t (t.id)}
<button <button
type="button" type="button"

View file

@ -187,15 +187,13 @@
</a> </a>
<!-- <!--
Mit Viewport, also so, wie die Komponente gedacht Ohne Viewport: Der Inhalt haengt dann am
ist. Ohne ihn haengt das Panel per top-full/left-0 Menuepunkt, der als NavigationMenu.Item ohnehin
am naechsten positionierten Vorfahren — das ist `relative` ist. Mit Viewport waere er eine eigene
die Leiste selbst, nicht der Menuepunkt. Es Flaeche unter der ganzen Leiste und stuende an
erschien dann am linken Rand statt unter „Team", deren linkem Rand — unter „Dashboard" statt unter
der Zeiger lief auf dem Weg dorthin ins Leere und „Team". -->
das Menue klappte zu, bevor jemand einen Eintrag <NavigationMenu.Root viewport={false} class="hidden md:flex">
treffen konnte. -->
<NavigationMenu.Root class="hidden md:flex">
<NavigationMenu.List class="items-center gap-2"> <NavigationMenu.List class="items-center gap-2">
{#each nav as item} {#each nav as item}
{@const Icon = item.icon} {@const Icon = item.icon}