42 lines
1.6 KiB
TypeScript
42 lines
1.6 KiB
TypeScript
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
import { Container } from "./Container";
|
|
import { Button } from "../ui/Button";
|
|
|
|
const navLinks = [
|
|
{ href: "/fernsehen", label: "Fernsehen" },
|
|
{ href: "/internet", label: "Internet" },
|
|
{ href: "/telefonie", label: "Telefonie" },
|
|
{ href: "/leistungen", label: "Leistungen" },
|
|
{ href: "/ueber-uns", label: "Über uns" },
|
|
];
|
|
|
|
export function Header() {
|
|
return (
|
|
<header className="border-b border-[color:var(--color-border)] sticky top-0 z-50 bg-[var(--color-background)]/80 backdrop-blur-md">
|
|
<Container className="flex h-16 items-center justify-between">
|
|
<Link href="/" className="font-heading text-xl font-bold text-[color:var(--color-primary)]">
|
|
TeleNetSystems
|
|
</Link>
|
|
<nav className="hidden md:flex gap-6">
|
|
{navLinks.map((link) => (
|
|
<Link
|
|
key={link.href}
|
|
href={link.href}
|
|
className="text-sm font-medium hover:text-[color:var(--color-primary)] transition-colors"
|
|
>
|
|
{link.label}
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
<div className="flex items-center gap-4">
|
|
<Link href="#kontakt" className="btn btn-primary btn-sm">
|
|
Jetzt beraten lassen
|
|
</Link>
|
|
</div>
|
|
</Container>
|
|
</header>
|
|
);
|
|
}
|