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.

Organisms

Eigenständige Flächen aus Molecules und Atoms, oft mit eigenem Zustand oder Fachbezug. Die Live-Ansicht ist der Editor.

DefinitionTable

Begriff links, Erklärung rechts, Haarlinien zwischen den Zeilen, Text 16 px von beiden Kanten. Mit Ziel ist die ganze Zeile ein Link: Fläche beim Überfahren mit dem Zeiger, kurz beim Tippen, ein Fokusring um die Zeile. Ohne Ziel bleibt die Zeile Text. Im Einsatz auf der Startseite.

Bauteile: Pfosten, Ständer, Balken, Pfette, Sparren, Brett, OSB-Platte, Schalung, jedes mit Querschnitt und Holzart.
Ausgabe: Jede Ansicht als PDF mit Schriftfeld, dazu SVG und PNG. Stückliste als CSV.

href · die ganze Zeile ist der Link

Statik: Struqo rechnet keine Statik und gibt nichts frei. Lass den Entwurf vor dem Bau von einem Tragwerksplaner prüfen.

ohne href · nur Text, kein Hover

Tabelle aus Begriff und Erklärung, auf Wunsch mit der ganzen Zeile als Link.

Organisms · ReadyCode: components/marketing/DefinitionTable.tsx

TopBar

Kopfleiste des Editors.

Organisms · ReadyCode: components/editor/TopBar.tsx