devextreme-themebuilder 22.1.6 → 22.2.1-alpha-22297-1232

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/data/metadata/dx-theme-builder-metadata.js +3 -3
  2. package/data/scss/widgets/base/_box.scss +0 -8
  3. package/data/scss/widgets/base/_calendar.scss +5 -0
  4. package/data/scss/widgets/base/_dropDownMenu.scss +0 -7
  5. package/data/scss/widgets/base/_form.scss +16 -0
  6. package/data/scss/widgets/base/_icons.scss +5 -2
  7. package/data/scss/widgets/base/_toolbar.scss +50 -59
  8. package/data/scss/widgets/base/scheduler/views/_index.scss +1 -2
  9. package/data/scss/widgets/generic/calendar/_index.scss +11 -0
  10. package/data/scss/widgets/generic/calendar/_sizes.scss +3 -0
  11. package/data/scss/widgets/generic/form/_index.scss +9 -0
  12. package/data/scss/widgets/generic/form/_sizes.scss +3 -0
  13. package/data/scss/widgets/generic/toolbar/_index.scss +13 -13
  14. package/data/scss/widgets/material/accordion/_index.scss +1 -1
  15. package/data/scss/widgets/material/button/_index.scss +0 -8
  16. package/data/scss/widgets/material/button/_mixins.scss +0 -4
  17. package/data/scss/widgets/material/calendar/_index.scss +12 -0
  18. package/data/scss/widgets/material/calendar/_sizes.scss +1 -0
  19. package/data/scss/widgets/material/dataGrid/_index.scss +1 -1
  20. package/data/scss/widgets/material/form/_index.scss +9 -0
  21. package/data/scss/widgets/material/form/_sizes.scss +2 -0
  22. package/data/scss/widgets/material/gridBase/_index.scss +0 -12
  23. package/data/scss/widgets/material/toolbar/_index.scss +23 -14
  24. package/data/scss/widgets/material/validation/_index.scss +23 -5
  25. package/package.json +1 -1
package/data/metadata/dx-theme-builder-metadata.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.dependencies = exports.browsersList = exports.version = exports.metadata = void 0;
4
- 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': '$accordion-icon-active-color', 'Name': '30. Item active state icon color', 'Type': 'color' }, { 'Key': '$badge-color', 'Name': '130. Badge text color', 'Type': 'color' }, { 'Key': '$badge-bg', 'Name': '140. Badge background color', 'Type': 'color' }, { 'Key': '$button-normal-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-normal-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-normal-border-color', 'Name': '30. Border color', 'Type': 'color' }, { 'Key': '$button-default-color', 'Name': '10. Text color', '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-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-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-group-normal-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$calendar-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$calendar-header-color', 'Name': '10. 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': '$calendar-border-color', 'Name': '80. Border color', 'Type': 'color' }, { 'Key': '$calendar-navigator-border-color', 'Name': '40. Date navigator border color', 'Type': 'color' }, { 'Key': '$calendar-navigator-hover-border-color', 'Name': '50. Hovered state date navigator border color', 'Type': 'color' }, { 'Key': '$calendar-shevron-icon-color', 'Name': '60. Shevron icon color', 'Type': 'color' }, { 'Key': '$checkbox-border-color', 'Name': '10. Border color', 'Type': 'color' }, { 'Key': '$checkbox-focused-borderd-color', 'Name': '70. Focused state border color', 'Type': 'color' }, { 'Key': '$checkbox-bg', 'Name': '40. Background color', 'Type': 'color' }, { 'Key': '$checkbox-hover-border-color', 'Name': '20. Hovered 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. Spin icon color', 'Type': 'color' }, { 'Key': '$dropdowneditor-icon-active-color', 'Name': '90. Spin active icon color', 'Type': 'color' }, { 'Key': '$fieldset-field-label-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$fileuploader-filename-color', 'Name': '10. Filename text color', 'Type': 'color' }, { 'Key': '$fileuploader-falename-status-color', 'Name': '20. File status text color', 'Type': 'color' }, { 'Key': '$fileuploader-border-color', 'Name': '30. Border color on dragover', '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': '60. 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': '55. Selected row background color', 'Type': 'color' }, { 'Key': '$datagrid-row-selected-border-color', 'Name': '60. 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 icons 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. Invalidate 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. Spin 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', 'Type': 'color' }, { 'Key': '$datagrid-columnchooser-bg', 'Name': '140. Column chooser background color', 'Type': 'color' }, { 'Key': '$datagrid-row-alternation-bg', 'Name': '85. Row alternation 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 item background color', 'Type': 'color' }, { 'Key': '$list-item-selected-bg', 'Name': '40. Selected item state 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. Load indicator color', 'Type': 'color' }, { 'Key': '$loadpanel-content-bg', 'Name': '20. Loadpanel 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': '$navbar-tab-color', 'Name': '10. Tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-color', 'Name': '20. Selected tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-bg', 'Name': '30. Tab background color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-bg', 'Name': '40. Selected tab background 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. Spin 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-focus-border-color', 'Name': '30. Focus border color', 'Type': 'color' }, { 'Key': '$pager-page-selected-color', 'Name': '150. Pager selected item text color', 'Type': 'color' }, { 'Key': '$pager-page-selected-bg', 'Name': '160. Pager selected item background color', 'Type': 'color' }, { 'Key': '$pivotgrid-area-color', 'Name': '10. Header text color', 'Type': 'color' }, { 'Key': '$pivotgrid-totalcolor', 'Name': '20. Totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-grandtotalcolor', 'Name': '30. Grand totals 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. Spin 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. Start appointment 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. Scroller background color', 'Type': 'color' }, { 'Key': '$scrollable-scrollbar-active-bg', 'Name': '20. Scrollbar background color', 'Type': 'color' }, { 'Key': '$slider-bar-bg', 'Name': '10. Slider bar background color', 'Type': 'color' }, { 'Key': '$slider-range-bg', 'Name': '30. Selected range background 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': '$selectbox-list-bg', 'Name': '10. Item background 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' }, { 'Key': '$toast-info-bg', 'Name': '20. Info background color', 'Type': 'color' }, { 'Key': '$toast-warning-bg', 'Name': '30. Warning background color', 'Type': 'color' }, { 'Key': '$toast-error-bg', 'Name': '40. Error background color', 'Type': 'color' }, { 'Key': '$toast-success-bg', 'Name': '50. Success background color', 'Type': 'color' }, { 'Key': '$toolbar-bg', 'Name': '10. Background color', 'Type': 'color' }, { 'Key': '$tooltip-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$tooltip-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$tooltip-border-color', 'Name': '30. Border color', 'Type': 'color' }, { 'Key': '$treeview-focused-bg', 'Name': '10. Focused state background color', 'Type': 'color' }, { 'Key': '$treeview-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$treeview-border-color', 'Name': '100. Border color', 'Type': 'color' }, { 'Key': '$treeview-item-selected-color', 'Name': '110. Selected item text color', 'Type': 'color' }, { 'Key': '$treeview-spin-icon-color', 'Name': '120. Spin icon color', 'Type': 'color' }, { 'Key': '$base-font-family', 'Name': '10. Font family', 'Type': 'text' }, { 'Key': '$base-accent', 'Name': '10. Accent color', 'Type': 'color' }, { 'Key': '$base-label-color', 'Name': '20. Label color', 'Type': 'color' }, { 'Key': '$base-link-color', 'Name': '30. Link color', 'Type': 'color' }, { 'Key': '$base-icon-color', 'Name': '40. Icon color', 'Type': 'color' }, { 'Key': '$base-text-color', 'Name': '20. Text color', 'Type': 'color' }, { 'Key': '$base-bg', 'Name': '30. Background color', 'Type': 'color' }, { 'Key': '$base-border-color', 'Name': '40. Border color', 'Type': 'color' }, { 'Key': '$base-border-radius', 'Name': '120. Border radius', 'Type': 'text' }, { 'Key': '$base-success', 'Name': '50. Success color', 'Type': 'color' }, { 'Key': '$base-warning', 'Name': '60. Warning color', 'Type': 'color' }, { 'Key': '$base-danger', 'Name': '70. Danger color', 'Type': 'color' }, { 'Key': '$base-hover-color', 'Name': '80. Hovered state text color', 'Type': 'color' }, { 'Key': '$base-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$base-focus-color', 'Name': '100. Focused state text color', 'Type': 'color' }, { 'Key': '$base-focus-bg', 'Name': '110. Focused state background color', 'Type': 'color' }, { 'Key': '$base-invalid-color', 'Name': '1. Invalid widget state - active color', 'Type': 'color' }, { 'Key': '$base-invalid-faded-border-color', 'Name': '2. Invalid widget state - border color', 'Type': 'color' }, { 'Key': '$base-border-radius-small', 'Name': '70. Border radius', 'Type': 'text' }, { 'Key': '$base-border-radius-large', 'Name': '30. Border radius', 'Type': 'text' }], 'material': [{ 'Key': '$accordion-title-color', 'Name': '10. Item title text color', 'Type': 'color' }, { 'Key': '$accordion-item-border-color', 'Name': '20. Item border color', 'Type': 'color' }, { 'Key': '$accordion-icon-active-color', 'Name': '30. Item active state icon color', 'Type': 'color' }, { 'Key': '$badge-color', 'Name': '130. Badge text color', 'Type': 'color' }, { 'Key': '$badge-bg', 'Name': '140. Badge background color', 'Type': 'color' }, { 'Key': '$button-normal-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-normal-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-normal-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-normal-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-normal-active-bg', 'Name': '50. Active state background color', 'Type': 'color' }, { 'Key': '$button-default-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-default-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-default-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-default-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-default-active-bg', 'Name': '50. Active state 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-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-danger-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-danger-active-bg', 'Name': '50. Active state 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-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-success-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-success-active-bg', 'Name': '50. Active state background color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-bg', 'Name': '20. Selected item background 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-cell-selected-bg', 'Name': '40. Selected cell background color', 'Type': 'color' }, { 'Key': '$calendar-shevron-icon-color', 'Name': '50. Shevron icon 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-icon-active-color', 'Name': '90. Spin active icon color', 'Type': 'color' }, { 'Key': '$fieldset-field-label-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$fileuploader-filename-color', 'Name': '10. Filename text color', 'Type': 'color' }, { 'Key': '$fileuploader-falename-status-color', 'Name': '20. File status text color', 'Type': 'color' }, { 'Key': '$fileuploader-border-color', 'Name': '30. Border color on dragover', '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': '$form-field-item-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$form-group-border-color', 'Name': '20. 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': '40. Hovered navigation button color', 'Type': 'color' }, { 'Key': '$gallery-navbutton-active-color', 'Name': '50. Active navigation button color', 'Type': 'color' }, { 'Key': '$datagrid-base-background-color', 'Name': '60. Background 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': '300|500|700' }, { 'Key': '$datagrid-drag-header-border-color', 'Name': '35. Draggable header border color', 'Type': 'color' }, { 'Key': '$datagrid-selection-bg', 'Name': '55. Selected row background color', 'Type': 'color' }, { 'Key': '$datagrid-row-selected-border-color', 'Name': '60. 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-menu-icon-color', 'Name': '30. Context menu icons color', 'Type': 'color' }, { 'Key': '$datagrid-cell-modified-border-color', 'Name': '40. Modified data background color', 'Type': 'color' }, { 'Key': '$datagrid-row-invalid-faded-border-color', 'Name': '45. Invalidate data faded 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-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-focused-border-color', 'Name': '75. Focused cell border color', 'Type': 'color' }, { 'Key': '$datagrid-editor-bg', 'Name': '80. Editor background', 'Type': 'color' }, { 'Key': '$datagrid-row-alternation-bg', 'Name': '85. Row alternation background color', 'Type': 'color' }, { 'Key': '$datagrid-summary-color', 'Name': '100. Summary item color', 'Type': 'color' }, { 'Key': '$list-group-color', 'Name': '10. Group header text color', 'Type': 'color' }, { 'Key': '$list-border-color', 'Name': '20. Group border color', 'Type': 'color' }, { 'Key': '$list-group-header-bg', 'Name': '20. Group header background color', 'Type': 'color' }, { 'Key': '$list-normal-color', 'Name': '10. Item text color', 'Type': 'color' }, { 'Key': '$list-expanded-group-color', 'Name': '25. Expanded group header text color', 'Type': 'color' }, { 'Key': '$list-item-hover-bg', 'Name': '30. Hovered item background color', 'Type': 'color' }, { 'Key': '$list-item-selected-bg', 'Name': '30. Selected item state background color', 'Type': 'color' }, { 'Key': '$list-item-active-bg', 'Name': '40. Active state item background color', 'Type': 'color' }, { 'Key': '$load-indicator-segment-bg-color', 'Name': '10. Load indicator color', 'Type': 'color' }, { 'Key': '$loadpanel-content-bg', 'Name': '20. Loadpanel background color', 'Type': 'color' }, { 'Key': '$menu-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$menu-item-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$navbar-tab-color', 'Name': '10. Tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-color', 'Name': '20. Selected tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-bg', 'Name': '30. Tab background color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-bg', 'Name': '40. Selected tab background 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': '$pager-page-selected-color', 'Name': '150. Pager selected item text color', 'Type': 'color' }, { 'Key': '$pager-page-selected-bg', 'Name': '160. Pager selected item background color', 'Type': 'color' }, { 'Key': '$pivotgrid-area-color', 'Name': '10. Header text color', 'Type': 'color' }, { 'Key': '$pivotgrid-totalcolor', 'Name': '20. Totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-grandtotalcolor', 'Name': '30. Grand totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-field-area-text-color', 'Name': '40. Field area text 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': '$progressbar-label-color', 'Name': '30. Label 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. Start appointment color', 'Type': 'color' }, { 'Key': '$scheduler-workspace-focused-cell-color', 'Name': '60. Focused cell color', 'Type': 'color' }, { 'Key': '$scheduler-first-month-border-color', 'Name': '70. First day of month separator color', 'Type': 'color' }, { 'Key': '$scheduler-current-time-cell-color', 'Name': '80. Date-time indicator color', 'Type': 'color' }, { 'Key': '$scrollable-scroll-bg', 'Name': '10. Scroller background color', 'Type': 'color' }, { 'Key': '$selectbox-list-bg', 'Name': '10. Item background color', 'Type': 'color' }, { 'Key': '$material-slider-bar-bg', 'Name': '10. Slider bar background color', 'Type': 'color' }, { 'Key': '$material-slider-bg', 'Name': '20. Selected range background color', 'Type': 'color' }, { 'Key': '$material-slider-tooltip-color', 'Name': '30. Slider tooltip text color', 'Type': 'color' }, { 'Key': '$switch-bg', 'Name': '20. Track "OFF" background color', 'Type': 'color' }, { 'Key': '$switch-handle-off-bg', 'Name': '30. Handle "OFF" background color', 'Type': 'color' }, { 'Key': '$switch-on-bg', 'Name': '40. Track "ON" background color', 'Type': 'color' }, { 'Key': '$switch-handle-on-bg', 'Name': '50. Handle "ON" background 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-selected-tab-bottom-border-color', 'Name': '30. Selected tab bottom border color', 'Type': 'color' }, { 'Key': '$tabs-tab-bg', 'Name': '40. Tab background color', 'Type': 'color' }, { 'Key': '$tabs-hovered-tab-bg-color', 'Name': '50. Hovered tab 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-active-color', 'Name': '30. Tag active text color', 'Type': 'color' }, { 'Key': '$tagbox-tag-button-remove-bg', 'Name': '40. 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-focused-bg', 'Name': '40. Focused background color', 'Type': 'color' }, { 'Key': '$texteditor-border-color', 'Name': '50. Border color', 'Type': 'color' }, { 'Key': '$texteditor-hover-border-color', 'Name': '60. Hovered border color', 'Type': 'color' }, { 'Key': '$texteditor-focused-border-color', 'Name': '70. Focused border color', 'Type': 'color' }, { 'Key': '$texteditor-hover-bg', 'Name': '40. Hovered background color', 'Type': 'color' }, { 'Key': '$tileview-color', 'Name': '10. Item text color', 'Type': 'color' }, { 'Key': '$toast-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$toast-info-bg', 'Name': '20. Info background color', 'Type': 'color' }, { 'Key': '$toast-warning-bg', 'Name': '30. Warning background color', 'Type': 'color' }, { 'Key': '$toast-error-bg', 'Name': '40. Error background color', 'Type': 'color' }, { 'Key': '$toast-success-bg', 'Name': '50. Success background color', 'Type': 'color' }, { 'Key': '$toolbar-bg', 'Name': '10. Background color', 'Type': 'color' }, { 'Key': '$tooltip-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$tooltip-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$treeview-focused-bg', 'Name': '80. Focused state background color', 'Type': 'color' }, { 'Key': '$base-accent', 'Name': '10. Accent color', 'Type': 'color' }, { 'Key': '$base-font-family', 'Name': '10. Font family', 'Type': 'text' }, { 'Key': '$base-text-color', 'Name': '20. Text color', 'Type': 'color' }, { 'Key': '$base-label-color', 'Name': '20. Label color', 'Type': 'color' }, { 'Key': '$base-icon-color', 'Name': '40. Icon color', 'Type': 'color' }, { 'Key': '$base-spin-icon-color', 'Name': '50. Spin icon color', 'Type': 'color' }, { 'Key': '$base-bg', 'Name': '30. Background color', 'Type': 'color' }, { 'Key': '$base-border-color', 'Name': '40. Border color', 'Type': 'color' }, { 'Key': '$base-success', 'Name': '50. Success color', 'Type': 'color' }, { 'Key': '$base-warning', 'Name': '60. Warning color', 'Type': 'color' }, { 'Key': '$base-danger', 'Name': '70. Danger color', 'Type': 'color' }, { 'Key': '$base-hover-color', 'Name': '80. Hovered state text color', 'Type': 'color' }, { 'Key': '$base-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$base-focus-color', 'Name': '100. Focused state text color', 'Type': 'color' }, { 'Key': '$base-focus-bg', 'Name': '110. Focused state background color', 'Type': 'color' }, { 'Key': '$base-link-color', 'Name': '30. Link color', 'Type': 'color' }, { 'Key': '$base-border-radius', 'Name': '120. Border radius', 'Type': 'text' }] };
5
- exports.version = '22.1.6';
4
+ 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': '$accordion-icon-active-color', 'Name': '30. Item active state icon color', 'Type': 'color' }, { 'Key': '$badge-color', 'Name': '130. Badge text color', 'Type': 'color' }, { 'Key': '$badge-bg', 'Name': '140. Badge background color', 'Type': 'color' }, { 'Key': '$button-normal-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-normal-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-normal-border-color', 'Name': '30. Border color', 'Type': 'color' }, { 'Key': '$button-default-color', 'Name': '10. Text color', '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-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-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-group-normal-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$calendar-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$calendar-header-color', 'Name': '10. 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': '$calendar-border-color', 'Name': '80. Border color', 'Type': 'color' }, { 'Key': '$calendar-navigator-border-color', 'Name': '40. Date navigator border color', 'Type': 'color' }, { 'Key': '$calendar-navigator-hover-border-color', 'Name': '50. Hovered state date navigator border color', 'Type': 'color' }, { 'Key': '$calendar-shevron-icon-color', 'Name': '60. Shevron icon color', 'Type': 'color' }, { 'Key': '$checkbox-border-color', 'Name': '10. Border color', 'Type': 'color' }, { 'Key': '$checkbox-focused-borderd-color', 'Name': '70. Focused state border color', 'Type': 'color' }, { 'Key': '$checkbox-bg', 'Name': '40. Background color', 'Type': 'color' }, { 'Key': '$checkbox-hover-border-color', 'Name': '20. Hovered 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. Spin icon color', 'Type': 'color' }, { 'Key': '$dropdowneditor-icon-active-color', 'Name': '90. Spin active icon color', 'Type': 'color' }, { 'Key': '$fieldset-field-label-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$fileuploader-filename-color', 'Name': '10. Filename text color', 'Type': 'color' }, { 'Key': '$fileuploader-falename-status-color', 'Name': '20. File status text color', 'Type': 'color' }, { 'Key': '$fileuploader-border-color', 'Name': '30. Border color on dragover', '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': '60. 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': '55. Selected row background color', 'Type': 'color' }, { 'Key': '$datagrid-row-selected-border-color', 'Name': '60. 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 icons 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. Invalidate 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. Spin 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', 'Type': 'color' }, { 'Key': '$datagrid-columnchooser-bg', 'Name': '140. Column chooser background color', 'Type': 'color' }, { 'Key': '$datagrid-row-alternation-bg', 'Name': '85. Row alternation 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 item background color', 'Type': 'color' }, { 'Key': '$list-item-selected-bg', 'Name': '40. Selected item state 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. Load indicator 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': '$navbar-tab-color', 'Name': '10. Tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-color', 'Name': '20. Selected tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-bg', 'Name': '30. Tab background color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-bg', 'Name': '40. Selected tab background 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. Spin 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-focus-border-color', 'Name': '30. Focus border color', 'Type': 'color' }, { 'Key': '$pager-page-selected-color', 'Name': '150. Pager selected item text color', 'Type': 'color' }, { 'Key': '$pager-page-selected-bg', 'Name': '160. Pager selected item background color', 'Type': 'color' }, { 'Key': '$pivotgrid-area-color', 'Name': '10. Header text color', 'Type': 'color' }, { 'Key': '$pivotgrid-totalcolor', 'Name': '20. Totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-grandtotalcolor', 'Name': '30. Grand totals 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. Spin 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. Start appointment 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. Scroller 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. Slider bar background color', 'Type': 'color' }, { 'Key': '$slider-range-bg', 'Name': '30. Selected range background 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' }, { 'Key': '$toast-info-bg', 'Name': '20. Info background color', 'Type': 'color' }, { 'Key': '$toast-warning-bg', 'Name': '30. Warning background color', 'Type': 'color' }, { 'Key': '$toast-error-bg', 'Name': '40. Error background color', 'Type': 'color' }, { 'Key': '$toast-success-bg', 'Name': '50. Success background color', 'Type': 'color' }, { 'Key': '$toolbar-bg', 'Name': '10. Background color', 'Type': 'color' }, { 'Key': '$tooltip-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$tooltip-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$tooltip-border-color', 'Name': '30. Border color', 'Type': 'color' }, { 'Key': '$treeview-focused-bg', 'Name': '10. Focused state background color', 'Type': 'color' }, { 'Key': '$treeview-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$treeview-border-color', 'Name': '100. Border color', 'Type': 'color' }, { 'Key': '$treeview-item-selected-color', 'Name': '110. Selected item text color', 'Type': 'color' }, { 'Key': '$treeview-spin-icon-color', 'Name': '120. Spin icon 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': '$base-font-family', 'Name': '10. Font family', 'Type': 'text' }, { 'Key': '$base-accent', 'Name': '10. Accent color', 'Type': 'color' }, { 'Key': '$base-label-color', 'Name': '20. Label color', 'Type': 'color' }, { 'Key': '$base-link-color', 'Name': '30. Link color', 'Type': 'color' }, { 'Key': '$base-icon-color', 'Name': '40. Icon color', 'Type': 'color' }, { 'Key': '$base-text-color', 'Name': '20. Text color', 'Type': 'color' }, { 'Key': '$base-bg', 'Name': '30. Background color', 'Type': 'color' }, { 'Key': '$base-border-color', 'Name': '40. Border color', 'Type': 'color' }, { 'Key': '$base-border-radius', 'Name': '120. Border radius', 'Type': 'text' }, { 'Key': '$base-success', 'Name': '50. Success color', 'Type': 'color' }, { 'Key': '$base-warning', 'Name': '60. Warning color', 'Type': 'color' }, { 'Key': '$base-danger', 'Name': '70. Danger color', 'Type': 'color' }, { 'Key': '$base-hover-color', 'Name': '80. Hovered state text color', 'Type': 'color' }, { 'Key': '$base-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$base-focus-color', 'Name': '100. Focused state text color', 'Type': 'color' }, { 'Key': '$base-focus-bg', 'Name': '110. Focused state background color', 'Type': 'color' }, { 'Key': '$base-invalid-color', 'Name': '1. Invalid widget state - active color', 'Type': 'color' }, { 'Key': '$base-invalid-faded-border-color', 'Name': '2. Invalid widget state - border color', 'Type': 'color' }, { 'Key': '$base-border-radius-small', 'Name': '70. Border radius', 'Type': 'text' }, { 'Key': '$base-border-radius-large', 'Name': '30. Border radius', 'Type': 'text' }, { 'Key': '$loadpanel-content-bg', 'Name': '20. Loadpanel background color', 'Type': 'color' }], 'material': [{ 'Key': '$accordion-title-color', 'Name': '10. Item title text color', 'Type': 'color' }, { 'Key': '$accordion-item-border-color', 'Name': '20. Item border color', 'Type': 'color' }, { 'Key': '$accordion-icon-active-color', 'Name': '30. Item active state icon color', 'Type': 'color' }, { 'Key': '$badge-color', 'Name': '130. Badge text color', 'Type': 'color' }, { 'Key': '$badge-bg', 'Name': '140. Badge background color', 'Type': 'color' }, { 'Key': '$button-normal-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-normal-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-normal-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-normal-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-normal-active-bg', 'Name': '50. Active state background color', 'Type': 'color' }, { 'Key': '$button-default-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$button-default-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$button-default-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-default-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-default-active-bg', 'Name': '50. Active state 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-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-danger-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-danger-active-bg', 'Name': '50. Active state 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-hover-bg', 'Name': '30. Hovered state background color', 'Type': 'color' }, { 'Key': '$button-success-focused-bg', 'Name': '40. Focused state background color', 'Type': 'color' }, { 'Key': '$button-success-active-bg', 'Name': '50. Active state background color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-normal-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-default-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-danger-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-color', 'Name': '10. Selected item text color', 'Type': 'color' }, { 'Key': '$button-group-success-selected-bg', 'Name': '20. Selected item background 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-cell-selected-bg', 'Name': '40. Selected cell background color', 'Type': 'color' }, { 'Key': '$calendar-shevron-icon-color', 'Name': '50. Shevron icon 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-icon-active-color', 'Name': '90. Spin active icon color', 'Type': 'color' }, { 'Key': '$fieldset-field-label-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$fileuploader-filename-color', 'Name': '10. Filename text color', 'Type': 'color' }, { 'Key': '$fileuploader-falename-status-color', 'Name': '20. File status text color', 'Type': 'color' }, { 'Key': '$fileuploader-border-color', 'Name': '30. Border color on dragover', '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': '$form-field-item-color', 'Name': '10. Label text color', 'Type': 'color' }, { 'Key': '$form-group-border-color', 'Name': '20. 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': '40. Hovered navigation button color', 'Type': 'color' }, { 'Key': '$gallery-navbutton-active-color', 'Name': '50. Active navigation button color', 'Type': 'color' }, { 'Key': '$datagrid-base-background-color', 'Name': '60. Background 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': '300|500|700' }, { 'Key': '$datagrid-drag-header-border-color', 'Name': '35. Draggable header border color', 'Type': 'color' }, { 'Key': '$datagrid-selection-bg', 'Name': '55. Selected row background color', 'Type': 'color' }, { 'Key': '$datagrid-row-selected-border-color', 'Name': '60. 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-menu-icon-color', 'Name': '30. Context menu icons color', 'Type': 'color' }, { 'Key': '$datagrid-cell-modified-border-color', 'Name': '40. Modified data background color', 'Type': 'color' }, { 'Key': '$datagrid-row-invalid-faded-border-color', 'Name': '45. Invalidate data faded 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-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-focused-border-color', 'Name': '75. Focused cell border color', 'Type': 'color' }, { 'Key': '$datagrid-editor-bg', 'Name': '80. Editor background', 'Type': 'color' }, { 'Key': '$datagrid-row-alternation-bg', 'Name': '85. Row alternation background color', 'Type': 'color' }, { 'Key': '$datagrid-summary-color', 'Name': '100. Summary item color', 'Type': 'color' }, { 'Key': '$list-group-color', 'Name': '10. Group header text color', 'Type': 'color' }, { 'Key': '$list-border-color', 'Name': '20. Group border color', 'Type': 'color' }, { 'Key': '$list-group-header-bg', 'Name': '20. Group header background color', 'Type': 'color' }, { 'Key': '$list-normal-color', 'Name': '10. Item text color', 'Type': 'color' }, { 'Key': '$list-expanded-group-color', 'Name': '25. Expanded group header text color', 'Type': 'color' }, { 'Key': '$list-item-hover-bg', 'Name': '30. Hovered item background color', 'Type': 'color' }, { 'Key': '$list-item-selected-bg', 'Name': '30. Selected item state background color', 'Type': 'color' }, { 'Key': '$list-item-active-bg', 'Name': '40. Active state item background color', 'Type': 'color' }, { 'Key': '$load-indicator-segment-bg-color', 'Name': '10. Load indicator color', 'Type': 'color' }, { 'Key': '$loadpanel-content-bg', 'Name': '20. Loadpanel background color', 'Type': 'color' }, { 'Key': '$menu-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$menu-item-selected-bg', 'Name': '20. Selected item background color', 'Type': 'color' }, { 'Key': '$navbar-tab-color', 'Name': '10. Tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-color', 'Name': '20. Selected tab text color', 'Type': 'color' }, { 'Key': '$navbar-tab-bg', 'Name': '30. Tab background color', 'Type': 'color' }, { 'Key': '$navbar-tab-selected-bg', 'Name': '40. Selected tab background 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': '$pager-page-selected-color', 'Name': '150. Pager selected item text color', 'Type': 'color' }, { 'Key': '$pager-page-selected-bg', 'Name': '160. Pager selected item background color', 'Type': 'color' }, { 'Key': '$pivotgrid-area-color', 'Name': '10. Header text color', 'Type': 'color' }, { 'Key': '$pivotgrid-totalcolor', 'Name': '20. Totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-grandtotalcolor', 'Name': '30. Grand totals background color', 'Type': 'color' }, { 'Key': '$pivotgrid-field-area-text-color', 'Name': '40. Field area text 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': '$progressbar-label-color', 'Name': '30. Label 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. Start appointment color', 'Type': 'color' }, { 'Key': '$scheduler-workspace-focused-cell-color', 'Name': '60. Focused cell color', 'Type': 'color' }, { 'Key': '$scheduler-first-month-border-color', 'Name': '70. First day of month separator color', 'Type': 'color' }, { 'Key': '$scheduler-current-time-cell-color', 'Name': '80. Date-time indicator color', 'Type': 'color' }, { 'Key': '$scrollable-scroll-bg', 'Name': '10. Scroller background color', 'Type': 'color' }, { 'Key': '$selectbox-list-bg', 'Name': '10. Item background color', 'Type': 'color' }, { 'Key': '$material-slider-bar-bg', 'Name': '10. Slider bar background color', 'Type': 'color' }, { 'Key': '$material-slider-bg', 'Name': '20. Selected range background color', 'Type': 'color' }, { 'Key': '$material-slider-tooltip-color', 'Name': '30. Slider tooltip text color', 'Type': 'color' }, { 'Key': '$switch-bg', 'Name': '20. Track "OFF" background color', 'Type': 'color' }, { 'Key': '$switch-handle-off-bg', 'Name': '30. Handle "OFF" background color', 'Type': 'color' }, { 'Key': '$switch-on-bg', 'Name': '40. Track "ON" background color', 'Type': 'color' }, { 'Key': '$switch-handle-on-bg', 'Name': '50. Handle "ON" background 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-selected-tab-bottom-border-color', 'Name': '30. Selected tab bottom border color', 'Type': 'color' }, { 'Key': '$tabs-tab-bg', 'Name': '40. Tab background color', 'Type': 'color' }, { 'Key': '$tabs-hovered-tab-bg-color', 'Name': '50. Hovered tab 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-active-color', 'Name': '30. Tag active text color', 'Type': 'color' }, { 'Key': '$tagbox-tag-button-remove-bg', 'Name': '40. 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-focused-bg', 'Name': '40. Focused background color', 'Type': 'color' }, { 'Key': '$texteditor-border-color', 'Name': '50. Border color', 'Type': 'color' }, { 'Key': '$texteditor-hover-border-color', 'Name': '60. Hovered border color', 'Type': 'color' }, { 'Key': '$texteditor-focused-border-color', 'Name': '70. Focused border color', 'Type': 'color' }, { 'Key': '$texteditor-hover-bg', 'Name': '40. Hovered background color', 'Type': 'color' }, { 'Key': '$tileview-color', 'Name': '10. Item text color', 'Type': 'color' }, { 'Key': '$toast-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$toast-info-bg', 'Name': '20. Info background color', 'Type': 'color' }, { 'Key': '$toast-warning-bg', 'Name': '30. Warning background color', 'Type': 'color' }, { 'Key': '$toast-error-bg', 'Name': '40. Error background color', 'Type': 'color' }, { 'Key': '$toast-success-bg', 'Name': '50. Success background color', 'Type': 'color' }, { 'Key': '$toolbar-bg', 'Name': '10. Background color', 'Type': 'color' }, { 'Key': '$tooltip-color', 'Name': '10. Text color', 'Type': 'color' }, { 'Key': '$tooltip-bg', 'Name': '20. Background color', 'Type': 'color' }, { 'Key': '$treeview-focused-bg', 'Name': '80. Focused state background color', 'Type': 'color' }, { 'Key': '$base-accent', 'Name': '10. Accent color', 'Type': 'color' }, { 'Key': '$base-font-family', 'Name': '10. Font family', 'Type': 'text' }, { 'Key': '$base-text-color', 'Name': '20. Text color', 'Type': 'color' }, { 'Key': '$base-label-color', 'Name': '20. Label color', 'Type': 'color' }, { 'Key': '$base-icon-color', 'Name': '40. Icon color', 'Type': 'color' }, { 'Key': '$base-spin-icon-color', 'Name': '50. Spin icon color', 'Type': 'color' }, { 'Key': '$base-bg', 'Name': '30. Background color', 'Type': 'color' }, { 'Key': '$base-border-color', 'Name': '40. Border color', 'Type': 'color' }, { 'Key': '$base-success', 'Name': '50. Success color', 'Type': 'color' }, { 'Key': '$base-warning', 'Name': '60. Warning color', 'Type': 'color' }, { 'Key': '$base-danger', 'Name': '70. Danger color', 'Type': 'color' }, { 'Key': '$base-hover-color', 'Name': '80. Hovered state text color', 'Type': 'color' }, { 'Key': '$base-hover-bg', 'Name': '90. Hovered state background color', 'Type': 'color' }, { 'Key': '$base-focus-color', 'Name': '100. Focused state text color', 'Type': 'color' }, { 'Key': '$base-focus-bg', 'Name': '110. Focused state background color', 'Type': 'color' }, { 'Key': '$base-link-color', 'Name': '30. Link color', 'Type': 'color' }, { 'Key': '$base-border-radius', 'Name': '120. Border radius', 'Type': 'text' }] };
5
+ exports.version = '22.2.1-alpha-22297-1232';
6
6
  exports.browsersList = ['last 2 versions', 'ios > 9', '> 1%'];
7
- exports.dependencies = { 'loadindicator': [], 'loadpanel': ['loadindicator'], 'validation': [], 'button': ['validation'], 'popup': ['validation', 'button'], 'toast': [], 'popover': ['validation', 'button', 'popup'], 'actionsheet': ['validation', 'button', 'popup', 'popover'], 'textbox': ['validation', 'button', 'loadindicator'], 'scrollview': ['loadindicator', 'loadpanel'], 'list': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview'], 'autocomplete': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list'], 'box': [], 'buttongroup': ['validation', 'button'], 'dropdownbutton': ['validation', 'button', 'buttongroup', 'popup', 'loadindicator', 'loadpanel', 'scrollview', 'list'], 'calendar': ['validation', 'button'], 'checkbox': ['validation'], 'numberbox': ['validation', 'button', 'loadindicator'], 'colorbox': ['validation', 'button', 'loadindicator', 'numberbox', 'textbox', 'popup'], 'selectbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'checkbox'], 'datebox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'calendar', 'numberbox', 'loadpanel', 'scrollview', 'list', 'checkbox', 'selectbox', 'box'], 'drawer': [], 'deferrendering': ['loadindicator'], 'dropdownbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup'], 'progressbar': ['validation'], 'fileuploader': ['validation', 'button', 'progressbar'], 'multiview': [], 'tabs': ['validation', 'button'], 'tabpanel': ['multiview', 'validation', 'button', 'tabs'], 'responsivebox': ['box'], 'form': ['validation', 'multiview', 'button', 'tabs', 'tabpanel', 'box', 'responsivebox', 'loadindicator', 'textbox', 'numberbox', 'checkbox', 'popup', 'calendar', 'loadpanel', 'scrollview', 'list', 'selectbox', 'datebox'], 'gallery': [], 'toolbar': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'popup', 'popover', 'list'], 'contextmenu': ['validation', 'button', 'loadindicator', 'textbox'], 'htmleditor': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'popup', 'popover', 'list', 'toolbar', 'textbox', 'checkbox', 'selectbox', 'numberbox', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'calendar', 'datebox', 'form', 'buttongroup', 'colorbox', 'progressbar', 'fileuploader', 'contextmenu'], 'sortable': [], 'lookup': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'popover'], 'map': [], 'navbar': ['validation', 'button', 'tabs'], 'radiogroup': ['validation'], 'tooltip': ['validation', 'button', 'popup', 'popover'], 'slider': ['validation', 'button', 'popup', 'popover', 'tooltip'], 'rangeslider': ['validation', 'button', 'popup', 'popover', 'tooltip', 'slider'], 'speeddialaction': [], 'switch': ['validation'], 'tagbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'checkbox', 'selectbox'], 'textarea': ['validation', 'button', 'loadindicator', 'textbox'], 'tileview': ['loadindicator', 'loadpanel', 'scrollview'], 'slideoutview': [], 'slideout': ['slideoutview', 'validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'list'], 'accordion': [], 'treeview': ['validation', 'button', 'loadindicator', 'textbox', 'checkbox'], 'menu': ['validation', 'button', 'loadindicator', 'textbox', 'contextmenu', 'checkbox', 'treeview'], 'filterbuilder': ['validation', 'button', 'loadindicator', 'textbox', 'checkbox', 'treeview', 'popup', 'numberbox', 'loadpanel', 'scrollview', 'list', 'selectbox', 'calendar', 'box', 'datebox'], 'datagrid': ['loadindicator', 'loadpanel', 'validation', 'button', 'textbox', 'contextmenu', 'scrollview', 'popup', 'popover', 'list', 'toolbar', 'checkbox', 'treeview', 'numberbox', 'selectbox', 'calendar', 'box', 'datebox', 'multiview', 'tabs', 'tabpanel', 'responsivebox', 'form', 'menu', 'filterbuilder', 'buttongroup', 'dropdownbutton', 'sortable'], 'treelist': ['loadindicator', 'loadpanel', 'validation', 'button', 'textbox', 'contextmenu', 'scrollview', 'popup', 'popover', 'list', 'toolbar'], 'pivotgrid': ['loadindicator', 'loadpanel', 'validation', 'button', 'popup', 'textbox', 'checkbox', 'treeview', 'scrollview', 'list', 'contextmenu'], 'scheduler': ['validation', 'button', 'popup', 'loadindicator', 'loadpanel', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'textbox', 'numberbox', 'checkbox', 'calendar', 'scrollview', 'list', 'selectbox', 'datebox', 'form', 'buttongroup', 'radiogroup', 'textarea', 'tagbox', 'switch', 'popover', 'tooltip', 'toolbar', 'dropdownbutton'], 'filemanager': ['toast', 'validation', 'button', 'loadindicator', 'textbox', 'contextmenu', 'checkbox', 'treeview', 'loadpanel', 'scrollview', 'popup', 'popover', 'list', 'toolbar', 'numberbox', 'selectbox', 'calendar', 'box', 'datebox', 'multiview', 'tabs', 'tabpanel', 'responsivebox', 'form', 'menu', 'filterbuilder', 'buttongroup', 'dropdownbutton', 'sortable', 'datagrid', 'drawer', 'progressbar', 'fileuploader'], 'diagram': ['loadindicator', 'validation', 'button', 'loadpanel', 'scrollview', 'popup', 'popover', 'list', 'toolbar', 'textbox', 'contextmenu', 'checkbox', 'selectbox', 'numberbox', 'colorbox', 'accordion', 'tooltip', 'multiview', 'tabs', 'tabpanel', 'progressbar', 'fileuploader'], 'gantt': ['loadindicator', 'loadpanel', 'validation', 'button', 'popup', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'textbox', 'numberbox', 'checkbox', 'calendar', 'scrollview', 'list', 'selectbox', 'datebox', 'form', 'tagbox', 'radiogroup', 'popover', 'actionsheet', 'toolbar', 'contextmenu', 'treelist', 'treeview', 'menu', 'filterbuilder', 'sortable'] };
7
+ exports.dependencies = { 'loadindicator': [], 'loadpanel': ['loadindicator'], 'validation': [], 'scrollview': ['loadindicator', 'loadpanel'], 'button': ['validation'], 'popup': ['validation', 'button'], 'toast': [], 'popover': ['validation', 'button', 'popup'], 'actionsheet': ['validation', 'button', 'popup', 'popover'], 'textbox': ['validation', 'button', 'loadindicator'], 'list': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview'], 'autocomplete': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list'], 'box': [], 'buttongroup': ['validation', 'button'], 'dropdownbutton': ['validation', 'button', 'buttongroup', 'popup', 'loadindicator', 'loadpanel', 'scrollview', 'list'], 'calendar': ['validation', 'button'], 'checkbox': ['validation'], 'numberbox': ['validation', 'button', 'loadindicator'], 'colorbox': ['validation', 'button', 'loadindicator', 'numberbox', 'textbox', 'popup'], 'selectbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'checkbox'], 'datebox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'calendar', 'numberbox', 'loadpanel', 'scrollview', 'list', 'checkbox', 'selectbox', 'box'], 'drawer': [], 'deferrendering': ['loadindicator'], 'dropdownbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup'], 'progressbar': ['validation'], 'fileuploader': ['validation', 'button', 'progressbar'], 'multiview': [], 'tabs': ['validation', 'button'], 'tabpanel': ['multiview', 'validation', 'button', 'tabs'], 'responsivebox': ['box'], 'form': ['validation', 'multiview', 'button', 'tabs', 'tabpanel', 'box', 'responsivebox', 'loadindicator', 'textbox', 'numberbox', 'checkbox', 'popup', 'calendar', 'loadpanel', 'scrollview', 'list', 'selectbox', 'datebox'], 'gallery': [], 'toolbar': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'popup'], 'contextmenu': ['validation', 'button', 'loadindicator', 'textbox'], 'htmleditor': ['validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'popup', 'toolbar', 'textbox', 'list', 'checkbox', 'selectbox', 'numberbox', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'calendar', 'datebox', 'form', 'buttongroup', 'colorbox', 'progressbar', 'fileuploader', 'contextmenu'], 'sortable': [], 'lookup': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'popover'], 'map': [], 'navbar': ['validation', 'button', 'tabs'], 'radiogroup': ['validation'], 'tooltip': ['validation', 'button', 'popup', 'popover'], 'slider': ['validation', 'button', 'popup', 'popover', 'tooltip'], 'rangeslider': ['validation', 'button', 'popup', 'popover', 'tooltip', 'slider'], 'speeddialaction': [], 'switch': ['validation'], 'tagbox': ['validation', 'button', 'loadindicator', 'textbox', 'popup', 'loadpanel', 'scrollview', 'list', 'checkbox', 'selectbox'], 'textarea': ['validation', 'button', 'loadindicator', 'textbox'], 'tileview': ['loadindicator', 'loadpanel', 'scrollview'], 'slideoutview': [], 'slideout': ['slideoutview', 'validation', 'button', 'loadindicator', 'loadpanel', 'scrollview', 'list'], 'accordion': [], 'treeview': ['validation', 'button', 'loadindicator', 'textbox', 'checkbox'], 'menu': ['validation', 'button', 'loadindicator', 'textbox', 'contextmenu', 'checkbox', 'treeview'], 'filterbuilder': ['validation', 'button', 'loadindicator', 'textbox', 'checkbox', 'treeview', 'popup', 'numberbox', 'loadpanel', 'scrollview', 'list', 'selectbox', 'calendar', 'box', 'datebox'], 'datagrid': ['loadindicator', 'loadpanel', 'validation', 'button', 'textbox', 'contextmenu', 'scrollview', 'popup', 'toolbar', 'checkbox', 'treeview', 'numberbox', 'list', 'selectbox', 'calendar', 'box', 'datebox', 'multiview', 'tabs', 'tabpanel', 'responsivebox', 'form', 'menu', 'filterbuilder', 'buttongroup', 'dropdownbutton', 'sortable'], 'treelist': ['loadindicator', 'loadpanel', 'validation', 'button', 'textbox', 'contextmenu', 'scrollview', 'popup', 'toolbar'], 'pivotgrid': ['loadindicator', 'loadpanel', 'validation', 'button', 'popup', 'textbox', 'checkbox', 'treeview', 'scrollview', 'list', 'contextmenu'], 'scheduler': ['validation', 'button', 'popup', 'loadindicator', 'loadpanel', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'textbox', 'numberbox', 'checkbox', 'calendar', 'scrollview', 'list', 'selectbox', 'datebox', 'form', 'buttongroup', 'radiogroup', 'textarea', 'tagbox', 'switch', 'popover', 'tooltip', 'toolbar', 'dropdownbutton'], 'filemanager': ['toast', 'validation', 'button', 'loadindicator', 'textbox', 'contextmenu', 'checkbox', 'treeview', 'loadpanel', 'scrollview', 'popup', 'toolbar', 'numberbox', 'list', 'selectbox', 'calendar', 'box', 'datebox', 'multiview', 'tabs', 'tabpanel', 'responsivebox', 'form', 'menu', 'filterbuilder', 'buttongroup', 'dropdownbutton', 'sortable', 'datagrid', 'drawer', 'progressbar', 'fileuploader'], 'diagram': ['loadindicator', 'validation', 'button', 'loadpanel', 'scrollview', 'popup', 'toolbar', 'textbox', 'contextmenu', 'list', 'checkbox', 'selectbox', 'numberbox', 'colorbox', 'popover', 'accordion', 'tooltip', 'multiview', 'tabs', 'tabpanel', 'progressbar', 'fileuploader'], 'gantt': ['loadindicator', 'loadpanel', 'validation', 'button', 'popup', 'multiview', 'tabs', 'tabpanel', 'box', 'responsivebox', 'textbox', 'numberbox', 'checkbox', 'calendar', 'scrollview', 'list', 'selectbox', 'datebox', 'form', 'tagbox', 'radiogroup', 'popover', 'actionsheet', 'toolbar', 'contextmenu', 'treelist', 'treeview', 'menu', 'filterbuilder', 'sortable'] };
package/data/scss/widgets/base/_box.scss CHANGED
@@ -2,14 +2,6 @@
2
2
 
3
3
  .dx-box-item-content {
4
4
  font-size: 14px;
5
- }
6
-
7
- .dx-box-fallback-item > .dx-box-item-content {
8
- width: 100%;
9
- height: 100%;
10
- }
11
-
12
- .dx-box-item-content { // stylelint-disable-line no-duplicate-selectors
13
5
  flex-direction: column;
14
6
  max-width: 100%;
15
7
  }
package/data/scss/widgets/base/_calendar.scss CHANGED
@@ -61,6 +61,11 @@
61
61
  position: absolute;
62
62
  direction: ltr;
63
63
  table-layout: fixed;
64
+
65
+ .dx-calendar-week-number-cell {
66
+ text-align: center;
67
+ cursor: default;
68
+ }
64
69
  }
65
70
 
66
71
  td {
package/data/scss/widgets/base/_dropDownMenu.scss CHANGED
@@ -30,10 +30,3 @@
30
30
  border-top: 0;
31
31
  }
32
32
  }
33
-
34
- .dx-overlay-wrapper.dx-dropdownmenu-popup .dx-overlay-content {
35
- .dx-popover-arrow {
36
- width: 0;
37
- height: 0;
38
- }
39
- }
package/data/scss/widgets/base/_form.scss CHANGED
@@ -79,6 +79,14 @@
79
79
  .dx-field-item-label-content {
80
80
  display: block;
81
81
  }
82
+
83
+ .dx-field-item-custom-label-content {
84
+ display: inline-block;
85
+
86
+ .dx-icon {
87
+ vertical-align: top;
88
+ }
89
+ }
82
90
  }
83
91
 
84
92
  .dx-field-item-content {
@@ -107,6 +115,14 @@
107
115
 
108
116
  .dx-field-item-label-location-top {
109
117
  display: block;
118
+
119
+ .dx-field-item-custom-label-content {
120
+ display: inline-block;
121
+
122
+ .dx-icon {
123
+ vertical-align: top;
124
+ }
125
+ }
110
126
  }
111
127
 
112
128
  .dx-form-group-content {
package/data/scss/widgets/base/_icons.scss CHANGED
@@ -23,6 +23,7 @@
23
23
  .dx-icon-edit,
24
24
  .dx-icon-email,
25
25
  .dx-icon-event,
26
+ .dx-icon-eventall,
26
27
  .dx-icon-favorites,
27
28
  .dx-icon-find,
28
29
  .dx-icon-folder,
@@ -104,7 +105,8 @@
104
105
  .dx-icon-addcolumnleft,
105
106
  .dx-icon-addcolumnright,
106
107
  .dx-icon-addtable,
107
- .dx-icon-removetable {
108
+ .dx-icon-removetable,
109
+ .dx-icon-bell {
108
110
  background-position: 0 0;
109
111
  background-repeat: no-repeat;
110
112
  }
@@ -220,6 +222,7 @@ $icons: (
220
222
  "edit": "\f023",
221
223
  "email": "\f024",
222
224
  "event": "\f026",
225
+ "eventall": "\f043",
223
226
  "favorites": "\f025",
224
227
  "find": "\f027",
225
228
  "filter": "\f050",
@@ -420,7 +423,7 @@ $icons: (
420
423
  "unlock": "\f155",
421
424
  "imgarlock": "\f156",
422
425
  "imgarunlock": "\f157",
423
- "bell": "\f158"
426
+ "bell": "\f158",
424
427
  );
425
428
 
426
429
  // stylelint-enable
package/data/scss/widgets/base/_toolbar.scss CHANGED
@@ -2,14 +2,9 @@
2
2
 
3
3
  // adduse
4
4
 
5
-
6
5
  .dx-toolbar {
7
6
  width: 100%;
8
7
 
9
- .dx-button-content::after {
10
- display: none;
11
- }
12
-
13
8
  .dx-device-mobile &.dx-toolbar-multiline,
14
9
  &.dx-toolbar-multiline {
15
10
  .dx-toolbar-items-container {
@@ -136,38 +131,66 @@
136
131
  padding: 0;
137
132
  }
138
133
 
139
- .dx-toolbar-menu-section.dx-toolbar-menu-last-section {
140
- border-bottom: none;
141
- }
134
+ .dx-toolbar-menu-section {
135
+ &.dx-toolbar-menu-last-section {
136
+ border-bottom: none;
137
+ }
142
138
 
143
- .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button {
144
- border: none;
145
- background: none;
146
- margin: 0;
147
- width: 100%;
148
- text-align: left;
149
- padding: 10px;
150
- box-shadow: none;
139
+ .dx-toolbar-hidden-button {
140
+ .dx-toolbar-item-auto-hide {
141
+ padding: 0;
142
+ }
151
143
 
152
- .dx-button-text {
153
- line-height: normal;
154
- }
144
+ .dx-button {
145
+ border: none;
146
+ background: none;
147
+ margin: 0;
148
+ width: 100%;
149
+ text-align: left;
150
+ padding: 10px;
151
+ box-shadow: none;
152
+
153
+ .dx-button-text {
154
+ line-height: normal;
155
+ }
155
156
 
156
- .dx-button-content {
157
- text-align: left;
157
+ .dx-button-content {
158
+ text-align: left;
158
159
 
159
- @at-root #{selector-append(".dx-rtl", &)},
160
- .dx-rtl & {
161
- text-align: right;
160
+ @at-root #{selector-append(".dx-rtl", &)},
161
+ .dx-rtl & {
162
+ text-align: right;
163
+ }
164
+ }
162
165
  }
163
166
  }
164
- }
165
167
 
166
- .dx-toolbar-menu-section {
167
- .dx-toolbar-hidden-button {
168
+ .dx-toolbar-hidden-button-group {
168
169
  .dx-toolbar-item-auto-hide {
169
170
  padding: 0;
170
171
  }
172
+
173
+ &.dx-state-hover {
174
+ background-color: transparent;
175
+ }
176
+
177
+ .dx-buttongroup {
178
+ width: 100%;
179
+
180
+ .dx-buttongroup-wrapper {
181
+ flex-direction: column;
182
+
183
+ .dx-buttongroup-item {
184
+ border: none;
185
+ text-align: left;
186
+
187
+ @at-root #{selector-append(".dx-rtl", &)},
188
+ .dx-rtl & {
189
+ text-align: right;
190
+ }
191
+ }
192
+ }
193
+ }
171
194
  }
172
195
  }
173
196
 
@@ -182,35 +205,3 @@
182
205
  .dx-toolbar-item-invisible {
183
206
  display: none;
184
207
  }
185
-
186
- .dx-toolbar-hidden-button-group {
187
- &.dx-state-hover {
188
- background-color: transparent;
189
- }
190
-
191
- .dx-list-item-content {
192
- padding: 0;
193
-
194
- .dx-toolbar-item-auto-hide {
195
- padding: 0;
196
- }
197
- }
198
-
199
- .dx-buttongroup {
200
- width: 100%;
201
-
202
- .dx-buttongroup-wrapper {
203
- flex-direction: column;
204
-
205
- .dx-buttongroup-item {
206
- border: none;
207
- text-align: left;
208
-
209
- @at-root #{selector-append(".dx-rtl", &)},
210
- .dx-rtl & {
211
- text-align: right;
212
- }
213
- }
214
- }
215
- }
216
- }
package/data/scss/widgets/base/scheduler/views/_index.scss CHANGED
@@ -556,8 +556,7 @@ $scheduler-month-date-text-padding: 6px;
556
556
  font-size: $scheduler-small-font-size;
557
557
  }
558
558
 
559
- .dx-scheduler-time-panel-row:first-of-type,
560
- .dx-scheduler-virtual-row ~ .dx-scheduler-time-panel-row:nth-child(2) {
559
+ .dx-scheduler-time-panel-row:first-of-type {
561
560
  td > div {
562
561
  margin-top: 0;
563
562
  }
package/data/scss/widgets/generic/calendar/_index.scss CHANGED
@@ -194,6 +194,17 @@ $generic-calendar-height: $generic-calendar-body-height + $generic-calendar-navi
194
194
  font-size: $generic-xs-font-size;
195
195
  padding: 1px 0 $generic-calendar-header-bottom-padding 0;
196
196
  }
197
+
198
+ .dx-week-number-header {
199
+ color: $calendar-cell-selected-bg;
200
+ }
201
+
202
+ .dx-calendar-week-number-cell {
203
+ padding: 1px $generic-calendar-cell-horizontal-padding 2px;
204
+ color: $calendar-cell-selected-bg;
205
+ font-size: $generic-calendar-week-number-cell-font-size;
206
+ width: 39px;
207
+ }
197
208
  }
198
209
  }
199
210
 
package/data/scss/widgets/generic/calendar/_sizes.scss CHANGED
@@ -3,6 +3,7 @@
3
3
  // adduse
4
4
 
5
5
  $generic-calendar-cell-font-size: null !default;
6
+ $generic-calendar-week-number-cell-font-size: null !default;
6
7
  $generic-calendar-body-width: null !default;
7
8
  $generic-calendar-body-height: null !default;
8
9
  $generic-calendar-body-top: null !default;
@@ -16,6 +17,7 @@ $generic-calendar-caption-button-padding: null !default;
16
17
 
17
18
  @if $size == "default" {
18
19
  $generic-calendar-cell-font-size: 15px !default;
20
+ $generic-calendar-week-number-cell-font-size: 12px !default;
19
21
  $generic-calendar-body-width: 282px !default;
20
22
  $generic-calendar-body-height: 205px !default;
21
23
  $generic-calendar-body-top: 52px !default;
@@ -31,6 +33,7 @@ $generic-calendar-caption-button-padding: null !default;
31
33
 
32
34
  @else if $size == "compact" {
33
35
  $generic-calendar-cell-font-size: 13px !default;
36
+ $generic-calendar-week-number-cell-font-size: 11px !default;
34
37
  $generic-calendar-body-width: 232px !default;
35
38
  $generic-calendar-body-height: 175px !default;
36
39
  $generic-calendar-body-top: 42px !default;
package/data/scss/widgets/generic/form/_index.scss CHANGED
@@ -1,9 +1,11 @@
1
+ @use "sass:math";
1
2
  @use "sass:color";
2
3
  @use "colors" as *;
3
4
  @use "../colors" as *;
4
5
  @use "sizes" as *;
5
6
  @use "../sizes" as *;
6
7
  @use "../../base/form";
8
+ @use "../../base/icons" as *;
7
9
 
8
10
  // adduse
9
11
  @use "../scrollable";
@@ -37,3 +39,10 @@
37
39
  .dx-field-item-required-mark {
38
40
  color: $form-field-required-color;
39
41
  }
42
+
43
+ .dx-field-item-custom-label-content {
44
+ .dx-icon {
45
+ @include dx-icon-sizing($generic-form-label-icon-size);
46
+ @include dx-icon-margin(math.div($generic-base-icon-size, 2));
47
+ }
48
+ }
package/data/scss/widgets/generic/form/_sizes.scss CHANGED
@@ -4,14 +4,17 @@
4
4
 
5
5
  $generic-form-group-caption-font-size: null !default;
6
6
  $generic-form-group-content-padding-bottom: null !default;
7
+ $generic-form-label-icon-size: null !default;
7
8
 
8
9
  @if $size == "default" {
9
10
  $generic-form-group-caption-font-size: 20px !default;
10
11
  $generic-form-group-content-padding-bottom: 20px !default;
12
+ $generic-form-label-icon-size: 20px !default;
11
13
  }
12
14
 
13
15
  @else if $size == "compact" {
14
16
  $generic-form-group-caption-font-size: 16px !default;
15
17
  $generic-form-group-content-padding-bottom: 10px !default;
18
+ $generic-form-label-icon-size: 16px !default;
16
19
  }
17
20
 
package/data/scss/widgets/generic/toolbar/_index.scss CHANGED
@@ -90,6 +90,19 @@
90
90
  }
91
91
  }
92
92
  }
93
+
94
+ .dx-toolbar-hidden-button-group {
95
+ margin-top: $generic-toolbar-item-spacing;
96
+ margin-bottom: $generic-toolbar-item-spacing;
97
+
98
+ .dx-buttongroup-wrapper {
99
+ .dx-buttongroup-item.dx-button {
100
+ .dx-button-content {
101
+ padding: $generic-list-item-vertical-padding;
102
+ }
103
+ }
104
+ }
105
+ }
93
106
  }
94
107
 
95
108
  .dx-toolbar-text-auto-hide .dx-button {
@@ -118,16 +131,3 @@
118
131
  }
119
132
  }
120
133
  }
121
-
122
- .dx-toolbar-hidden-button-group {
123
- margin-top: $generic-toolbar-item-spacing;
124
- margin-bottom: $generic-toolbar-item-spacing;
125
-
126
- .dx-buttongroup-wrapper {
127
- .dx-buttongroup-item.dx-button {
128
- .dx-button-content {
129
- padding: $generic-list-item-vertical-padding;
130
- }
131
- }
132
- }
133
- }
package/data/scss/widgets/material/accordion/_index.scss CHANGED
@@ -68,7 +68,7 @@ $material-accordion-disabled-opacity: 0.5;
68
68
  }
69
69
  }
70
70
 
71
- + .dx-accordion-item-closed {
71
+ + .dx-accordion-item {
72
72
  border-top: none;
73
73
  }
74
74
  }
package/data/scss/widgets/material/button/_index.scss CHANGED
@@ -35,18 +35,10 @@
35
35
  min-width: $material-button-min-width;
36
36
 
37
37
  @include dx-button-withtext-sizing();
38
-
39
- &.dx-button-mode-text {
40
- @include dx-button-mode-text-withtext-sizing();
41
- }
42
38
  }
43
39
 
44
40
  .dx-button-has-icon.dx-button-has-text {
45
41
  @include dx-button-text-and-icon-sizing();
46
-
47
- &.dx-button-mode-text {
48
- @include dx-button-mode-text-withtext-sizing();
49
- }
50
42
  }
51
43
 
52
44
  .dx-button { // stylelint-disable-line no-duplicate-selectors
package/data/scss/widgets/material/button/_mixins.scss CHANGED
@@ -35,10 +35,6 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
35
35
  @include dx-button-sizing($material-button-padding, $material-button-icon-size - 6, math.div($material-button-icon-size, 2));
36
36
  }
37
37
 
38
- @mixin dx-button-mode-text-withtext-sizing() {
39
- @include dx-button-sizing($material-button-vertical-padding $material-text-button-horizontal-padding, $material-button-icon-size - 6, math.div($material-button-icon-size, 2));
40
- }
41
-
42
38
  @mixin dx-button-text-and-icon-sizing() {
43
39
  @include dx-button-sizing($material-button-padding, $material-button-icon-size - 6, 8px);
44
40
 
package/data/scss/widgets/material/calendar/_index.scss CHANGED
@@ -176,6 +176,18 @@ $material-calendar-height: $material-calendar-body-height + $material-calendar-n
176
176
  text-align: center;
177
177
  padding: 1px 0 $material-calendar-header-bottom-padding 0;
178
178
  }
179
+
180
+ .dx-week-number-header {
181
+ color: $calendar-cell-selected-bg;
182
+ }
183
+
184
+ .dx-calendar-week-number-cell {
185
+ padding: $material-calendar-cell-vertical-padding 0;
186
+ color: $calendar-cell-selected-bg;
187
+ font-size: $material-calendar-week-number-cell-font-size;
188
+ width: $material-calendar-cell-width;
189
+ border-radius: $calendar-cell-contoured-border-radius;
190
+ }
179
191
  }
180
192
  }
181
193
 
package/data/scss/widgets/material/calendar/_sizes.scss CHANGED
@@ -12,6 +12,7 @@ $material-calendar-cell-diameter: null !default;
12
12
  $material-calendar-cell-vertical-padding: null !default;
13
13
 
14
14
  $material-calendar-cell-font-size: 12px !default;
15
+ $material-calendar-week-number-cell-font-size: 10px !default;
15
16
  $material-calendar-footer-height: 45px !default;
16
17
  $material-calendar-navigator-vertical-padding: 9px !default;
17
18
  $material-calendar-header-bottom-padding: 10px !default;
package/data/scss/widgets/material/dataGrid/_index.scss CHANGED
@@ -65,7 +65,7 @@
65
65
 
66
66
  .dx-datagrid-rowsview {
67
67
  .dx-row.dx-group-row:first-child {
68
- border-top: none,;
68
+ border-top: none;
69
69
  }
70
70
 
71
71
 
package/data/scss/widgets/material/form/_index.scss CHANGED
@@ -1,9 +1,11 @@
1
+ @use "sass:math";
1
2
  @use "sass:color";
2
3
  @use "colors" as *;
3
4
  @use "../colors" as *;
4
5
  @use "sizes" as *;
5
6
  @use "../sizes" as *;
6
7
  @use "../../base/form";
8
+ @use "../../base/icons" as *;
7
9
  @use "../textEditor/sizes" as *;
8
10
 
9
11
  // adduse
@@ -124,3 +126,10 @@
124
126
  .dx-field-item-required-mark {
125
127
  color: $form-field-required-color;
126
128
  }
129
+
130
+ .dx-field-item-custom-label-content {
131
+ .dx-icon {
132
+ @include dx-icon-sizing($material-form-label-icon-size);
133
+ @include dx-icon-margin(math.div($material-base-icon-size, 3));
134
+ }
135
+ }
package/data/scss/widgets/material/form/_sizes.scss CHANGED
@@ -10,6 +10,8 @@ $material-form-group-content-padding-bottom: null !default;
10
10
  $material-form-default-top-padding: null !default;
11
11
 
12
12
  $material-form-label-font-size: 12px !default;
13
+ $material-form-label-icon-size: 14px !default;
14
+
13
15
 
14
16
  @if $size == "default" {
15
17
  $material-form-group-caption-bottom-margin: 6px !default;
package/data/scss/widgets/material/gridBase/_index.scss CHANGED
@@ -383,18 +383,6 @@ $grid-masterdetail-padding: 16px;
383
383
  padding-right: 0;
384
384
  }
385
385
  }
386
-
387
- .dx-searchbox {
388
- .dx-texteditor-input,
389
- .dx-placeholder::before {
390
- padding-left: $material-texteditor-icon-container-size;
391
-
392
- @at-root #{selector-append(".dx-rtl", &)},
393
- .dx-rtl & {
394
- padding-right: $material-texteditor-icon-container-size;
395
- }
396
- }
397
- }
398
386
  }
399
387
 
400
388
  .dx-editor-cell {
package/data/scss/widgets/material/toolbar/_index.scss CHANGED
@@ -114,6 +114,29 @@
114
114
  }
115
115
  }
116
116
 
117
+ .dx-toolbar-hidden-button-group {
118
+ margin-top: $material-toolbar-padding;
119
+ margin-bottom: $material-toolbar-padding;
120
+
121
+ &:first-of-type {
122
+ margin-top: $material-list-vertical-padding;
123
+ }
124
+
125
+ &:last-of-type {
126
+ margin-bottom: $material-list-vertical-padding;
127
+ }
128
+
129
+ .dx-buttongroup-wrapper {
130
+ .dx-buttongroup-item.dx-button {
131
+ box-shadow: none;
132
+
133
+ .dx-button-content {
134
+ padding: $material-toolbar-padding $material-list-item-horizontal-padding;
135
+ }
136
+ }
137
+ }
138
+ }
139
+
117
140
  .dx-toolbar-item-auto-hide {
118
141
  padding: $material-list-item-vertical-padding $material-list-item-horizontal-padding $material-list-item-vertical-padding - 1px;
119
142
  }
@@ -173,17 +196,3 @@
173
196
  padding: 4px;
174
197
  }
175
198
 
176
- .dx-toolbar-hidden-button-group {
177
- margin-top: $material-toolbar-padding;
178
- margin-bottom: $material-toolbar-padding;
179
-
180
- .dx-buttongroup-wrapper {
181
- .dx-buttongroup-item.dx-button {
182
- box-shadow: none;
183
-
184
- .dx-button-content {
185
- padding: $material-toolbar-padding $material-list-item-horizontal-padding;
186
- }
187
- }
188
- }
189
- }
package/data/scss/widgets/material/validation/_index.scss CHANGED
@@ -13,12 +13,30 @@
13
13
  .dx-invalid-message > .dx-overlay-content {
14
14
  background-color: transparent;
15
15
  color: $validation-message-background-color;
16
- padding: $material-validation-message-padding 0 0;
17
16
 
18
- .dx-editor-filled &,
19
- .dx-editor-outlined & {
20
- padding-left: $material-filled-texteditor-input-horizontal-padding;
21
- padding-right: $material-filled-texteditor-input-horizontal-padding;
17
+ .dx-invalid-message-top &,
18
+ .dx-invalid-message-bottom & {
19
+ .dx-editor-filled &,
20
+ .dx-editor-outlined {
21
+ padding-left: $material-filled-texteditor-input-horizontal-padding;
22
+ padding-right: $material-filled-texteditor-input-horizontal-padding;
23
+ }
24
+ }
25
+
26
+ .dx-invalid-message-top & {
27
+ padding: 0 0 $material-validation-message-padding 0;
28
+ }
29
+
30
+ .dx-invalid-message-right & {
31
+ padding: 0 0 0 $material-validation-message-padding;
32
+ }
33
+
34
+ .dx-invalid-message-bottom & {
35
+ padding: $material-validation-message-padding 0 0 0;
36
+ }
37
+
38
+ .dx-invalid-message-left & {
39
+ padding: 0 $material-validation-message-padding 0 0;
22
40
  }
23
41
  }
24
42
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "devextreme-themebuilder",
3
- "version": "22.1.6",
3
+ "version": "22.2.1-alpha-22297-1232",
4
4
  "description": "DevExtreme ThemeBuilder",
5
5
  "keywords": [
6
6
  "devextreme",