Navigation: Theme-Schalter und Kontakt-Button bekommen wieder Mausklicks
Der Link-Container der Desktop-Navigation ist "absolute inset-0" (hält die Links mittig), lag dadurch aber über .navbar-actions und schluckte alle Mausklicks auf Theme-Schalter und Kontakt-Button ab 1024 px. Der Container ist jetzt pointer-events-none, die Links pointer-events-auto; Position und Optik bleiben identisch, die Hover-Pille der Links funktioniert weiter. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
b2e17d96c2
commit
0d12bbc06a
2 files changed
+19
-2
No files matched your search
@@ -105,7 +105,9 @@ export const NavItems = ({
|
||||
<motion.div
|
||||
onMouseLeave={() => setHovered(null)}
|
||||
className={cn(
|
||||
"absolute inset-0 hidden flex-1 flex-row items-center justify-center space-x-2 text-sm font-medium text-zinc-600 transition duration-200 hover:text-zinc-800 lg:flex lg:space-x-2",
|
||||
// absolute inset-0 hält die Links mittig, liegt aber über Theme-Schalter und Kontakt-Button:
|
||||
// der Container nimmt deshalb keine Mausklicks an (pointer-events-none), nur die Links selbst.
|
||||
"pointer-events-none absolute inset-0 hidden flex-1 flex-row items-center justify-center space-x-2 text-sm font-medium text-zinc-600 transition duration-200 hover:text-zinc-800 lg:flex lg:space-x-2",
|
||||
className
|
||||
)}
|
||||
>
|
||||
@@ -114,7 +116,7 @@ export const NavItems = ({
|
||||
const commonProps = {
|
||||
onMouseEnter: () => setHovered(idx),
|
||||
onClick: onItemClick,
|
||||
className: "relative px-4 py-2 text-neutral-900 dark:text-neutral-300",
|
||||
className: "pointer-events-auto relative px-4 py-2 text-neutral-900 dark:text-neutral-300",
|
||||
key: `link-${idx}`,
|
||||
};
|
||||
const inner = (
|
||||
|
||||
Reference in new issue
Block a user