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:
parent
52dbde2a25
commit
43d6508369
2 changed files with 14 additions and 10 deletions
|
|
@ -63,7 +63,13 @@
|
|||
{/snippet}
|
||||
</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)}
|
||||
<button
|
||||
type="button"
|
||||
|
|
|
|||
|
|
@ -187,15 +187,13 @@
|
|||
</a>
|
||||
|
||||
<!--
|
||||
Mit Viewport, also so, wie die Komponente gedacht
|
||||
ist. Ohne ihn haengt das Panel per top-full/left-0
|
||||
am naechsten positionierten Vorfahren — das ist
|
||||
die Leiste selbst, nicht der Menuepunkt. Es
|
||||
erschien dann am linken Rand statt unter „Team",
|
||||
der Zeiger lief auf dem Weg dorthin ins Leere und
|
||||
das Menue klappte zu, bevor jemand einen Eintrag
|
||||
treffen konnte. -->
|
||||
<NavigationMenu.Root class="hidden md:flex">
|
||||
Ohne Viewport: Der Inhalt haengt dann am
|
||||
Menuepunkt, der als NavigationMenu.Item ohnehin
|
||||
`relative` ist. Mit Viewport waere er eine eigene
|
||||
Flaeche unter der ganzen Leiste und stuende an
|
||||
deren linkem Rand — unter „Dashboard" statt unter
|
||||
„Team". -->
|
||||
<NavigationMenu.Root viewport={false} class="hidden md:flex">
|
||||
<NavigationMenu.List class="items-center gap-2">
|
||||
{#each nav as item}
|
||||
{@const Icon = item.icon}
|
||||
|
|
|
|||
Loading…
Reference in a new issue