devextreme-themebuilder
Version:
DevExtreme ThemeBuilder
1,563 lines (1,562 loc) • 168 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.dependencies = exports.browsersList = exports.version = exports.metadata = void 0;
exports.metadata = {
'generic': [
{
'Key': '$accordion-color',
'Name': '50. Text color',
'Type': 'color'
},
{
'Key': '$accordion-title-color',
'Name': '10. Item title text color',
'Type': 'color'
},
{
'Key': '$accordion-item-title-opened-bg',
'Name': '20. Active item title background color',
'Type': 'color'
},
{
'Key': '$accordion-item-border-color',
'Name': '30. Item border color',
'Type': 'color'
},
{
'Key': '$accordion-item-focused-border-color',
'Name': '40. Focused item border color',
'Type': 'color'
},
{
'Key': '$accordion-title-active-color',
'Name': '70. Item title active state text color',
'Type': 'color'
},
{
'Key': '$accordion-item-hover-bg',
'Name': '90. Item title hovered state background color',
'Type': 'color'
},
{
'Key': '$badge-color',
'Name': '140. Badge text color',
'Type': 'color'
},
{
'Key': '$badge-bg',
'Name': '150. Badge background color',
'Type': 'color'
},
{
'Key': '$button-normal-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$button-normal-bg',
'Name': '20. Background color (contained)',
'Type': 'color'
},
{
'Key': '$button-normal-outlined-bg',
'Name': '21. Background color (outlined)',
'Type': 'color'
},
{
'Key': '$button-normal-text-bg',
'Name': '22. Background color (text)',
'Type': 'color'
},
{
'Key': '$button-normal-border-color',
'Name': '30. Border color',
'Type': 'color'
},
{
'Key': '$button-normal-contained-bg-selected',
'Name': '20. Selected contained item background color',
'Type': 'color'
},
{
'Key': '$button-normal-outlined-bg-selected',
'Name': '20. Selected outlined item background color',
'Type': 'color'
},
{
'Key': '$button-normal-text-bg-selected',
'Name': '20. Selected text item background color',
'Type': 'color'
},
{
'Key': '$button-default-color',
'Name': '10. Text color (contained)',
'Type': 'color'
},
{
'Key': '$button-default-bg',
'Name': '20. Background color',
'Type': 'color'
},
{
'Key': '$button-default-border-color',
'Name': '30. Border color',
'Type': 'color'
},
{
'Key': '$button-default-contained-bg-selected',
'Name': '20. Selected contained item background color',
'Type': 'color'
},
{
'Key': '$button-default-outlined-color',
'Name': '11. Text color (outlined)',
'Type': 'color'
},
{
'Key': '$button-default-outlined-bg-selected',
'Name': '20. Selected outlined item background color',
'Type': 'color'
},
{
'Key': '$button-default-text-color',
'Name': '11. Text color (text)',
'Type': 'color'
},
{
'Key': '$button-default-text-bg-selected',
'Name': '20. Selected text item background color',
'Type': 'color'
},
{
'Key': '$button-danger-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$button-danger-bg',
'Name': '20. Background color',
'Type': 'color'
},
{
'Key': '$button-danger-border-color',
'Name': '30. Border color',
'Type': 'color'
},
{
'Key': '$button-danger-contained-bg-selected',
'Name': '20. Selected contained item background color',
'Type': 'color'
},
{
'Key': '$button-danger-outlined-bg-selected',
'Name': '20. Selected outlined item background color',
'Type': 'color'
},
{
'Key': '$button-danger-text-bg-selected',
'Name': '20. Selected text item background color',
'Type': 'color'
},
{
'Key': '$button-success-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$button-success-bg',
'Name': '20. Background color',
'Type': 'color'
},
{
'Key': '$button-success-border-color',
'Name': '30. Border color',
'Type': 'color'
},
{
'Key': '$button-success-contained-bg-selected',
'Name': '20. Selected contained item background color',
'Type': 'color'
},
{
'Key': '$button-success-outlined-bg-selected',
'Name': '20. Selected outlined item background color',
'Type': 'color'
},
{
'Key': '$button-success-text-bg-selected',
'Name': '20. Selected text item background color',
'Type': 'color'
},
{
'Key': '$calendar-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$calendar-header-color',
'Name': '20. Header text color',
'Type': 'color'
},
{
'Key': '$calendar-cell-other-color',
'Name': '30. Other month text color',
'Type': 'color'
},
{
'Key': '$calendar-bg',
'Name': '40. Background color',
'Type': 'color'
},
{
'Key': '$calendar-hover-bg',
'Name': '50. Hovered cell background color',
'Type': 'color'
},
{
'Key': '$calendar-cell-selected-bg',
'Name': '30. Selected cell background color',
'Type': 'color'
},
{
'Key': '$calendar-cell-active-bg',
'Name': '70. Active state background Color',
'Type': 'color'
},
{
'Key': '$cardview-generic-common-bg-color',
'Name': '100. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-common-link-color',
'Name': '102. Link color',
'Type': 'color'
},
{
'Key': '$cardview-generic-common-text-color',
'Name': '103. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card-bg-color',
'Name': '200. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card-border-color',
'Name': '201. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card-divider-color',
'Name': '203. Divider color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card-text-color',
'Name': '204. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__cover-bg-color',
'Name': '206. Cover background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__cover--noimage-bg-color',
'Name': '207. \'Empty cover\' background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__cover--noimage__icon-color',
'Name': '208. \'Empty cover\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected-bg-color',
'Name': '300. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected-border-color',
'Name': '301. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected-divider-color',
'Name': '302. Divider color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected-text-color',
'Name': '303. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected__cover-bg-color',
'Name': '305. Cover background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected__cover--noimage-bg-color',
'Name': '306. \'Empty cover\' background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card--selected__cover--noimage__icon-color',
'Name': '307. \'Empty cover\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item-bg-color',
'Name': '400. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item-border-color',
'Name': '401. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item-text-color',
'Name': '403. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item__icon-color',
'Name': '405. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item__header-filter-icon--selected-color',
'Name': '406. Active \'Filter\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item__sort-index-text-color',
'Name': '407. Sort index text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered-bg-color',
'Name': '500. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered-border-color',
'Name': '501. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered-text-color',
'Name': '502. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered__icon-color',
'Name': '504. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered__header-filter-icon--selected-color',
'Name': '505. Active \'Filter\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--hovered__sort-index-text-color',
'Name': '506. Sort index text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled-bg-color',
'Name': '600. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled-border-color',
'Name': '601. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled-text-color',
'Name': '602. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled__icon-color',
'Name': '604. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled__header-filter-icon--selected-color',
'Name': '605. Active \'Filter\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--disabled__sort-index-text-color',
'Name': '606. Sort index text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged-bg-color',
'Name': '700. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged-border-color',
'Name': '701. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged-text-color',
'Name': '702. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged__allowance-icon-color',
'Name': '704. \'Drag allowed\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged__prohibition-icon-color',
'Name': '705. \'Drag blocked\' icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__item--dragged-box-shadow-color',
'Name': '706. Box shadow color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__dropzone-bg-color',
'Name': '800. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__dropzone-border-color',
'Name': '802. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__dropzone-text-color',
'Name': '803. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-header-panel__dropzone__icon-color',
'Name': '804. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-filter-panel-bg-color',
'Name': '900. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-filter-panel-border-color',
'Name': '902. Border color',
'Type': 'color'
},
{
'Key': '$cardview-generic-filter-panel-text-color',
'Name': '903. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-filter-panel__icon-color',
'Name': '904. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-nodata-view-bg-color',
'Name': '1000. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-nodata-view-text-color',
'Name': '1001. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-nodata-view__icon-color',
'Name': '1002. Icon color',
'Type': 'color'
},
{
'Key': '$cardview-generic-nodata-view__icon-bg-color',
'Name': '1003. Icon background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__content__field-value--highlighted-bg-color',
'Name': '1100. Background color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__content__field-value--highlighted-text-color',
'Name': '1102. Text color',
'Type': 'color'
},
{
'Key': '$cardview-generic-card__content__field-value--highlighted-box-shadow-color',
'Name': '1104. Box shadow color',
'Type': 'color'
},
{
'Key': '$cardview-generic-common-border-radius',
'Name': '101. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-common-text-weight',
'Name': '104. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-common-cards-row-gap',
'Name': '105. Vertical gap between cards',
'Type': 'text'
},
{
'Key': '$cardview-generic-common-cards-column-gap',
'Name': '106. Horizontal gap between cards',
'Type': 'text'
},
{
'Key': '$cardview-generic-card-border-radius',
'Name': '202. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-card__field-caption-weight',
'Name': '205. Field name text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-card--selected__field-caption-weight',
'Name': '304. Field name text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item-border-radius',
'Name': '402. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-header-panel__item-text-weight',
'Name': '404. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item__sort-index-text-weight',
'Name': '408. Sort index text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item--hovered-text-weight',
'Name': '503. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item--hovered__sort-index-text-weight',
'Name': '507. Sort index text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item--disabled-text-weight',
'Name': '603. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item--disabled__sort-index-text-weight',
'Name': '607. Sort index text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__item--dragged-text-weight',
'Name': '703. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$cardview-generic-header-panel__dropzone-border-radius',
'Name': '801. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-filter-panel-border-radius',
'Name': '901. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-card__content__field-value--highlighted-border-radius',
'Name': '1101. Border radius',
'Type': 'text'
},
{
'Key': '$cardview-generic-card__content__field-value--highlighted-text-weight',
'Name': '1103. Text weight',
'Type': 'select',
'TypeValues': '100|200|300|400|500|600|700|800|900'
},
{
'Key': '$chat-background-color',
'Name': '10. Background color',
'Type': 'color'
},
{
'Key': '$chat-border-color',
'Name': '20. Border color',
'Type': 'color'
},
{
'Key': '$chat-avatar-color',
'Name': '30. Text color',
'Type': 'color'
},
{
'Key': '$chat-avatar-background-color',
'Name': '31. Background color',
'Type': 'color'
},
{
'Key': '$chat-bubble-color-primary',
'Name': '40. Text color (sent messages)',
'Type': 'color'
},
{
'Key': '$chat-bubble-background-color-primary',
'Name': '41. Background color (sent messages)',
'Type': 'color'
},
{
'Key': '$chat-bubble-color-secondary',
'Name': '42. Text color (received messages)',
'Type': 'color'
},
{
'Key': '$chat-bubble-background-color-secondary',
'Name': '43. Background color (received messages)',
'Type': 'color'
},
{
'Key': '$chat-information-author-name-color',
'Name': '50. User name color',
'Type': 'color'
},
{
'Key': '$chat-information-timestamp-color',
'Name': '51. Timestamp color',
'Type': 'color'
},
{
'Key': '$chat-messagelist-day-header-color',
'Name': '52. Day header color',
'Type': 'color'
},
{
'Key': '$chat-alertlist-color',
'Name': '55. Alert color',
'Type': 'color'
},
{
'Key': '$chat-messagelist-empty-icon-color',
'Name': '65. Icon color',
'Type': 'color'
},
{
'Key': '$chat-messagelist-empty-icon-background-color',
'Name': '66. Icon background color',
'Type': 'color'
},
{
'Key': '$chat-messagelist-empty-message-color',
'Name': '67. Title color',
'Type': 'color'
},
{
'Key': '$chat-messagelist-empty-prompt-color',
'Name': '68. Subtitle color',
'Type': 'color'
},
{
'Key': '$chat-typingindicator-color',
'Name': '80. Text color',
'Type': 'color'
},
{
'Key': '$chat-typingindicator-circle-bg-color-center',
'Name': '82. Central circle color',
'Type': 'color'
},
{
'Key': '$chat-typingindicator-circle-bg-color',
'Name': '83. Outer circles color',
'Type': 'color'
},
{
'Key': '$chat-typingindicator-bubble-bg-color',
'Name': '81. Background color',
'Type': 'color'
},
{
'Key': '$checkbox-border-color',
'Name': '10. Border color',
'Type': 'color'
},
{
'Key': '$checkbox-border-color-focused',
'Name': '70. Focused state border color',
'Type': 'color'
},
{
'Key': '$checkbox-bg',
'Name': '40. Background color',
'Type': 'color'
},
{
'Key': '$checkbox-hover-border-color',
'Name': '20. Hover state border color',
'Type': 'color'
},
{
'Key': '$checkbox-active-icon-bg',
'Name': '80. Active state background color',
'Type': 'color'
},
{
'Key': '$colorbox-overlay-bg',
'Name': '10. Overlay background',
'Type': 'color'
},
{
'Key': '$drawer-shader-background-color',
'Name': '10. Shader background color',
'Type': 'color'
},
{
'Key': '$dropdowneditor-button-hover-bg',
'Name': '20. Dropdown button hovered state background color',
'Type': 'color'
},
{
'Key': '$dropdowneditor-button-active-bg',
'Name': '30. Dropdown button active state background color',
'Type': 'color'
},
{
'Key': '$dropdowneditor-icon-color',
'Name': '80. Arrow icon color',
'Type': 'color'
},
{
'Key': '$dropdowneditor-icon-active-color',
'Name': '90. Active arrow icon color',
'Type': 'color'
},
{
'Key': '$dropdowneditor-icon-border-radius',
'Name': '100. Dropdown button border radius',
'Type': 'text'
},
{
'Key': '$fieldset-field-label-color',
'Name': '10. Label text color',
'Type': 'color'
},
{
'Key': '$fileuploader-filename-color',
'Name': '10. File name text color',
'Type': 'color'
},
{
'Key': '$fileuploader-falename-status-color',
'Name': '20. File status text color',
'Type': 'color'
},
{
'Key': '$fileuploader-border-color',
'Name': '30. Drag-and-drop border color',
'Type': 'color'
},
{
'Key': '$filterbuilder-text-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$filterbuilder-text-focus-color',
'Name': '20. Focused text color',
'Type': 'color'
},
{
'Key': '$filterbuilder-plus-icon-color',
'Name': '30. Plus icon color',
'Type': 'color'
},
{
'Key': '$filterbuilder-remove-icon-color',
'Name': '40. Remove icon color',
'Type': 'color'
},
{
'Key': '$filterbuilder-group-operation-color',
'Name': '50. Group operation button color',
'Type': 'color'
},
{
'Key': '$filterbuilder-item-field-color',
'Name': '60. Data field button color',
'Type': 'color'
},
{
'Key': '$filterbuilder-item-operator-color',
'Name': '70. Operation button color',
'Type': 'color'
},
{
'Key': '$filterbuilder-item-value-color',
'Name': '80. Value button color',
'Type': 'color'
},
{
'Key': '$filterbuilder-menu-icon-color',
'Name': '10. Menu icon color',
'Type': 'color'
},
{
'Key': '$form-field-item-color',
'Name': '10. Label text color',
'Type': 'color'
},
{
'Key': '$form-group-border-color',
'Name': '10. Group border color',
'Type': 'color'
},
{
'Key': '$gallery-indicator-bg',
'Name': '10. Indicator background color',
'Type': 'color'
},
{
'Key': '$gallery-indicator-item-selected-bg',
'Name': '20. Selected indicator background color',
'Type': 'color'
},
{
'Key': '$gallery-indicator-focused-bg',
'Name': '30. Focused indicator background color',
'Type': 'color'
},
{
'Key': '$gallery-navbutton-hover-color',
'Name': '30. Navigation button color',
'Type': 'color'
},
{
'Key': '$gallery-nav-arrow-color',
'Name': '40. Navigation icon color',
'Type': 'color'
},
{
'Key': '$gallery-navbutton-active-color',
'Name': '50. Active navigation button color',
'Type': 'color'
},
{
'Key': '$datagrid-base-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$datagrid-base-background-color',
'Name': '15. Background color',
'Type': 'color'
},
{
'Key': '$datagrid-border-color',
'Name': '70. Border color',
'Type': 'color'
},
{
'Key': '$datagrid-columnchooser-item-color',
'Name': '20. Header text color',
'Type': 'color'
},
{
'Key': '$datagrid-columnchooser-font-weight',
'Name': '25. Header text weight',
'Type': 'select',
'TypeValues': 'normal|bold|light'
},
{
'Key': '$datagrid-drag-header-border-color',
'Name': '35. Draggable header border color',
'Type': 'color'
},
{
'Key': '$datagrid-selection-bg',
'Name': '51. Selected row background color',
'Type': 'color'
},
{
'Key': '$datagrid-row-selected-border-color',
'Name': '52. Selected row border color',
'Type': 'color'
},
{
'Key': '$datagrid-row-selected-color',
'Name': '50. Selected row text color',
'Type': 'color'
},
{
'Key': '$datagrid-row-focused-color',
'Name': '65. Focused row text color',
'Type': 'color'
},
{
'Key': '$datagrid-row-focused-bg',
'Name': '70. Focused row background color',
'Type': 'color'
},
{
'Key': '$datagrid-hover-bg',
'Name': '90. Hovered row background color',
'Type': 'color'
},
{
'Key': '$datagrid-menu-icon-color',
'Name': '30. Context menu icon color',
'Type': 'color'
},
{
'Key': '$datagrid-cell-modified-border-color',
'Name': '40. Modified data border color',
'Type': 'color'
},
{
'Key': '$datagrid-row-invalid-faded-border-color',
'Name': '45. Invalid data faded color',
'Type': 'color'
},
{
'Key': '$datagrid-nodata-color',
'Name': '30. NoData message text color',
'Type': 'color'
},
{
'Key': '$datagrid-group-row-color',
'Name': '90. Group row text color',
'Type': 'color'
},
{
'Key': '$datagrid-group-row-bg',
'Name': '95. Group row background color',
'Type': 'color'
},
{
'Key': '$datagrid-search-color',
'Name': '105. Highlighted text color',
'Type': 'color'
},
{
'Key': '$datagrid-spin-icon-color',
'Name': '125. Arrow icon color',
'Type': 'color'
},
{
'Key': '$datagrid-search-bg',
'Name': '110. Highlighted text background color',
'Type': 'color'
},
{
'Key': '$datagrid-row-error-color',
'Name': '115. Error row text color',
'Type': 'color'
},
{
'Key': '$datagrid-row-error-bg',
'Name': '120. Error row background color',
'Type': 'color'
},
{
'Key': '$datagrid-link-color',
'Name': '40. Link color',
'Type': 'color'
},
{
'Key': '$datagrid-focused-border-color',
'Name': '75. Focused cell border color',
'Type': 'color'
},
{
'Key': '$datagrid-editor-bg',
'Name': '80. Editor background color',
'Type': 'color'
},
{
'Key': '$datagrid-columnchooser-bg',
'Name': '140. Column chooser background color',
'Type': 'color'
},
{
'Key': '$datagrid-row-alternation-bg',
'Name': '85. Alternate row background color',
'Type': 'color'
},
{
'Key': '$datagrid-summary-color',
'Name': '100. Summary item color',
'Type': 'color'
},
{
'Key': '$list-border-color',
'Name': '20. Item border color',
'Type': 'color'
},
{
'Key': '$list-group-color',
'Name': '20. Group header text color',
'Type': 'color'
},
{
'Key': '$list-group-header-bg',
'Name': '30. Group header background color',
'Type': 'color'
},
{
'Key': '$list-normal-color',
'Name': '10. Item text color',
'Type': 'color'
},
{
'Key': '$list-item-hover-bg',
'Name': '30. Hovered state item background color',
'Type': 'color'
},
{
'Key': '$list-item-selected-bg',
'Name': '40. Selected state item background color',
'Type': 'color'
},
{
'Key': '$list-item-focused-selected-bg',
'Name': '50. Focused selected item state background color',
'Type': 'color'
},
{
'Key': '$list-focused-bg',
'Name': '60. Focused item state background color',
'Type': 'color'
},
{
'Key': '$list-item-active-bg',
'Name': '50. Active state item background color',
'Type': 'color'
},
{
'Key': '$loadindicator-bg',
'Name': '10. Indicator color',
'Type': 'color'
},
{
'Key': '$loadpanel-content-bg',
'Name': '30. Background color',
'Type': 'color'
},
{
'Key': '$menu-popup-bg',
'Name': '40. Popup background color',
'Type': 'color'
},
{
'Key': '$menu-item-hover-bg',
'Name': '50. Hovered item background color',
'Type': 'color'
},
{
'Key': '$menu-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$menu-item-hovered-color',
'Name': '55. Hovered item text color',
'Type': 'color'
},
{
'Key': '$menu-item-expanded-color',
'Name': '10. Expanded item text color',
'Type': 'color'
},
{
'Key': '$menu-item-selected-bg',
'Name': '20. Selected item background color',
'Type': 'color'
},
{
'Key': '$menu-popup-border-color',
'Name': '20. Border color',
'Type': 'color'
},
{
'Key': '$numberbox-spin-active-bg',
'Name': '10. Active spin buttons color',
'Type': 'color'
},
{
'Key': '$numberbox-spin-hover-border-color',
'Name': '20. Hovered spin buttons border color',
'Type': 'color'
},
{
'Key': '$numberbox-spin-icon-color',
'Name': '10. Arrow icon color',
'Type': 'color'
},
{
'Key': '$overlay-content-bg',
'Name': '10. Content background color',
'Type': 'color'
},
{
'Key': '$overlay-shader-bg',
'Name': '20. Shader background color',
'Type': 'color'
},
{
'Key': '$overlay-content-border-radius',
'Name': '30. Border radius',
'Type': 'text'
},
{
'Key': '$pagination-page-selected-color',
'Name': '180. Pager selected item text color',
'Type': 'color'
},
{
'Key': '$pagination-page-selected-bg',
'Name': '190. Pager selected item background color',
'Type': 'color'
},
{
'Key': '$pivotgrid-area-color',
'Name': '10. Header text color',
'Type': 'color'
},
{
'Key': '$pivotgrid-totalcolor',
'Name': '20. Total background color',
'Type': 'color'
},
{
'Key': '$pivotgrid-grandtotalcolor',
'Name': '30. Grand total background color',
'Type': 'color'
},
{
'Key': '$pivotgrid-field-area-text-color',
'Name': '40. Field area text color',
'Type': 'color'
},
{
'Key': '$pivotgrid-spin-icon-color',
'Name': '50. Arrow icon color',
'Type': 'color'
},
{
'Key': '$popup-title-bg',
'Name': '20. Header background color',
'Type': 'color'
},
{
'Key': '$progressbar-bg',
'Name': '10. Bar background color',
'Type': 'color'
},
{
'Key': '$progressbar-range-bg',
'Name': '20. Selected range background color',
'Type': 'color'
},
{
'Key': '$radiogroup-checked-bg',
'Name': '10. Background color',
'Type': 'color'
},
{
'Key': '$radiobutton-active-bg',
'Name': '40. Active state background color',
'Type': 'color'
},
{
'Key': '$scheduler-base-border-color',
'Name': '10 Border color',
'Type': 'color'
},
{
'Key': '$scheduler-accent-border-color',
'Name': '20. Hour separator color',
'Type': 'color'
},
{
'Key': '$scheduler-appointment-text-color',
'Name': '30. Appointment text color',
'Type': 'color'
},
{
'Key': '$scheduler-appointment-base-color',
'Name': '40. Appointment background color',
'Type': 'color'
},
{
'Key': '$scheduler-appointment-start-color',
'Name': '50. Appointment start color',
'Type': 'color'
},
{
'Key': '$scheduler-first-month-border-color',
'Name': '60. First day of month separator color',
'Type': 'color'
},
{
'Key': '$scheduler-workspace-focused-cell-color',
'Name': '70. Focused cell color',
'Type': 'color'
},
{
'Key': '$scheduler-current-time-cell-color',
'Name': '80. Date-time indicator color',
'Type': 'color'
},
{
'Key': '$scheduler-time-indicator-color',
'Name': '80. Date-time indicator color',
'Type': 'color'
},
{
'Key': '$scrollable-scroll-bg',
'Name': '10. Scroll bar background color',
'Type': 'color'
},
{
'Key': '$scrollable-scrollbar-active-bg',
'Name': '20. Scrollbar background color',
'Type': 'color'
},
{
'Key': '$selectbox-list-bg',
'Name': '10. Item background color',
'Type': 'color'
},
{
'Key': '$slider-bar-bg',
'Name': '10. Bar background color',
'Type': 'color'
},
{
'Key': '$slider-range-bg',
'Name': '30. Selected range background color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-color',
'Name': '10. Icon color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-color-hover',
'Name': '20. Hover state icon color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-color-focused',
'Name': '30. Focused state icon color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-bg',
'Name': '40. Handle background color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-bg-hover',
'Name': '50. Handle hover state background color',
'Type': 'color'
},
{
'Key': '$splitter-resize-handle-bg-focused',
'Name': '60. Handle focused state background color',
'Type': 'color'
},
{
'Key': '$stepper-step-accent-bg',
'Name': '10. Active color',
'Type': 'color'
},
{
'Key': '$stepper-step-accent-hover-bg',
'Name': '20. Hover state active color',
'Type': 'color'
},
{
'Key': '$stepper-step-danger-bg',
'Name': '30. Invalid color',
'Type': 'color'
},
{
'Key': '$stepper-step-danger-hover-bg',
'Name': '40. Hover state invalid color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-bg',
'Name': '60. Background color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-hover-bg',
'Name': '70. Hover state background color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-text-color',
'Name': '100. Text or icon color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-label-color',
'Name': '110. Label text color',
'Type': 'color'
},
{
'Key': '$stepper-step-disabled-bg',
'Name': '260. Background color',
'Type': 'color'
},
{
'Key': '$stepper-step-disabled-text-color',
'Name': '270. Text color',
'Type': 'color'
},
{
'Key': '$stepper-connector-bg',
'Name': '280. Pending color',
'Type': 'color'
},
{
'Key': '$stepper-connector-value-bg',
'Name': '290. Completed color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-border-color',
'Name': '80. Border color',
'Type': 'color'
},
{
'Key': '$stepper-step-base-hover-border-color',
'Name': '90. Hover state border color',
'Type': 'color'
},
{
'Key': '$stepper-step-selected-bg',
'Name': '120. Background color',
'Type': 'color'
},
{
'Key': '$stepper-step-selected-hover-bg',
'Name': '130. Hover state background color',
'Type': 'color'
},
{
'Key': '$stepper-step-selected-text-color',
'Name': '140. Text or icon color',
'Type': 'color'
},
{
'Key': '$stepper-step-selected-label-color',
'Name': '150. Label text color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-bg',
'Name': '160. Background color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-hover-bg',
'Name': '170. Hover state background color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-border-color',
'Name': '180. Border color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-hover-border-color',
'Name': '190. Hover state border color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-text-color',
'Name': '200. Text or icon color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-hover-text-color',
'Name': '210. Hover state text or icon color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-label-color',
'Name': '220. Invalid label text color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-selected-bg',
'Name': '230. Background color',
'Type': 'color'
},
{
'Key': '$stepper-step-invalid-selected-hover-bg',
'Name': '240. Hover state background color',
'Type': 'color'
},
{
'Key': '$stepper-step-shadow-color',
'Name': '300. Shadow color',
'Type': 'color'
},
{
'Key': '$switch-border-color',
'Name': '10. Border color',
'Type': 'color'
},
{
'Key': '$switch-on-color',
'Name': '10. "ON" label color',
'Type': 'color'
},
{
'Key': '$switch-container-active-bg',
'Name': '30. Active state background color',
'Type': 'color'
},
{
'Key': '$switch-off-color',
'Name': '20. "OFF" label color',
'Type': 'color'
},
{
'Key': '$tabs-tab-color',
'Name': '10. Tab text color',
'Type': 'color'
},
{
'Key': '$tabs-tab-selected-color',
'Name': '20. Selected tab text color',
'Type': 'color'
},
{
'Key': '$tabs-tab-bg',
'Name': '30. Tab background color',
'Type': 'color'
},
{
'Key': '$tabs-tab-selected-bg',
'Name': '40. Selected tab background color',
'Type': 'color'
},
{
'Key': '$tabs-border-color',
'Name': '30. Border color',
'Type': 'color'
},
{
'Key': '$tabs-focused-border-color',
'Name': '40. Focus border color',
'Type': 'color'
},
{
'Key': '$tabs-tab-hover-bg',
'Name': '50. Hover background color',
'Type': 'color'
},
{
'Key': '$tagbox-tag-color',
'Name': '10. Tag text color',
'Type': 'color'
},
{
'Key': '$tagbox-tag-bg',
'Name': '20. Tag background color',
'Type': 'color'
},
{
'Key': '$tagbox-tag-button-remove-bg',
'Name': '30. Tag close button color',
'Type': 'color'
},
{
'Key': '$textbox-search-icon-color',
'Name': '80. Search icon color',
'Type': 'color'
},
{
'Key': '$texteditor-color',
'Name': '10. Text color',
'Type': 'color'
},
{
'Key': '$texteditor-placeholder-color',
'Name': '20. Placeholder text color',
'Type': 'color'
},
{
'Key': '$texteditor-bg',
'Name': '30. Background color',
'Type': 'color'
},
{
'Key': '$texteditor-filled-bg',
'Name': '40. Filled editor background color',
'Type': 'color'
},
{
'Key': '$texteditor-border-color',
'Name': '50. Border color',
'Type': 'color'
},
{
'Key': '$texteditor-focused-border-color',
'Name': '30. Focused border color',
'Type': 'color'
},
{
'Key': '$texteditor-hover-border-color',
'Name': '60. Hovered border color',
'Type': 'color'
},
{
'Key': '$tileview-color',
'Name': '10. Item text color',
'Type': 'color'
},
{
'Key': '$toast-color',
'Name': '10. Text color',
'Type': 'color'
},