New to Kendo UI for Vue? Start a free 30-day trial
Customizing List
The following table lists the available variables for customization.
| Name | Type | Default value | Computed value |
|---|---|---|---|
| $kendo-list-font-size | Null |
|
|
Description
Font size of the list component, if no size is set. | |||
| $kendo-list-line-height | Null |
|
|
Description
Line height of the list component, if no size is set. | |||
| $kendo-list-header-padding-x | Null |
|
|
Description
Horizontal padding of list header, if no size is set. | |||
| $kendo-list-header-padding-y | Null |
|
|
Description
Vertical padding of list header, if no size is set. | |||
| $kendo-list-header-border-width | List |
|
|
Description
Border width of list header. | |||
| $kendo-list-header-font-size | Null |
|
|
Description
Font size of list header, if no size is set. | |||
| $kendo-list-header-line-height | Null |
|
|
Description
Line height of list header, if no size is set. | |||
| $kendo-list-header-font-weight | String |
|
|
Description
Font weight of list header. | |||
| $kendo-list-item-padding-x | Null |
|
|
Description
Horizontal padding of list items, when no size is set. | |||
| $kendo-list-item-padding-y | Null |
|
|
Description
Vertical padding of list items, when no size is set. | |||
| $kendo-list-item-font-size | Null |
|
|
Description
Font size of list items, if no size is set. | |||
| $kendo-list-item-line-height | Null |
|
|
Description
Line height of list items, if no size is set. | |||
| $kendo-list-group-item-padding-x | Null |
|
|
Description
Horizontal padding of list group items, when no size is set. | |||
| $kendo-list-group-item-padding-y | Null |
|
|
Description
Vertical padding of list group items, when no size is set. | |||
| $kendo-list-group-item-border-width | List |
|
|
Description
Border width of list group items. | |||
| $kendo-list-group-item-font-size | Null |
|
|
Description
Font size of list group items, if no size is set. | |||
| $kendo-list-group-item-line-height | Null |
|
|
Description
Line height of list group items, if no size is set. | |||
| $kendo-list-group-item-font-weight | String |
|
|
Description
Font weight of list group item. | |||
| $kendo-list-bg | Color |
|
|
Description
Background color of the list component. | |||
| $kendo-list-text | Color |
|
|
Description
Text color of the list component. | |||
| $kendo-list-border | Color |
|
|
Description
Border color of the list component. | |||
| $kendo-list-header-bg | Null |
|
|
Description
Background color of list header. | |||
| $kendo-list-header-text | Null |
|
|
Description
Text color of list header. | |||
| $kendo-list-header-border | String |
|
|
Description
Border color of list header. | |||
| $kendo-list-header-shadow | Null |
|
|
Description
Box shadow of list header. | |||
| $kendo-list-item-bg | Null |
|
|
Description
Background color of list items. | |||
| $kendo-list-item-text | Null |
|
|
Description
Text color of list items. | |||
| $kendo-list-item-hover-bg | Color |
|
|
Description
Background color of hovered list items. | |||
| $kendo-list-item-hover-text | Color |
|
|
Description
Text color of hovered list items. | |||
| $kendo-list-item-focus-bg | Null |
|
|
Description
Background color of focused list items. | |||
| $kendo-list-item-focus-text | Null |
|
|
Description
Text color of focused list items. | |||
| $kendo-list-item-focus-shadow | List |
|
|
Description
Box shadow of focused list items. | |||
| $kendo-list-item-selected-bg | Color |
|
|
Description
Background color of selected list items. | |||
| $kendo-list-item-selected-text | Color |
|
|
Description
Text color of selected list items. | |||
| $kendo-list-group-item-bg | Null |
|
|
Description
Background color of list group items. | |||
| $kendo-list-group-item-text | Null |
|
|
Description
Text color of list group items. | |||
| $kendo-list-group-item-border | String |
|
|
Description
The border color of list group items. | |||
| $kendo-list-group-item-shadow | Null |
|
|
Description
The base shadow of list group items. | |||
| $kendo-list-no-data-text | Color |
|
|
Description
Text color of the 'No Data' text. | |||
