Komponenten
Navigation und progressive Interaktion.
Alle Beispiele verwenden das gebaute Bundle. Dropdown und Collapse sind mit Maus und Tastatur bedienbar.
Dropdown
Öffnen, außerhalb klicken oder mit Escape schließen.
.dropdown und
.dropdown__menu.
.dropdown.dropdown--right und
.dropdown__menu.
Collapse
Ein einzelner ein- und ausblendbarer Inhaltsbereich.
Dieser Inhalt wird durch VLX.Collapse gesteuert.
Tabs
Die visuelle Komponente mit einer kleinen Demo-Steuerung.
Übersicht
Tabs gruppieren mehrere Ansichten auf engem Raum.
Details
Aktive Zustände werden über das umgebende Listenelement markiert.
<ul class="nav nav-tabs">…</ul>
Pill-Variante
Die Pill-Variante eignet sich für kompakte, deutlich abgegrenzte Ansichtswechsel.
Aktivitäten und zeitbezogene Änderungen.
Konfiguration der aktuellen Ansicht.
Accordion
data-parent sorgt dafür, dass nur ein Eintrag geöffnet bleibt.
Ein leichtgewichtiges Designsystem aus LESS und Vanilla JavaScript.
Zur Laufzeit keine; der Build nutzt LESS und esbuild.
Ja, über data-vlx-theme="dark" am Dokumentelement.