Disabled State

Weiterleitung

Sie werden in Sekunden weitergeleitet.

Falls keine Weiterleitung erfolgt, klicken Sie auf den Link:

Es ist etwas schief gelaufen.

Upps - das Senden Deiner Anfrage ist fehlgeschlagen. Du kannst uns aber immer via E-Mail erreichen.

Disabled State

Der Disabled State signalisiert, dass bestimmte Elemente momentan nicht interaktiv sind. Dies unterstützt eine klare und intuitive Nutzendenführung.

Pattern--Disabled--Playground

Anwendungsbeispiele

Komponenten werden im Disabled State auf 40% Opacity gesetzt.

Pattern--Disabled--Example-Button

 

Pattern--Disabled--Example-Form

Enabled Komponenten besitzen eine Opacity von 100%, im Disabled State werden sie auf 40% Opacity gesetzt.

Globaler Stil

Alle Inhalte einer Komponente wie Hintergrund, Border, Text und Icons werden auf 40% Opazität (Opacity) gesetzt.Im Disabled State besitzen die Komponenten weiters keine interaktiven States, das bedeutet:

  • Keine Hover- und Pressed-Verhalten oder visuelle Rückmeldungen.
  • Keine Cursor-Anzeige (not-allowed) beim Überfahren mit der Maus.

   

Focus State

Der Required State zeigt Nutzer:innen, dass bestimmte Formular-Inhalte zwingend ausgefüllt werden müssen, um fortzufahren.

Required State

Der Required State zeigt Nutzer:innen, dass bestimmte Formular-Inhalte zwingend ausgefüllt werden müssen, um fortzufahren.

Du hast Fragen oder Input? 

Wir haben alles dafür gegeben, dass unser Design System mit möglichst wenigen Regeln auskommt. So wird es einfach in der Anwendung, führt zu konsistenten Ergebnissen und stärkt die Marke Deutsche Bahn! Solltest du dir jedoch unsicher sein, Fragen oder einfach nur eine gute Verbesserungsidee haben, so sind wir gerne für dich da!

E-Mail schreiben Feedback in Github