Statische Komponenten

Badge

defaultprimarydangerwarningsuccessinfo
anchoroutlinepillpulse

Button

Standard

Variants

Sizes

Outline

Prefix and Suffix Icons

Caret

Verwende das Attribut data-caret um einen Dropdown-Indikator hinzuzufügen.

  

Loading

Verwende das Attribut data-loading um einen Button in den Ladestatus zu versetzen.

  

Icon button

Reveal

Single container

Verwende das Attribut data-reveal-(hide|show|toggle) um Container ein, -auszublenden (Beispiel: data-reveal-...="#stco-reveal-container").

Cras risus ipsum, faucibus ut, ullamcorper id, varius ac, leo. Vivamus aliquet elit ac nisl. Aenean imperdiet. Aenean ut eros et nisl sagittis vestibulum. Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc, eu sollicitudin urna dolor sagittis lacus.

Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Vestibulum suscipit nulla quis orci. Maecenas malesuada. Nam pretium turpis et arcu. Nam at tortor in tellus interdum sagittis.


Multiple container

Verwende das Attribut data-reveal-(hide|show|toggle) um Container ein, -auszublenden (Beispiel: data-reveal-...=".stco-reveal-container-multiple").

Dieser Container ist standardmäßig eingeblendet.

Cras risus ipsum, faucibus ut, ullamcorper id, varius ac, leo. Vivamus aliquet elit ac nisl. Aenean imperdiet. Aenean ut eros et nisl sagittis vestibulum. Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc, eu sollicitudin urna dolor sagittis lacus.

Dieser Container ist standardmäßig ausgeblendet (style="display: none;").


Tag

Colors

NeutralPrimarySuccessInfoWarningDanger

Sizes

SmallDefaultLarge

Pill

SmallDefaultLarge

Removable

Verwende das Attribut data-removable um das Tag entfernbar und das Attribute data-label um den Löschenbutton mit dem entspr. Aria-Attribut auszuzeichen.

SmallDefaultLarge

Pagination

Layout "compact"

Layout "minimal"

Size "small"

Size "large"