Customizing Tabstrip
The following table lists the available variables for customization.
| Name | Type | Default value | Computed value |
|---|---|---|---|
| $button-border-width | $btn-border-width | ||
|
Description
Width of border around buttons
|
|||
| $button-border-radius | $border-radius | $border-radius | |
|
Description
Border radius of buttons
|
|||
| $button-padding-x | $btn-padding-x | ||
|
Description
Horizontal padding of buttons
|
|||
| $button-padding-y | $btn-padding-y | ||
|
Description
Vertical padding of buttons
|
|||
| $tabstrip-bg | null | null | |
|
Description
Background color of tabstrip component
|
|||
| $tabstrip-text | $component-text | ||
|
Description
Text color of tabstrip component
|
|||
| $tabstrip-border | $nav-tabs-border-color | ||
|
Description
Border color of tabstrip component
|
|||
| $tabstrip-item-padding-x | $nav-item-padding-x | ||
|
Description
Horizontal padding of tabs
|
|||
| $tabstrip-item-padding-y | $nav-item-padding-y | ||
|
Description
Vertical padding of tabs
|
|||
| $tabstrip-item-border-width | $nav-tabs-border-width | ||
|
Description
Width of border around tabs
|
|||
| $tabstrip-item-border-radius | $nav-tabs-border-radius | ||
|
Description
Border radius of tabs
|
|||
| $tabstrip-item-gap | $nav-item-margin | ||
|
Description
Spacing between tabs
|
|||
| $tabstrip-item-bg | null | null | |
|
Description
Background color of tabs
|
|||
| $tabstrip-item-text | $link-text | ||
|
Description
Text color of tabs
|
|||
| $tabstrip-item-border | null | null | |
|
Description
Border color of tabs
|
|||
| $tabstrip-item-gradient | null | null | |
|
Description
Background gradient of tabs
|
|||
| $tabstrip-item-hovered-bg | null | null | |
|
Description
Background color of hovered tabs
|
|||
| $tabstrip-item-hovered-text | $link-hover-text | ||
|
Description
Text color of hovered tabs
|
|||
| $tabstrip-item-hovered-border | $nav-tabs-link-hover-border-color | ||
|
Description
Border color of hovered tabs
|
|||
| $tabstrip-item-hovered-gradient | null | null | |
|
Description
Background gradient of hovered tabs
|
|||
| $tabstrip-item-selected-bg | $nav-tabs-link-active-bg | ||
|
Description
Background color of selected tabs
|
|||
| $tabstrip-item-selected-text | $nav-tabs-link-active-color | ||
|
Description
Text color of selected tabs
|
|||
| $tabstrip-item-selected-border | $nav-tabs-link-active-border-color | ||
|
Description
Border color of selected tabs
|
|||
| $tabstrip-item-selected-gradient | null | null | |
|
Description
Background gradient of selected tabs
|
|||
| $tabstrip-content-padding-x | $tabstrip-item-padding-x | ||
|
Description
Horizontal padding of tabstrip content
|
|||
| $tabstrip-content-padding-y | $tabstrip-item-padding-y | ||
|
Description
Vertical padding of tabstrip content
|
|||
| $tabstrip-content-border-width | $nav-tabs-border-width | ||
|
Description
Width of border around tabstrip content
|
|||
| $tabstrip-content-bg | $component-bg | $component-bg | |
|
Description
Background color of tabstrip content
|
|||
| $tabstrip-content-text | $component-text | ||
|
Description
Text color of tabstrip content
|
|||
| $tabstrip-content-border | $component-border | ||
|
Description
Border color of tabstrip content
|
|||