Designsystem

Tokens, Bausteine, Voice.

Die offene Referenz zum visuellen System von Struqo, von den Tokens bis zu ganzen Seiten. Jeder Wert kommt live aus dem Code, Figma folgt ihm. Agents lesen dieselben Bausteine in apps/web/components/styleguide/catalog.ts.

06

Pages

Ein Template mit echtem Inhalt. Hier zeigt sich, ob das System trägt: lange Namen, Deutsch und Englisch, Gast und angemeldet.

Editor mit Carport

Der Editor mit dem Carport-Beispiel, als Gast offen. Prüft Namen, Maße und alle Blätter mit echtem Inhalt.

Pages · ReadyCode: app/[locale]/(app)/editor/page.tsx

Besteht aus: Editor

Öffnen: /editor?example=carport

Startseite

Die Startseite mit allen Abschnitten in Deutsch und Englisch.

Pages · ReadyCode: app/[locale]/(marketing)/page.tsx

Besteht aus: Marketing-Seite

Öffnen: /

Projekte

Die Projektliste, angemeldet. Prüft leere Liste, ein Projekt und viele.

Pages · ReadyCode: app/[locale]/(app)/(shell)/projects/page.tsx

Besteht aus: App-Seite

Öffnen: /projects

Anmelden

Anmelden mit Fehlermeldungen und Passwort-vergessen-Weg.

Pages · ReadyCode: app/[locale]/(auth)/login/page.tsx

Besteht aus: Anmelde-Seite

Öffnen: /login

Carport-Plansatz

Der Plansatz des Carports als PDF, im Editor über Drucken. Prüft Schriftfeld, Maßstab und Stückliste.

Pages · ReadyCode: components/print/PrintDocument.tsx

Besteht aus: Planblatt

Ohne eigene Adresse, im Editor über Drucken.

Designsystem · Struqo