Components – Interactive Elements

Formular-Layout-Regel: Wenn Pulldowns, Slider, Radio-Felder, Checkbox-Felder oder Eingabefelder direkt untereinander als Gruppe dargestellt werden, nutzen alle Zeilen dieselbe Label-Spaltenbreite und denselben horizontalen Abstand zwischen Label und Interaktionselement. Auf Mobile erfolgt der Umbruch komponentenspezifisch in eine einspaltige Darstellung.

Component: Link-Buttons

Component: Prozessbutton

Component: Pulldown

Komponente normal

Label

Menüpunkt 1
Menüpunkt 2
Menüpunkt 3
Menüpunkt 4
Menüpunkt 5

Variante aktivierbar

Label

Checkbox 1 Checkbox 2 Checkbox 3

form-disabled

Label

Component: Suchfeld

form-inactive-selectable

0 Treffer

form-active / selected

12 Treffer

form-disabled

Component: Eingabefeld einzeilig

form-inactive-selectable

Label

form-active / selected

Label

form-disabled

Label

Component: Eingabefeld mehrzeilig

form-inactive-selectable

Label

form-active / selected

Label

form-disabled

Label

Component: Kreuzchenfeld / Multiple Choice

Komponente normal Standard Checkbox

Variante aktivierbar Option wählbar

form-disabled Option nicht verfügbar

Component: Radio Button / Single Choice

Komponente normal Label Radio 1 Radio 2

Variante aktivierbar Label Option 1 Option 2

form-disabled Option nicht verfügbar

Component: Modus Schieber global

Component: Modus Schieber lokal

Component: Aktivierungs-Schalter (an/aus)

Component: Slider

Komponente normal

Wert 6.5

Variante aktivierbar

Wert 2.0

Component: Fragezeichen-Icon

Component: Hyperlink

Dies ist ein Text mit einem Hyperlink.