65 lines
2.3 KiB
TypeScript
65 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
|
|
export default function Navbar() {
|
|
return (
|
|
<header className="w-full py-4 border-b border-card-border bg-background">
|
|
<div className="container flex items-center justify-between px-4 mx-auto">
|
|
<div className="flex items-center space-x-4">
|
|
<Link href="/" className="flex items-center space-x-2">
|
|
<svg
|
|
className="w-6 h-6 text-accent-blue"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
>
|
|
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
|
|
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
|
|
</svg>
|
|
<span className="text-xl font-bold text-foreground">ShortURL</span>
|
|
</Link>
|
|
<nav className="hidden space-x-4 md:flex">
|
|
<Link
|
|
href="/links"
|
|
className="text-sm text-foreground hover:text-accent-blue transition-colors"
|
|
>
|
|
Links
|
|
</Link>
|
|
<Link
|
|
href="/analytics"
|
|
className="text-sm text-foreground hover:text-accent-blue transition-colors"
|
|
>
|
|
Analytics
|
|
</Link>
|
|
</nav>
|
|
</div>
|
|
<div className="flex items-center space-x-3">
|
|
<button className="p-2 text-sm text-foreground rounded-md gradient-border">
|
|
Upgrade
|
|
</button>
|
|
<button className="p-2 text-sm text-foreground hover:text-accent-blue">
|
|
<svg
|
|
className="w-5 h-5"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
>
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<circle cx="12" cy="10" r="3"></circle>
|
|
<path d="M7 20.662V19a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v1.662"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|