Tab component for Nitro UI.
npm install @nitro-ui/component-tabTab component for Nitro UI.
Get latest version by installing via NPM @nitro-ui/component-tab:
``sh`
npm install @nitro-ui/component-tab
Include this stylesheet code into your site:
`html`
Nitro tab is the extended version of Boostrap 4 Tab. Nitro tab uses c-tab class for parent and c-tab__item for the children. Add data-toggle="tab" to the c-tab__item for it to work. Active tab will added is--active class when it activated.
Dynamic tabbed interfaces, as described in the WAI ARIA Authoring Practices, require role="tablist", role="tab", role="tabpanel", and additional aria- attributes in order to convey their structure, functionality and current state to users of assistive technologies (such as screen readers).
html
`Justified tab
To make the tab become wide and taking full horizontal space add
to c-tab.`html
...
`
$3
Nitro Tab also support button style. Button component already defined as tab dependencies for it to support button style. Add
class to c-tab.`html
..Content tab..
..Content tab..
..Content tab..
`Justified Button tab
To make the tab buttons become wide and taking full horizontal space add
to c-tab.`html