45 lines
1.6 KiB
Plaintext
45 lines
1.6 KiB
Plaintext
---
|
|
import { getCollection } from 'astro:content';
|
|
import BaseLayout from '../../layouts/BaseLayout.astro';
|
|
|
|
const pages = await getCollection('book');
|
|
pages.sort((a, b) => a.data.part - b.data.part);
|
|
|
|
const chapters = pages.reduce((acc, page) => {
|
|
const chapter = page.data.chapter["id"];
|
|
if (!acc[chapter]) acc[chapter] = [];
|
|
acc[chapter].push(page);
|
|
return acc;
|
|
}, {} as Record<string, typeof pages>);
|
|
---
|
|
<BaseLayout title="Das Buch" theme="book" description="Ein fortlaufendes Werk über Software, Design und Architektur von c0ntroller.de.">
|
|
<div class="glass-container header">
|
|
<h1>Das Buch</h1>
|
|
<p>Ein fortlaufendes Werk über Software, Design und Architektur.</p>
|
|
</div>
|
|
|
|
<div class="glass-container toc">
|
|
<h2>Inhaltsverzeichnis</h2>
|
|
{Object.entries(chapters).map(([chapter, items]) => (
|
|
<div class="chapter">
|
|
<h3>{chapter.replace(/-/g, ' ').toUpperCase()}</h3>
|
|
<ul class="page-list">
|
|
{items.map(item => (
|
|
<li><a href={`/book/${item.id}`}>{item.data.title}</a></li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</BaseLayout>
|
|
<style>
|
|
.header { margin-bottom: 2rem; }
|
|
.toc { padding: 2rem; }
|
|
.chapter { margin-bottom: 1.5rem; }
|
|
.chapter h3 { margin-top: 0; margin-bottom: 0.5rem; font-size: 1.1rem; opacity: 0.8; }
|
|
.page-list { list-style: none; padding-left: 0; margin: 0; }
|
|
.page-list li { margin-bottom: 0.5rem; }
|
|
.page-list a { display: block; padding: 0.5rem; border-radius: 0.25rem; transition: background 0.2s; }
|
|
.page-list a:hover { background: rgba(59, 130, 246, 0.1); }
|
|
</style>
|