Verwende Flex, um ...
- individuelle Layouts zu gestalten, die keinem festen UI Pattern folgen.
- bewusst vom Standard des Designsystems abzuweichen.
Grundlagen
Flex wurde eingeführt, um eine flexible Anordnung von Inhalten auf Basis der CSS-Flexbox zu ermöglichen. So bleibt unser Designsystem offen genug, um auch spezifische, schwer zu standardisierende Anforderungen und Layouts abzubilden.
Best practices
Achte bei der Verwendung von Flex darauf, dass ...
- sie nicht für Layouts verwendet wird, die mit Align kombiniert werden können und einem festen UI-Pattern folgen.
- sie gezielt für Sonderfälle genutzt wird – in den meisten Fällen bietet unser Designsystem bereits eine passende Lösung.
Flex vs. Align
Flex und Align sind sich als Layout-Components sehr ähnlich. Um die beiden besser unterscheiden zu können, hier ein paar hilfreiche Anhaltspunkte.
Verwende Align, um ...
- vorab definierte Components miteinander zu kombinieren und automatisch anzuordnen.
- wiederkehrende UI Patterns konsistent umzusetzen.