40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
|
import Link from "next/link";
|
||
|
|
import { cn } from "~/lib/utils";
|
||
|
|
import { LogoSvg } from "~/components/svgs";
|
||
|
|
import { useTranslation } from "~/providers/I18nProvider";
|
||
|
|
type MainNavProps = {
|
||
|
|
pathname: string;
|
||
|
|
};
|
||
|
|
|
||
|
|
export function MainNav({ pathname }: MainNavProps) {
|
||
|
|
const { t } = useTranslation();
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="mr-2 hidden gap-6 md:flex">
|
||
|
|
<Link
|
||
|
|
aria-label="mainNavLink"
|
||
|
|
href="/"
|
||
|
|
className="flex shrink-0 items-center font-medium md:mb-0"
|
||
|
|
>
|
||
|
|
<LogoSvg className="[&>text]:fill-primary [&>text]:stroke-primary h-8 w-auto [&>g]:fill-red-500" />
|
||
|
|
</Link>
|
||
|
|
|
||
|
|
<nav className="flex items-center gap-4 text-lg tracking-wide lg:gap-6">
|
||
|
|
{t.nav.mainNav.map((item) => (
|
||
|
|
<Link
|
||
|
|
aria-label={item.title}
|
||
|
|
key={item.href}
|
||
|
|
href={item.href}
|
||
|
|
className={cn(
|
||
|
|
"hover:text-primary/80 transition-colors",
|
||
|
|
pathname === item.href ? "text-primary" : "text-primary/70",
|
||
|
|
)}
|
||
|
|
>
|
||
|
|
{item.title}
|
||
|
|
</Link>
|
||
|
|
))}
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|