added heroicons to nav
This commit is contained in:
parent
c027c645db
commit
031cd6e2bb
1 changed files with 17 additions and 2 deletions
|
|
@ -1,6 +1,11 @@
|
||||||
"use client"
|
"use client"
|
||||||
import {
|
import {
|
||||||
Button,
|
BriefcaseIcon,
|
||||||
|
EnvelopeIcon,
|
||||||
|
HomeIcon,
|
||||||
|
UsersIcon,
|
||||||
|
} from "@heroicons/react/24/outline"
|
||||||
|
import {
|
||||||
Navbar,
|
Navbar,
|
||||||
NavbarBrand,
|
NavbarBrand,
|
||||||
NavbarContent,
|
NavbarContent,
|
||||||
|
|
@ -9,11 +14,13 @@ import {
|
||||||
NavbarMenuItem,
|
NavbarMenuItem,
|
||||||
NavbarMenuToggle,
|
NavbarMenuToggle,
|
||||||
} from "@nextui-org/react"
|
} from "@nextui-org/react"
|
||||||
|
|
||||||
import Image from "next/image"
|
import Image from "next/image"
|
||||||
import Link from "next/link"
|
import Link from "next/link"
|
||||||
import { usePathname } from "next/navigation"
|
import { usePathname } from "next/navigation"
|
||||||
import { useState } from "react"
|
import { useState } from "react"
|
||||||
|
|
||||||
|
|
||||||
export default function Nav() {
|
export default function Nav() {
|
||||||
const [isMenuOpen, setIsMenuOpen] = useState<boolean | undefined>(false)
|
const [isMenuOpen, setIsMenuOpen] = useState<boolean | undefined>(false)
|
||||||
const currentRoute = usePathname()
|
const currentRoute = usePathname()
|
||||||
|
|
@ -23,21 +30,26 @@ export default function Nav() {
|
||||||
label: "Home",
|
label: "Home",
|
||||||
href: "/",
|
href: "/",
|
||||||
current: currentRoute === "/",
|
current: currentRoute === "/",
|
||||||
|
icon: <HomeIcon className="h-6 w-6"/>
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "Team",
|
label: "Team",
|
||||||
href: "/team",
|
href: "/team",
|
||||||
current: currentRoute === "/team",
|
current: currentRoute === "/team",
|
||||||
|
icon: <UsersIcon className="h-6 w-6"/>
|
||||||
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "Services",
|
label: "Services",
|
||||||
href: "/services",
|
href: "/services",
|
||||||
current: currentRoute === "/services",
|
current: currentRoute === "/services",
|
||||||
|
icon: <BriefcaseIcon className="h-6 w-6"/>
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "Contact",
|
label: "Contact",
|
||||||
href: "/contact",
|
href: "/contact",
|
||||||
current: currentRoute === "/contact",
|
current: currentRoute === "/contact",
|
||||||
|
icon: <EnvelopeIcon className="h-6 w-6"/>
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
@ -59,7 +71,10 @@ export default function Nav() {
|
||||||
aria-current={item.current ? "page" : undefined}
|
aria-current={item.current ? "page" : undefined}
|
||||||
onClick={() => setIsMenuOpen(false)}
|
onClick={() => setIsMenuOpen(false)}
|
||||||
>
|
>
|
||||||
{item.label}
|
<div className="flex-row items-center flex m-4 space-x-2">
|
||||||
|
{item.icon}
|
||||||
|
<span>{item.label}</span>
|
||||||
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
</NavbarMenuItem>
|
</NavbarMenuItem>
|
||||||
))}
|
))}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue