bondingcurve-website/components/navigation.tsx

68 lines
2.6 KiB
TypeScript

"use client"
import Link from "next/link"
import { Button } from "@/components/ui/button"
import { Youtube } from "lucide-react"
import { BCRGLogo } from "@/components/bcrg-logo"
export function Navigation() {
return (
<nav className="fixed top-0 left-0 right-0 z-50 bg-background/95 backdrop-blur-md border-b-2 border-neon-cyan shadow-[0_0_20px_rgba(0,255,255,0.3)]">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between h-16">
<Link href="/" className="flex items-center gap-2">
<BCRGLogo size={32} className="text-[var(--neon-cyan)]" />
<span className="text-lg font-semibold neon-glow-cyan text-[var(--neon-cyan-bright)]">
BondingCurve.tech
</span>
</Link>
<div className="hidden md:flex items-center gap-8">
<Link
href="#about"
className="text-sm text-[var(--neon-orange)] hover:text-[var(--neon-orange-bright)] transition-colors hover:neon-glow-orange"
>
About
</Link>
<Link
href="#research"
className="text-sm text-[var(--neon-cyan)] hover:text-[var(--neon-cyan-bright)] transition-colors hover:neon-glow-cyan"
>
Research
</Link>
<Link
href="#library"
className="text-sm text-[var(--neon-purple)] hover:text-[var(--neon-magenta)] transition-colors hover:neon-glow-purple"
>
Library
</Link>
<Link
href="https://www.youtube.com/channel/UCIFlfbLKmn5mq6vcMHsqK0A"
target="_blank"
className="text-sm text-[var(--neon-orange)] hover:text-[var(--neon-orange-bright)] transition-colors hover:neon-glow-orange flex items-center gap-1"
>
<Youtube className="h-4 w-4" />
Videos
</Link>
<Link
href="#open-source"
className="text-sm text-[var(--neon-orange)] hover:text-[var(--neon-orange-bright)] transition-colors hover:neon-glow-orange"
>
Open Source
</Link>
<Button
asChild
size="sm"
className="bg-[var(--neon-cyan)] hover:bg-[var(--neon-cyan-bright)] text-black font-semibold shadow-[0_0_15px_rgba(0,255,255,0.5)]"
>
<Link href="https://github.com/bonding-curves" target="_blank">
GitHub
</Link>
</Button>
</div>
</div>
</div>
</nav>
)
}