|
1
|
import Link from "next/link"; |
|
2
|
|
|
3
|
const links = [ |
|
4
|
{ href: "/about", label: "About" }, |
|
5
|
{ href: "https://github.com/getsigit/siti", label: "GitHub", external: true }, |
|
6
|
{ href: "https://www.reddit.com/r/SitiAI/", label: "Reddit", external: true } |
|
7
|
]; |
|
8
|
|
|
9
|
export function SiteNav() { |
|
10
|
return ( |
|
11
|
<header className="sticky top-0 z-10 border-b border-border bg-bg/80 backdrop-blur"> |
|
12
|
<nav className="mx-auto flex max-w-5xl items-center justify-between px-6 py-4"> |
|
13
|
<Link |
|
14
|
href="/" |
|
15
|
className="text-[17px] font-semibold tracking-tight text-ink" |
|
16
|
> |
|
17
|
Siti<span className="text-brand"> AI</span> |
|
18
|
</Link> |
|
19
|
<ul className="flex items-center gap-6 text-sm text-muted"> |
|
20
|
{links.map((link) => ( |
|
21
|
<li key={link.href}> |
|
22
|
{link.external ? ( |
|
23
|
<Link |
|
24
|
href={link.href} |
|
25
|
target="__blank" |
|
26
|
rel="noopener noreferrer" |
|
27
|
className="transition-colors hover:text-ink" |
|
28
|
> |
|
29
|
{link.label} |
|
30
|
</Link> |
|
31
|
) : ( |
|
32
|
<Link |
|
33
|
href={link.href} |
|
34
|
className="transition-colors hover:text-ink" |
|
35
|
> |
|
36
|
{link.label} |
|
37
|
</Link> |
|
38
|
)} |
|
39
|
</li> |
|
40
|
))} |
|
41
|
</ul> |
|
42
|
</nav> |
|
43
|
</header> |
|
44
|
); |
|
45
|
} |