feat: Added language switcher to navbar
This commit is contained in:
+36
-2
@@ -5,7 +5,7 @@ import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import { Menu, X } from "lucide-react";
|
||||
import { Menu, X, Globe } from "lucide-react";
|
||||
|
||||
const navLinks = [
|
||||
// { name: "Odalar", href: "/odalar" },
|
||||
@@ -30,7 +30,19 @@ export default function Navbar() {
|
||||
|
||||
useEffect(() => { setIsOpen(false); }, [pathname]);
|
||||
|
||||
const isHome = pathname === "/";
|
||||
const isHome = pathname === "/" || pathname === "/tr" || pathname === "/en";
|
||||
|
||||
const currentLang = pathname.startsWith("/en") ? "en" : "tr";
|
||||
const toggleLang = currentLang === "en" ? "tr" : "en";
|
||||
|
||||
const getToggleHref = () => {
|
||||
if (pathname === "/") return `/${toggleLang}`;
|
||||
if (pathname.startsWith("/tr/")) return pathname.replace("/tr/", `/${toggleLang}/`);
|
||||
if (pathname === "/tr") return `/${toggleLang}`;
|
||||
if (pathname.startsWith("/en/")) return pathname.replace("/en/", `/${toggleLang}/`);
|
||||
if (pathname === "/en") return `/${toggleLang}`;
|
||||
return `/${toggleLang}${pathname}`;
|
||||
};
|
||||
|
||||
return (
|
||||
<nav
|
||||
@@ -87,6 +99,21 @@ export default function Navbar() {
|
||||
>
|
||||
Rezervasyon
|
||||
</Link>
|
||||
|
||||
{/* Lang Toggle */}
|
||||
<Link
|
||||
href={getToggleHref()}
|
||||
className={`flex items-center gap-1.5 text-[11px] font-bold tracking-[0.12em] uppercase transition-colors hover:text-accent ${
|
||||
scrolled
|
||||
? "text-dark"
|
||||
: isHome
|
||||
? "text-white"
|
||||
: "text-dark"
|
||||
}`}
|
||||
>
|
||||
<Globe size={14} />
|
||||
<span>{currentLang === "tr" ? "EN" : "TR"}</span>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Mobile toggle */}
|
||||
@@ -131,6 +158,13 @@ export default function Navbar() {
|
||||
</Link>
|
||||
</motion.div>
|
||||
))}
|
||||
<Link
|
||||
href={getToggleHref()}
|
||||
className="mt-2 flex items-center justify-center gap-2 text-sm font-bold uppercase text-dark border border-sand py-3 rounded-full hover:bg-sand/20 transition-colors"
|
||||
>
|
||||
<Globe size={16} />
|
||||
{currentLang === "tr" ? "English" : "Türkçe"}
|
||||
</Link>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="mt-4 block w-full text-center bg-accent text-white px-6 py-3.5 rounded-full text-sm font-bold uppercase tracking-wider"
|
||||
|
||||
Reference in New Issue
Block a user