77 lines
5.0 KiB
Markdown
77 lines
5.0 KiB
Markdown
# Benennung
|
|
|
|
Diese Datei gleicht nur das allgemeine Vokabular ab.
|
|
Komponentenregeln und komponentenspezifische Ausnahmen stehen in [[04_Gruppenregeln]] oder in den Komponenten-Notizen.
|
|
|
|
## Size-Namen
|
|
|
|
Diese Namen werden fuer Groessen verwendet.
|
|
`Medium` ist die Standardgroesse. Sie wird trotzdem `Medium` genannt, nicht `Default`.
|
|
Wenn eine Komponente Groessen benennt, muss sie diese Size-Namen verwenden. Eigene Size-Namen sollen nicht eingefuehrt werden, solange keine neue Benennungsentscheidung dokumentiert ist.
|
|
|
|
| Name | Bedeutung | Status | Notizen |
|
|
| ------------- | --------------------------- | ----------- | --------------------------------------------------- |
|
|
| `3X Small` | maximal kompakte Groesse | Entschieden | Nur Namensgebung |
|
|
| `2X Small` | sehr stark kompakte Groesse | Entschieden | Nur Namensgebung |
|
|
| `Extra Small` | sehr kompakte Groesse | Entschieden | Nur Namensgebung |
|
|
| `Small` | kompakte Groesse | Entschieden | |
|
|
| `Medium` | Standardgroesse | Entschieden | Medium ist der Default, heisst aber nicht `Default` |
|
|
| `Large` | grosse Groesse | Entschieden | |
|
|
| `Extra Large` | sehr grosse Variante | Entschieden | Nur Namensgebung |
|
|
| `2X Large` | sehr stark grosse Variante | Entschieden | Nur Namensgebung |
|
|
| `3X Large` | maximal grosse Variante | Entschieden | Nur Namensgebung |
|
|
|
|
## Radius-Namen
|
|
|
|
Diese Namen werden fuer Radius-Tokens verwendet.
|
|
|
|
| Name | Wert | Status | Notizen |
|
|
| --- | --- | --- | --- |
|
|
| `Radius Small` | 4px | Entschieden | |
|
|
| `Radius Medium` | 8px | Entschieden | |
|
|
| `Radius Large` | 12px | Entschieden | |
|
|
| `Radius Round` | 9999px | Entschieden | Fuer Kreise, Pills und voll runde Formen |
|
|
|
|
## Field-Namen
|
|
|
|
Diese Namen werden fuer Field-Anatomy in Form Inputs verwendet.
|
|
Die zugehoerigen Abstaende und Typografie-Regeln stehen in [[04_Gruppenregeln#Regel: Form Inputs teilen eine Field-Anatomy]].
|
|
|
|
| Name | Bedeutung | Status | Notizen |
|
|
| --- | --- | --- | --- |
|
|
| `label` | Field-Label oberhalb des Controls | Entschieden | Nicht fuer den unteren Field-Text verwenden |
|
|
| `helpText` | Hilfetext zwischen Label und Control | Entschieden | Steht oberhalb des Controls |
|
|
| `message` | Unterer Field-Text unterhalb des Controls | Entschieden | Heisst immer `message`, nicht `label`, `helper`, `helpText` oder `massage` |
|
|
|
|
## State-Namen
|
|
|
|
Diese Namen werden fuer States verwendet, auch wenn Subframe viele Interaction States intern abbildet.
|
|
`Focus` und `Selected` sind nicht dasselbe: `Focus` ist der aktuelle Tastatur- oder Interaktionsfokus, `Selected` ist ein ausgewaehlter oder aktiver Zustand.
|
|
|
|
| Name | Bedeutung | Status | Notizen |
|
|
| --- | --- | --- | --- |
|
|
| `default` | Normalzustand | Entschieden | Als State-Name erlaubt, nicht als Size-Name |
|
|
| `hover` | Hover-Zustand | Entschieden | |
|
|
| `active` | gedrueckt oder aktiv | Entschieden | |
|
|
| `focus` | Fokuszustand | Entschieden | Fokus auf Interaktion/Tastatur |
|
|
| `disabled` | nicht nutzbar | Entschieden | |
|
|
| `loading` | Aktion oder Inhalt laedt | Entschieden | |
|
|
| `error` | Fehler oder Validierung | Entschieden | Nicht automatisch gleich `destructive` |
|
|
| `selected` | ausgewaehltes Element | Entschieden | Nicht dasselbe wie `focus` |
|
|
|
|
## Varianten-Namen
|
|
|
|
Diese Namen werden fuer Varianten verwendet.
|
|
|
|
| Name | Bedeutung | Status | Notizen |
|
|
| ------------- | ------------------------------- | ----------- | -------------------------------------------------------- |
|
|
| `primary` | wichtigste Aktion oder Betonung | Entschieden | Brand-gebunden; Default ist meistens Primary |
|
|
| `secondary` | zweite Aktion oder Betonung | Entschieden | Brand-gebunden; Farben spaeter klaeren |
|
|
| `tertiary` | niedrigere Betonung | Entschieden | Bleibt zusaetzlich zu `ghost` bestehen |
|
|
| `ghost` | minimale visuelle Betonung | Entschieden | Bleibt zusaetzlich zu `tertiary` bestehen |
|
|
| `destructive` | gefaehrliche Aktion | Entschieden | Fuer gefaehrliche Aktionen; nicht mit `error` vermischen |
|
|
| `neutral` | neutrale Variante | Entschieden | Neutrale/schwarze Variante |
|
|
| `success` | positives Feedback | Entschieden | |
|
|
| `warning` | Warnung | Entschieden | |
|
|
| `information` | Information | Entschieden | |
|