8a56d0dcff
Neue statische Astro 5-App in apps/landing/ (Port 4380). Sektionen: Nav, Hero, Kartentypen-Grid (6 Typen), How-it-works, Features, mana-e.V.-Pitch, CTA, Footer. Stack: Astro 5 + Tailwind 3, kein MDX (overkill für MVP), keine externen Abhängigkeiten. Forest-grüne Farbpalette passend zum App- Theme, Serif-Headings im mana-e.V.-Stil. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
35 lines
1.4 KiB
Text
35 lines
1.4 KiB
Text
---
|
|
const steps = [
|
|
{
|
|
n: '01',
|
|
title: 'Deck erstellen oder importieren',
|
|
body: 'Leg ein neues Deck an und füge Karten über das Web-Interface hinzu — oder importiere deine bestehenden Anki-Decks direkt als .apkg-Datei. Decks aus der Bibliothek mit einem Klick übernehmen.',
|
|
},
|
|
{
|
|
n: '02',
|
|
title: 'Karten anlegen',
|
|
body: 'Wähle den passenden Kartentyp und füll die Felder aus. Für Multiple-Choice-Karten zieht das System automatisch passende Distractors aus dem restlichen Deck — du gibst nur die richtige Antwort vor.',
|
|
},
|
|
{
|
|
n: '03',
|
|
title: 'Täglich kurz lernen',
|
|
body: 'Der FSRS-Algorithmus berechnet für jede Karte den optimalen Wiederholungszeitpunkt. Du bewertest dich selbst (Nochmal / Schwer / Gut / Leicht) — damit kalibriert sich das System auf deinen persönlichen Vergessenskurve.',
|
|
},
|
|
] as const;
|
|
---
|
|
<section class="border-b border-rule bg-white py-20 sm:py-28">
|
|
<div class="mx-auto max-w-content px-6">
|
|
<p class="section-label">So funktioniert's</p>
|
|
<h2 class="mt-3 font-serif text-display text-ink">In drei Schritten zur täglichen Praxis.</h2>
|
|
|
|
<div class="mt-12 grid gap-10 sm:grid-cols-3">
|
|
{steps.map((s) => (
|
|
<div>
|
|
<span class="font-serif text-4xl font-bold text-rule">{s.n}</span>
|
|
<h3 class="mt-4 font-semibold text-ink">{s.title}</h3>
|
|
<p class="mt-2 text-sm leading-relaxed text-muted">{s.body}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|