Populate navbar with pages from contentlayer

This commit is contained in:
2025-11-17 21:37:52 +08:00
parent 2a717665ca
commit 9ad6de27f2

View File

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