61 lines
1.4 KiB
TypeScript
61 lines
1.4 KiB
TypeScript
"use client";
|
|
import { DesktopNavbar } from "./desktop-navbar";
|
|
import { MobileNavbar } from "./mobile-navbar";
|
|
import { motion } from "framer-motion";
|
|
import { useLanguage } from "@/context/language-provider";
|
|
import { LanguageSwitcher } from "@/components/language-switcher";
|
|
|
|
interface NavItem {
|
|
title: string;
|
|
link: string;
|
|
}
|
|
|
|
export function NavBar() {
|
|
const { t } = useLanguage();
|
|
|
|
const navItems: NavItem[] = [
|
|
{
|
|
title: t("home"),
|
|
link: "/",
|
|
},
|
|
{
|
|
title: t("report"),
|
|
link: "#report",
|
|
},
|
|
{
|
|
title: t("safety"),
|
|
link: "#safety",
|
|
},
|
|
];
|
|
return (
|
|
<motion.nav
|
|
initial={{
|
|
y: -80,
|
|
}}
|
|
animate={{
|
|
y: 0,
|
|
}}
|
|
transition={{
|
|
ease: [0.6, 0.05, 0.1, 0.9],
|
|
duration: 0.8,
|
|
}}
|
|
className="max-w-7xl fixed top-4 mx-auto inset-x-0 z-50 w-[95%] lg:w-full"
|
|
>
|
|
<div className="hidden lg:block w-full">
|
|
<div className="flex items-center justify-between">
|
|
<DesktopNavbar navItems={navItems} />
|
|
<div className="fixed right-10 top-7 z-[60]">
|
|
<LanguageSwitcher />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="flex h-full w-full items-center lg:hidden">
|
|
<MobileNavbar navItems={navItems} />
|
|
<div className="ml-auto mr-4">
|
|
<LanguageSwitcher />
|
|
</div>
|
|
</div>
|
|
</motion.nav>
|
|
);
|
|
}
|