27 lines
1.0 KiB
Plaintext
27 lines
1.0 KiB
Plaintext
---
|
|
import { getDb } from '../../lib/db';
|
|
import { listRecent, listArchiveMonths } from '../../lib/posts';
|
|
import { CATEGORIES } from '../../lib/blog-const';
|
|
const db = getDb();
|
|
const recent = listRecent(db, 4);
|
|
const months = listArchiveMonths(db);
|
|
const monthLabel = (m: string) => new Intl.DateTimeFormat('it-IT', { month: 'long', year: 'numeric' }).format(new Date(`${m}-01`));
|
|
---
|
|
<aside class="bside">
|
|
<h3>Categorie</h3>
|
|
{CATEGORIES.map((c) => <p><a href={`/blog?categoria=${encodeURIComponent(c)}`}>{c}</a></p>)}
|
|
<h3>Ultimi articoli</h3>
|
|
{recent.map((p) => (
|
|
<p><a href={`/blog/${p.slug}`}>{p.title}</a></p>
|
|
))}
|
|
<h3>Archivio</h3>
|
|
{months.map((m) => <p class="bside__month">{monthLabel(m.month)} ({m.count})</p>)}
|
|
</aside>
|
|
|
|
<style>
|
|
.bside h3 { font-size: .85rem; text-transform: uppercase; letter-spacing: .16em; margin-top: 30px; }
|
|
.bside a { text-decoration: none; color: var(--c-text); }
|
|
.bside a:hover { color: var(--c-accent-dark); }
|
|
.bside__month { text-transform: capitalize; }
|
|
</style>
|