shiitake-john-website/components/navigation.tsx

33 lines
1.2 KiB
TypeScript

import Link from "next/link"
import { Button } from "@/components/ui/button"
export function Navigation() {
return (
<nav className="border-b border-border bg-card/50 backdrop-blur-sm sticky top-0 z-50">
<div className="container mx-auto px-4 py-4">
<div className="flex items-center justify-between">
<Link href="/" className="flex items-center gap-2">
<span className="text-2xl">🍄</span>
<span className="font-semibold text-xl text-foreground">Shiitake John</span>
</Link>
<div className="flex items-center gap-6">
<Link href="/about" className="text-foreground hover:text-primary transition-colors">
About Shiitake John
</Link>
<Link href="/gallery" className="text-foreground hover:text-primary transition-colors">
Photo Gallery
</Link>
<Link href="/events" className="text-foreground hover:text-primary transition-colors">
Courses and Events
</Link>
<Link href="/sponsor">
<Button className="bg-[#1a4d2e] hover:bg-[#153d24] text-white">Sponsor the Old Growth</Button>
</Link>
</div>
</div>
</div>
</nav>
)
}