Files
blog-nextjs/components/site-header.tsx

30 lines
924 B
TypeScript

import Link from 'next/link';
import { ThemeToggle } from './theme-toggle';
import { siteConfig } from '@/lib/config';
import { allPages } from 'contentlayer/generated';
export function SiteHeader() {
const pages = allPages
.slice()
.sort((a, b) => (a.title || '').localeCompare(b.title || ''));
return (
<header className="bg-white/80 backdrop-blur dark:bg-gray-950/80">
<div className="container mx-auto flex items-center justify-between px-4 py-3 text-slate-900 dark:text-slate-100">
<Link href="/" className="font-semibold">
{siteConfig.title}
</Link>
<nav className="flex items-center gap-4 text-sm">
<Link href="/blog">Blog</Link>
{pages.map((page) => (
<Link key={page._id} href={page.url}>
{page.title}
</Link>
))}
<ThemeToggle />
</nav>
</div>
</header>
);
}