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>
|
||
|---|---|---|
| .github/workflows | ||
| apps | ||
| docs | ||
| infrastructure | ||
| packages/cards-domain | ||
| .env.example | ||
| .gitignore | ||
| .npmrc | ||
| .prettierrc.json | ||
| app-manifest.json | ||
| CLAUDE.md | ||
| package.json | ||
| pnpm-lock.yaml | ||
| pnpm-workspace.yaml | ||
| README.md | ||
| STATUS.md | ||
| tsconfig.base.json | ||
| turbo.json | ||
Cards
Eigenständige Spaced-Repetition-App des Vereins mana e.V.
Cards ist eine föderierte Peer-App im mana-Ökosystem. Sie verwaltet Karteikarten, plant Wiederholungen mit dem FSRS-Algorithmus und empfängt Inhalte aus anderen Verein-Apps (z.B. Zitate aus Memoro, Notizen aus Mana, Web-Schnipsel aus dem Browser-Plugin).
→ Live (geplant): https://cardecky.mana.how
Aktueller Stand und Pickup-Onboarding: STATUS.md.
Stack
- Frontend: SvelteKit 2 + Svelte 5 (runes-only)
- Backend: Hono + Bun + Drizzle ORM
- Datenbank: Postgres mit Schema-Isolation (
pgSchema('cards')) - Auth: föderiert über mana-auth (EdDSA JWT, JWKS-Cache)
- Subscriptions: mana-credits (zentral pro Verein-Account)
- AI-Tools: über mana-mcp Claude Desktop / persona-runner verfügbar
- i18n: DE / EN / FR / ES / IT
- Build: Turborepo + pnpm 9
Status
Phase 0 (Repo-Skeleton) — siehe mana/docs/playbooks/CARDS_GREENFIELD.md
für den vollständigen Plan.
Lokal entwickeln
pnpm install
pnpm dev:full # cards docker + mana docker + DB-Push (cards & auth) + dev (cards & mana-auth)
Oder von überall via zsh-Alias: cards-dev.
dev:full greift in ../mana/ (Plattform-Repo): startet mana-postgres,
pushed mana-auth-Schema, und startet mana-auth auf :3001 parallel zu
cards-api/-web. Damit ist Login lokal komplett testbar (Cookie-Domain
localhost, eigener Dev-User in lokaler mana_auth-DB).
Einzelschritte (falls nur Teile gebraucht werden):
pnpm docker:up # Cards Postgres + MinIO (wartet bis healthy)
pnpm docker:up:auth # Mana Postgres (wartet bis healthy)
pnpm db:push # Cards Drizzle-Schema
pnpm db:push:auth # mana-auth Drizzle-Schema
pnpm dev # cards api + web parallel (Turbo)
pnpm dev:auth # mana-auth :3001
→ API auf http://localhost:3081, Web auf http://localhost:3082 (oder Vite-Dev-Default 5173).
Voraussetzung: Mana-Plattform-Stack (mana-auth, evtl. Föderations-Services) muss lokal laufen, sonst greift Auth-Login nicht.
Lizenz
Mana-Verein-intern, MIT (siehe mana/docs/COMPLIANCE.md für Details
zur Verein-Lizenzpolitik).