sosokker/B2D-Ventures
1
0
Fork 0
mirror of https://github.com/Sosokker/B2D-Ventures.git synced 2025-12-18 21:44:06 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: Refactor UnsignedNav component and update navigation menu structure

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2024-08-28 16:06:06 +07:00
parent f4d0416dbe
commit 4cf62b5ee0
1 changed files with 51 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
src/components/navigationBar/Unsigned.tsx
View File

@ -14,65 +14,70 @@ import Link from "next/link";
import {
NavigationMenu,
NavigationMenuContent,
NavigationMenuIndicator,
NavigationMenuItem,
NavigationMenuLink,
NavigationMenuList,
NavigationMenuTrigger,
NavigationMenuViewport,
navigationMenuTriggerStyle,
} from "@/components/ui/navigation-menu";
export function UnsignedNav() {
return (
<Card className="container bg-card py-3 px-4 border-0 flex items-center justify-between gap-6 rounded-2xl mt-5">
{/* <ShadcnKit className="text-primary cursor-pointer" /> */}
<NavigationMenu>
<NavigationMenuList>
<NavigationMenuItem>
<NavigationMenuTrigger>Businesses</NavigationMenuTrigger>
<NavigationMenuContent>
<ul className="grid gap-3 p-6 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]">
<li className="row-span-3">
<NavigationMenuLink asChild>
<a
className="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 outline-none focus:shadow-md"
href="/"
>
<div className="mb-2 mt-4 text-lg font-medium">
shadcn/ui
</div>
<p className="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>
</NavigationMenuLink>
</li>
</ul>
</NavigationMenuContent>
</NavigationMenuItem>
<ul className="hidden md:flex items -center gap-10 text-card-foreground ml-auto">
<li className="text-primary font-medium">
<a href="#home">Home</a>
</li>
<li>
<a href="#features">Businesses</a>
</li>
<li>
<a href="#pricing">Projects</a>
</li>
<li>
<a href="#faqs">Docs</a>
</li>
</ul>
</NavigationMenuList>
</NavigationMenu>
<ul className="hidden md:flex items-center gap-5 text-card-foreground ml-auto">
<li className="text-primary font-medium">
<a href="#home">Home</a>
</li>
<NavigationMenu>
<NavigationMenuList>
<NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium ">
<ul>
<li>Businesses</li>
</ul>
</NavigationMenuTrigger>
<NavigationMenuContent>Appply</NavigationMenuContent>
</NavigationMenuItem>
<NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium ">
Projects
</NavigationMenuTrigger>
<NavigationMenuContent>Lorem Ipsum</NavigationMenuContent>
</NavigationMenuItem>
<NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium ">
Blog
</NavigationMenuTrigger>
<NavigationMenuContent>Lorem Ipsum</NavigationMenuContent>
</NavigationMenuItem>
</NavigationMenuList>
</NavigationMenu>
<li>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<span className="cursor-pointer">Docs</span>
</DropdownMenuTrigger>
<DropdownMenuContent align="start">
{landings.map((page) => (
<DropdownMenuItem key={page.id}>
<Link href={page.route}>{page.title}</Link>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</li>
</ul>
<div className="flex items-center">
<Button variant="secondary" className="hidden md:block px-2">
Login
</Button>
<Button className="hidden md:block ml-2 mr-2">Get Started</Button>
<Button className="hidden md:block ml-2 mr-2">Sign up</Button>
<div className="flex md:hidden mr-2 items-center gap-2">
<DropdownMenu>
@ -115,7 +120,7 @@ export function UnsignedNav() {
</Button>
</DropdownMenuItem>
<DropdownMenuItem>
<Button className="w-full text-sm">Get Started</Button>
<Button className="w-full text-sm">Sign up</Button>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
@ -138,39 +143,4 @@ const landings = [
title: "Landing 02",
route: "/crm-landing",
},
{
id: 3,
title: "Landing 03",
route: "/ai-content-landing",
},
{
id: 4,
title: "Landing 04",
route: "/new-intro-landing",
},
{
id: 5,
title: "Landing 05",
route: "/about-us-landing",
},
{
id: 6,
title: "Landing 06",
route: "/contact-us-landing",
},
{
id: 7,
title: "Landing 07",
route: "/faqs-landing",
},
{
id: 8,
title: "Landing 08",
route: "/pricing-landing",
},
{
id: 9,
title: "Landing 09",
route: "/career-landing",
},
];