VBtnGroup API
name | type | default |
|---|---|---|
string
| undefined | |
Sets the color of component when not focused. | ||
string | number | boolean | false | |
Applies utility border classes to the component. To use it, you need to omit the | ||
string
| undefined | |
Applies specified color to the control - supports utility colors with or without | ||
'default' | 'comfortable' | 'compact' | 'default' | |
Adjusts the vertical height used by the component. | ||
'vertical' | 'horizontal' | 'horizontal' | |
Control how children components are arranged - in a row or column. | ||
boolean
| false | |
Add dividers between children v-btn components. | ||
string | number | undefined | |
Designates an elevation applied to the component between 0 and 5. You can find more information on the elevation page. | ||
string | number | boolean | undefined | |
Designates the border-radius applied to the component. This can be 0, xs, sm, true, lg, xl, pill, circle, and shaped. Find more information on available border radius classes on the Border Radius page. | ||
string | (new () => any) | FunctionalComponent | 'div' | |
Specify a custom tag used on the root element. | ||
string
| undefined | |
Specify a theme for this component and all of its children. | ||
boolean
| false | |
Removes any applied border-radius from the component. | ||
'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain' | 'elevated' | |
Applies a distinct style to the component. | ||
The default Vue slot. | ||
name | default |
|---|---|
transparent | |
( $btn-group-border-color, $btn-group-border-style, $btn-group-border-width, $btn-group-border-thin-width ) | |
settings.$border-color-root | |
settings.$border-radius-root | |
settings.$border-style-root | |
thin | |
0 | |
tools.theme-color('on-surface', var(--v-high-emphasis-opacity)) | |
0 | |
48px | |
( $btn-group-background, $btn-group-color ) | |
0 |