JUSN
39e6aa20e7
Die Mobile-App laeuft im Browser bisher als schmale Handy-Spalte (siehe design/desktop-ansicht/referenz/mobile-ansicht-im-browser.png). Dieses Bundle beschreibt die Desktop-Adaption: dreispaltiges App-Layout mit permanenter Sidebar, zentralem Kartenstapel und Detailspalte, Swipe ersetzt durch Maus-Drag, Buttons und Tastatur. - README.md: vollstaendige Spezifikation (App-Shell, Screens Feed/Profil/ Erstellen/Einstellungen, Interaktionen, State-Modell, Design-Tokens) - Videogen Web.dc.html + support.js: Referenz-Prototyp zum Ansehen, ausdruecklich kein Produktionscode - PROMPT.md: Umsetzungsauftrag, Pfade an die Ablage im Repo angepasst Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
18 lines
1.1 KiB
Markdown
18 lines
1.1 KiB
Markdown
Setze das Design aus diesem Ordner in unserem Stack um.
|
|
|
|
1. Lies `design/desktop-ansicht/README.md` vollständig — es enthält Layout, exakte
|
|
Farben, Typografie, Abstände, Interaktionen, State-Modell und Design-Tokens.
|
|
2. Referenz-Prototyp: `design/desktop-ansicht/Videogen Web.dc.html`
|
|
(Template oben, Logikklasse mit Zustand/Interaktion unten, Beispieldaten in `DATA`).
|
|
Zum Ansehen im Browser öffnen — `support.js` muss im selben Ordner liegen.
|
|
Diese Dateien sind Design-Referenz, kein Produktionscode: nicht kopieren, sondern
|
|
in unserer bestehenden Umgebung mit unseren Patterns und Komponenten nachbauen.
|
|
3. Fidelity ist high — pixelgenau umsetzen: Farben, Radien, Übergänge, Hover-/Focus-States,
|
|
Drag-Schwellen und Animationsdauern wie im README angegeben.
|
|
4. Umfang: App-Shell (Sidebar + Kopfzeile mit Tabs) und die vier Screens
|
|
Feed, Profil, Erstellen, Einstellungen.
|
|
5. Icons als Lucide-Icons umsetzen (im Prototyp stehen Unicode-Glyphen als Platzhalter).
|
|
Medien-Platzhalter (CSS-Verläufe mit Streifen) durch echte Bilder/Videos ersetzen.
|
|
|
|
Frag nach, bevor du Struktur oder Verhalten abweichend vom README änderst.
|