feat: 新增全局侧边栏导航组件
This commit is contained in:
parent
7344e8a4c0
commit
f49f5f4a0d
19
src/components/Sidebar.astro
Normal file
19
src/components/Sidebar.astro
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
---
|
||||||
|
import { getCollection } from 'astro:content';
|
||||||
|
// Astro v6 中获取所有文档
|
||||||
|
const docs = await getCollection('docs');
|
||||||
|
---
|
||||||
|
<aside class="w-64 bg-gray-50 dark:bg-gray-800/30 border-r border-gray-200 dark:border-gray-800 h-screen sticky top-0 overflow-y-auto p-6 flex-shrink-0 hidden md:flex flex-col">
|
||||||
|
<div class="font-extrabold text-lg mb-6 text-gray-900 dark:text-white tracking-tight">📚 知识库导航</div>
|
||||||
|
<nav class="flex flex-col gap-1.5">
|
||||||
|
<a href="/" class="text-sm font-medium text-gray-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400 transition-colors px-2 py-1.5">
|
||||||
|
🏠 返回首页
|
||||||
|
</a>
|
||||||
|
<div class="my-2 border-t border-gray-200 dark:border-gray-700/50"></div>
|
||||||
|
{docs.map(doc => (
|
||||||
|
<a href={`/docs/${doc.id}`} class="text-sm text-gray-600 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400 hover:bg-gray-100 dark:hover:bg-gray-800 px-2 py-1.5 rounded-md transition-all truncate">
|
||||||
|
{doc.data.title || doc.id}
|
||||||
|
</a>
|
||||||
|
))}
|
||||||
|
</nav>
|
||||||
|
</aside>
|
||||||
Loading…
Reference in New Issue
Block a user