Deck schema, API routes, and SvelteKit UI for creating and browsing decks
(DeckStack component, inline creation, floating nav). Production compose
updated with PUBLIC_AUTH_WEB_URL so cards-web redirects to auth.mana.how
for login/register instead of the raw API.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- DeckStack: Pencil-Icon absolut unten-rechts, erscheint beim Hover
(z-index über Card, ausserhalb des <a>-Links zur Detail-Page)
- Neuer Route /decks/[id]/edit: Form für Name, Beschreibung, Farbe
- i18n deck_edit keys (de + en)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- /study-Listing entfernt, Route redirectet auf /decks
- Study-Tab aus Nav entfernt; /study/*-Pfade highlighten Decks-Tab
- /decks/new und /decks/new-ai zusammengeführt: ein Formular mit
zwei Buttons (Anlegen + ✨ Mit KI generieren), new-ai redirectet
- Inline NewDeckCard: Formular klappt in der Kachel auf (gleiche
Größe, scrollbar), Fach als Toggle-Picker, alle Felder volle Breite
- DeckStack: Text linksbündig, Beschreibung ohne Clamp, Titel weiter oben
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Decks fühlen sich jetzt wie echte Karten an, statt flacher Boxen.
Eine zentrale CardSurface-Komponente trägt die Karten-Optik
(Border, Radius 0.875rem, Shadow, Color-Stripe links) — drei
Sizes (md/lg/hero), drei Konsumenten, ein visuelles Familien-Set.
Komponenten:
- CardSurface.svelte Foundation für jede Card-Erscheinung in Cards
- DeckStack.svelte 5:7-Stapel mit 3 deterministisch tilted
Hintergrund-Layern (cyrb53-Hash der Deck-ID,
reproduzierbar pro Mount), Color-Stripe-Akzent,
Title/Description/Card-Count/Due-Badge
- DeckGrid.svelte Auto-fill responsive Grid; selectedId-Prop
triggert Stufe-1-Animation (others fade-out,
selected scale-up)
- DeckFan.svelte Auffächer-Detail-View (Hand of Cards) mit
Top-7-Karten als Spread, Mount-Animation
gestapelt → fanned via doppeltem rAF +
cubic-bezier-Transition
- utils/deck-tilt.ts cyrb53 + stackLayers für Pseudo-Random-Tilts
Routing-Wechsel: Klick auf Deck-Stack → 220ms Stufe-1-Fade →
goto('/study/<id>') direkt in den Lernmodus. Detail-View
(/decks/<id>) bleibt erreichbar über "Karten verwalten →"-Link
in der Study-Sidebar.
Lernmodus visuell als Karte:
- Globale Header (Logo + Nav + Sprach-Switcher) im Lernmodus
ausgeblendet (routes/+layout.svelte detektiert /study/<deckId>
per Regex), volle Konzentration auf die Karte
- Lern-Karte ist CardSurface size="hero" mit aspect-ratio 5:7
(Portrait, gleiches Verhältnis wie Deck-Stacks und Fan-Karten)
- Color-Stripe links zeigt die Deck-Farbe — visuelle Bindung an
Herkunft
- Sidebar oben links absolute-positioniert: ← Decks, Deck-Name,
Fortschritt, Karten verwalten → — kompakter UI-Block, der die
Karten-Zentrierung NICHT beeinflusst (Karte bleibt geometrisch
Bildschirm-Mitte)
- Reveal-Button + 4er-Grade-Grid (Wieder/Schwer/Gut/Leicht) als
Aktions-Leiste UNTER der Karte — keine weiteren Karten, ein
Review = eine Karte
Mobile (≤720px): Sidebar wird zur horizontalen Zeile oben, Karte
rückt darunter durch padding-top: 6.5rem.
Reduced-motion durchgängig respektiert (keine Tilts, keine Hover-
Lifts, keine Fan-Spread-Animation, kein Card-Transition).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
