UI: Fix navbar external items and nav menu scroll

.changeset/lemon-groups-greet.md

@@ -0,0 +1,5 @@
+---
+'fumadocs-ui': patch
+---
+
+Fix navbar external items and nav menu scroll

packages/ui/src/components/ui/navigation-menu.tsx

@@ -61,7 +61,7 @@ const NavigationMenuViewport = React.forwardRef<
     <Primitive.Viewport
       {...props}
       className={cn(
-        'relative h-(--radix-navigation-menu-viewport-height) w-full origin-[top_center] overflow-hidden text-fd-popover-foreground transition-[width,height] duration-300 data-[state=closed]:animate-fd-nav-menu-out data-[state=open]:animate-fd-nav-menu-in',
+        'relative h-(--radix-navigation-menu-viewport-height) max-h-[80svh] w-full origin-[top_center] overflow-auto [scrollbar-width:none] text-fd-popover-foreground transition-[width,height] duration-300 data-[state=closed]:animate-fd-nav-menu-out data-[state=open]:animate-fd-nav-menu-in',
         className,
       )}
     />

packages/ui/src/layouts/home.tsx

@@ -1,7 +1,7 @@
 import { Fragment, type HTMLAttributes, useMemo } from 'react';
 import { type NavOptions, slot, slots } from '@/layouts/shared';
 import { cn } from '@/utils/cn';
-import { getLinks, type BaseLayoutProps } from './shared';
+import { type BaseLayoutProps, getLinks } from './shared';
 import { NavProvider } from '@/contexts/layout';
 import {
   Navbar,
@@ -206,16 +206,19 @@ function NavbarLinkItem({
       } = child.menu ?? {};
 
       return (
-        <NavbarMenuLink key={j} href={child.url} {...rest}>
+        <NavbarMenuLink
+          key={j}
+          href={child.url}
+          external={child.external}
+          {...rest}
+        >
           {rest.children ?? (
             <>
               {banner}
-              <p className="-mb-1 text-sm font-medium">{child.text}</p>
-              {child.description ? (
-                <p className="text-[13px] text-fd-muted-foreground">
-                  {child.description}
-                </p>
-              ) : null}
+              <p className="text-[15px] font-medium">{child.text}</p>
+              <p className="text-sm text-fd-muted-foreground empty:hidden">
+                {child.description}
+              </p>
             </>
           )}
         </NavbarMenuLink>

packages/ui/src/layouts/home/navbar.tsx

@@ -34,10 +34,9 @@ export function Navbar(props: ComponentProps<'div'>) {
         id="nd-nav"
         {...props}
         className={cn(
-          'fixed top-(--fd-banner-height) z-40 box-content w-full max-w-fd-container -translate-x-1/2 border-b transition-colors lg:mt-2 lg:[--fd-padding:1rem] lg:rounded-2xl lg:border',
+          'fixed top-(--fd-banner-height) z-40 box-content backdrop-blur-lg max-w-fd-container -translate-x-1/2 border-b transition-colors lg:mt-2 lg:[--fd-padding:1rem] lg:rounded-2xl lg:border',
           value.length > 0 ? 'shadow-lg' : 'shadow-sm',
-          (!isTransparent || value.length > 0) &&
-            'bg-fd-background/80 backdrop-blur-lg',
+          (!isTransparent || value.length > 0) && 'bg-fd-background/80',
           props.className,
         )}
         style={