65 lines
2.2 KiB
Markdown
65 lines
2.2 KiB
Markdown
# assessor-ui
|
|
|
|
Verbindliche Designsprache fuer ASSESSOR, ausgelegt fuer Claude Code.
|
|
|
|
## Installation
|
|
|
|
Projektweit (empfohlen, damit der Skill mit dem Repository versioniert wird):
|
|
|
|
```bash
|
|
mkdir -p <projekt>/.claude/skills
|
|
cp -r assessor-ui <projekt>/.claude/skills/
|
|
```
|
|
|
|
Benutzerweit:
|
|
|
|
```bash
|
|
mkdir -p ~/.claude/skills
|
|
cp -r assessor-ui ~/.claude/skills/
|
|
```
|
|
|
|
## Einbindung im Projekt
|
|
|
|
Nutzerkorrektur 2026-09-18: Data Hub, Work und Pathfinder sind die verbindlichen
|
|
Ableton-inspirierten Referenzen, auch fuer Client Info, Mockups und Prototypen.
|
|
Zuerst [AGENTS.md](../../../AGENTS.md#binding-assessor-design-language) und den
|
|
Vorrangabschnitt in `SKILL.md` lesen. Die aktuellen Projekt-Tokens liegen in
|
|
`src/styles/ui-tokens.css`; bestehende Komponenten und Styles werden weiterverwendet.
|
|
Die Dateien unter `assets/` und aeltere Referenzskizzen sind historische Beispiele.
|
|
Sie duerfen nicht ueber die aktuellen Styles kopiert oder erneut in den Build
|
|
eingebunden werden. Die fruehere Kopieranleitung ist hiermit ausdruecklich aufgehoben.
|
|
|
|
Theme und Dichte am Wurzelelement:
|
|
|
|
```html
|
|
<html data-theme="dark" data-density="standard">
|
|
```
|
|
|
|
Erlaubte Werte: `data-theme` = `dark` oder `light`, `data-density` = `compact`, `standard`, `reading`.
|
|
|
|
## Aufbau
|
|
|
|
| Datei | Inhalt |
|
|
|-------|--------|
|
|
| `SKILL.md` | Design-DNA, nicht verhandelbare Regeln, Shell, Dichte, Typografie, Definition of Done |
|
|
| `assets/tokens.css` | alle Farben, Masse, Radien, Schatten, Typografie fuer Dark und Light |
|
|
| `assets/components.css` | Referenzimplementierung der Kernkomponenten |
|
|
| `references/state-model.md` | sieben Zustandsdimensionen und ihre Darstellung |
|
|
| `references/components.md` | Komponentenvertraege mit festen Massen |
|
|
| `references/page-archetypes.md` | Shell und die vier erlaubten Seitenlayouts |
|
|
| `references/review-checklist.md` | Abnahmekriterien, grep-Pruefungen, Ist-/Soll-Korrekturen |
|
|
|
|
## Nutzung
|
|
|
|
Der Skill triggert automatisch bei UI-Aufgaben an ASSESSOR. Erzwingen laesst er sich mit:
|
|
|
|
```text
|
|
Nutze den Skill assessor-ui. Gestalte Client Info mit der bestehenden Designsprache von Data Hub, Work und Pathfinder.
|
|
```
|
|
|
|
Vor dem Abschluss einer Aenderung:
|
|
|
|
```text
|
|
Pruefe die Aenderung gegen references/review-checklist.md, Abschnitte 1 bis 5.
|
|
```
|