sosokker/B2D-Ventures
1
0
Fork 0
mirror of https://github.com/Sosokker/B2D-Ventures.git synced 2025-12-20 14:34:05 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: Updated 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:25:15 +07:00
parent 4cf62b5ee0
commit 7576927d82
1 changed files with 53 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,3 +1,6 @@
"use client";
import * as React from "react";
import { import {
DropdownMenu, DropdownMenu,
DropdownMenuContent, DropdownMenuContent,
@ -20,8 +23,17 @@ import {
NavigationMenuTrigger, NavigationMenuTrigger,
navigationMenuTriggerStyle, navigationMenuTriggerStyle,
} from "@/components/ui/navigation-menu"; } from "@/components/ui/navigation-menu";
import { cn } from "@/lib/utils";
export function UnsignedNav() { export function UnsignedNav() {
const components = [
{
title: "Businesses",
href: "",
description:
"A modal dialog that interrupts the user with important content and expects a response.",
},
];
return ( return (
<Card className="container bg-card py-3 px-4 border-0 flex items-center justify-between gap-6 rounded-2xl mt-5"> <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" /> */} {/* <ShadcnKit className="text-primary cursor-pointer" /> */}
@ -33,27 +45,34 @@ export function UnsignedNav() {
<NavigationMenu> <NavigationMenu>
<NavigationMenuList> <NavigationMenuList>
<NavigationMenuItem> <NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium "> <NavigationMenuTrigger className="text-base">Businesses</NavigationMenuTrigger>
<ul> <NavigationMenuContent>
<li>Businesses</li> <ul className="grid w-[400px] ">
{components.map((component) => (
<ListItem
key={component.title}
title={component.title}
href={component.href}
>
{component.description}
</ListItem>
))}
</ul> </ul>
</NavigationMenuTrigger> </NavigationMenuContent>
<NavigationMenuContent>Appply</NavigationMenuContent>
</NavigationMenuItem> </NavigationMenuItem>
<NavigationMenuItem> <NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium "> <NavigationMenuTrigger className="text-base font-medium ">
Projects Projects
</NavigationMenuTrigger> </NavigationMenuTrigger>
<NavigationMenuContent>Lorem Ipsum</NavigationMenuContent> <NavigationMenuContent>Lorem Ipsum</NavigationMenuContent>
</NavigationMenuItem> </NavigationMenuItem>
<NavigationMenuItem> <NavigationMenuItem>
<NavigationMenuTrigger className="text-base font-medium "> <NavigationMenuTrigger className="text-base font-medium ">
Blog Blog
</NavigationMenuTrigger> </NavigationMenuTrigger>
<NavigationMenuContent>Lorem Ipsum</NavigationMenuContent> <NavigationMenuContent>Lorem Ipsum</NavigationMenuContent>
</NavigationMenuItem> </NavigationMenuItem>
</NavigationMenuList> </NavigationMenuList>
</NavigationMenu> </NavigationMenu>
<li> <li>
@ -144,3 +163,29 @@ const landings = [
route: "/crm-landing", route: "/crm-landing",
}, },
]; ];
const ListItem = React.forwardRef<
React.ElementRef<"a">,
React.ComponentPropsWithoutRef<"a">
>(({ className, title, children, ...props }, ref) => {
return (
<li>
<NavigationMenuLink asChild>
<a
ref={ref}
className={cn(
"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
className
)}
{...props}
>
<div className="text-sm font-medium leading-none">{title}</div>
<hr />
<p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
{children}
</p>
</a>
</NavigationMenuLink>
</li>
);
});
ListItem.displayName = "ListItem";