57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
// components/landing-page/navbar.tsx
|
|
import Image from "next/image";
|
|
import { Search } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { Button } from "../ui/button";
|
|
|
|
export default function Navbar() {
|
|
return (
|
|
<header>
|
|
{/* Top section dengan logo */}
|
|
<div className="bg-[#3972ab] flex justify-center py-6">
|
|
<Image
|
|
src="/harapan.png" // ganti dengan path logo kamu
|
|
alt="Kabar Harapan"
|
|
width={200}
|
|
height={80}
|
|
priority
|
|
/>
|
|
</div>
|
|
|
|
{/* Navbar menu */}
|
|
<nav className="bg-[#3a75a9] border-t border-[#427cae]">
|
|
<div className="max-w-5xl mx-auto flex items-center justify-center gap-8 py-3 relative">
|
|
<a
|
|
href="/"
|
|
className="text-black text-sm font-medium hover:underline"
|
|
>
|
|
HOME
|
|
</a>
|
|
<a
|
|
href="/category/latest-news"
|
|
className="text-black text-sm font-medium hover:underline"
|
|
>
|
|
BERITA TERKINI
|
|
</a>
|
|
<a
|
|
href="/category/popular-news"
|
|
className="text-black text-sm font-medium hover:underline"
|
|
>
|
|
BERITA TERPOPULER
|
|
</a>
|
|
|
|
{/* Search icon di kanan */}
|
|
<div className="absolute right-4 flex items-center gap-2">
|
|
<Search className="w-5 h-5 text-white cursor-pointer" />
|
|
<Link href={"/auth"}>
|
|
<Button className="bg-black text-white rounded-md px-5 py-2 hover:bg-yellow-500">
|
|
Login
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
);
|
|
}
|