Playground
Verwende <LoadingSpinner>, um einen LoadingSpinner darzustellen.
import { LoadingSpinner } from "@mittwald/flow-react-components"; <LoadingSpinner />
Color
Im Standardfall wird der LoadingSpinner in der Color Default verwendet. Diese ist in einem neutralen Ton gehalten, um gute Sichtbarkeit zu gewährleisten, ohne von der übrigen Benutzeroberfläche abzulenken.
Light und Dark
Zusätzlich zur Standard-Color kann der LoadingSpinner auch in den Varianten Light und Dark dargestellt werden. Beide Colors eignen sich, wenn die Standard-Color auf farbigen oder dekorativen Hintergründen nicht genug Kontrast bietet.
import { LoadingSpinner } from "@mittwald/flow-react-components"; <LoadingSpinner color="light" />
import { LoadingSpinner } from "@mittwald/flow-react-components"; <LoadingSpinner color="dark" />
Light: Verwende die Light-Color, bei dunklen Hintergründen mit einem HSL Lightness-Wert von weniger als 50.
Dark: Verwende die Dark-Color, bei hellen, farbigen Hintergründen mit einem HSL Lightness-Wert von größer als 50.