Navigation Menu

<c-navigation-menu>
  <c-navigation-menu-list>
    <c-navigation-menu-item>
      <c-navigation-menu-trigger>Getting started</c-navigation-menu-trigger>
      <c-navigation-menu-content>
        <div
          class="grid gap-3 p-6 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]"
        >
          <div class="row-span-3">
            <a
              class="flex h-full w-full select-none flex-col justify-end rounded-md bg-gradient-to-b from-muted/50 to-muted p-6 no-underline text-foreground outline-none focus:shadow-md"
              href="/"
            >
              <div class="mb-2 mt-4 text-lg font-medium">Appollo UI</div>
              <p class="text-sm leading-tight text-muted-foreground">
                Beautifully designed components that you can copy and paste into
                your apps. Accessible. Customizable. Open Source.
              </p>
            </a>
          </div>
          <a
            href="/docs"
            class="block select-none space-y-1 rounded-md p-3 leading-none no-underline text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground"
          >
            <div class="text-sm font-medium leading-none">Introduction</div>
            <p class="line-clamp-2 text-sm leading-snug text-muted-foreground">
              Re-usable components built using Radix UI and Tailwind CSS.
            </p>
          </a>
          <a
            href="/docs/installation"
            class="block select-none space-y-1 rounded-md p-3 leading-none no-underline text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground"
          >
            <div class="text-sm font-medium leading-none">Installation</div>
            <p class="line-clamp-2 text-sm leading-snug text-muted-foreground">
              How to install dependencies and structure your app.
            </p>
          </a>
        </div>
      </c-navigation-menu-content>
    </c-navigation-menu-item>
    <c-navigation-menu-item>
      <c-navigation-menu-link href="/docs/components/accordion">
        Documentation
      </c-navigation-menu-link>
    </c-navigation-menu-item>
  </c-navigation-menu-list>
</c-navigation-menu>