Populate navbar with pages from contentlayer
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user