New to Kendo UI for Angular? Start a free 30-day trial
Customizing SplitButton
Variables
The following table lists the available variables for customization.
| Name | Type | Default value | Computed value |
|---|---|---|---|
| $kendo-split-button-focus-shadow | List | $kendo-button-focus-shadow | 0 0 0 0.25rem color-mix(in srgb, var(--kendo-color-border, rgba(33, 37, 41, 0.13)) 50%, transparent) |
Description
The focus shadow of the SplitButton. | |||
| $kendo-split-button-arrow-padding-x | Number | $kendo-button-padding-y | 0.375rem |
Description
The horizontal padding of the arrow Button. | |||
| $kendo-split-button-sm-arrow-padding-x | Number | $kendo-button-sm-padding-y | 0.25rem |
Description
The horizontal padding of the small arrow Button. | |||
| $kendo-split-button-md-arrow-padding-x | Number | $kendo-button-md-padding-y | 0.375rem |
Description
The horizontal padding of the medium arrow Button. | |||
| $kendo-split-button-lg-arrow-padding-x | Number | $kendo-button-lg-padding-y | 0.5rem |
Description
The horizontal padding of the large arrow Button. | |||
| $kendo-split-button-arrow-padding-y | Number | $kendo-button-padding-y | 0.375rem |
Description
The vertical padding of the arrow Button. | |||
| $kendo-split-button-sm-arrow-padding-y | Number | $kendo-button-sm-padding-y | 0.25rem |
Description
The vertical padding of the small arrow Button. | |||
| $kendo-split-button-md-arrow-padding-y | Number | $kendo-button-md-padding-y | 0.375rem |
Description
The vertical padding of the medium arrow Button. | |||
| $kendo-split-button-lg-arrow-padding-y | Number | $kendo-button-lg-padding-y | 0.5rem |
Description
The vertical padding of the large arrow Button. | |||