Add smooth transitions and reorder menu items

This commit is contained in:
gpt-engineer-app[bot]
2025-11-05 19:33:59 +00:00
parent 3f95e447bb
commit 45a5dadd29
2 changed files with 7 additions and 7 deletions

View File

@@ -133,12 +133,12 @@ export function Header() {
<li>
<NavigationMenuLink asChild>
<Link
to="/parks"
to="/rides"
className="block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent/20 focus:bg-accent/20"
>
<div className="text-sm font-medium leading-none">Parks</div>
<div className="text-sm font-medium leading-none">Rides</div>
<p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
Browse theme parks around the world
Discover exciting rides and attractions
</p>
</Link>
</NavigationMenuLink>
@@ -146,12 +146,12 @@ export function Header() {
<li>
<NavigationMenuLink asChild>
<Link
to="/rides"
to="/parks"
className="block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent/20 focus:bg-accent/20"
>
<div className="text-sm font-medium leading-none">Rides</div>
<div className="text-sm font-medium leading-none">Parks</div>
<p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
Discover exciting rides and attractions
Browse theme parks around the world
</p>
</Link>
</NavigationMenuLink>

View File

@@ -80,7 +80,7 @@ const NavigationMenuViewport = React.forwardRef<
<div className={cn("absolute left-0 top-full flex justify-center")}>
<NavigationMenuPrimitive.Viewport
className={cn(
"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)] transition-all duration-300 ease-in-out",
className,
)}
ref={ref}