A set of toggle buttons where only one can be active at a time.
<div class="tg"> <button class="tg-item active"> <span class="material-icons-round">format_align_left</span> </button> <button class="tg-item"> <span class="material-icons-round">format_align_center</span> </button> <button class="tg-item"> <span class="material-icons-round">format_align_right</span> </button> </div>
Installation
Built with pure HTML and CSS. Include ds-shared.css in your project.
pnpm add @norbielink/ds
API Reference
Classes
| Class | Description |
|---|---|
tg | Container — inline-flex, single border |
tg-item | Individual toggle (icon or text) |
tg-item.active | Selected state (black bg) |
tg-text | Text-only item variant |
tg-dk | Dark mode modifier |