@progress/kendo-theme-classic 5.12.1-dev.2 → 5.12.1-dev.4

package/scss/color-preview/_variables.scss

@@ -1,14 +1,14 @@
 // Color Preview
-$color-preview-border-radius: $kendo-border-radius-md !default;
-$color-preview-border-width: 1px !default;
-$color-preview-bg: null !default;
-$color-preview-text: null !default;
-$color-preview-border: $kendo-component-border !default;
-$color-preview-hover-border: $kendo-hover-border !default;
+$kendo-color-preview-border-radius: $kendo-border-radius-md !default;
+$kendo-color-preview-border-width: 1px !default;
+$kendo-color-preview-bg: null !default;
+$kendo-color-preview-text: null !default;
+$kendo-color-preview-border: $kendo-component-border !default;
+$kendo-color-preview-hover-border: $kendo-hover-border !default;
 
-$color-preview-no-color-bg: $kendo-color-white !default;
-$color-preview-no-color-text: $kendo-color-error !default;
-$color-preview-no-color-border: null !default;
+$kendo-color-preview-no-color-bg: $kendo-color-white !default;
+$kendo-color-preview-no-color-text: $kendo-color-error !default;
+$kendo-color-preview-no-color-border: null !default;
 
-$color-preview-no-color-image: k-escape-svg( url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' version='1.1'><line x1='0' x2='20' y1='0' y2='20' stroke='#{$color-preview-no-color-text}' stroke-width='1'/></svg>") ) !default;
-$color-preview-transparent-color-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC") !default;
+$kendo-color-preview-no-color-image: k-escape-svg( url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' version='1.1'><line x1='0' x2='20' y1='0' y2='20' stroke='#{$kendo-color-preview-no-color-text}' stroke-width='1'/></svg>") ) !default;
+$kendo-color-preview-transparent-color-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC") !default;

package/scss/coloreditor/_variables.scss

@@ -1,31 +1,31 @@
 // Coloreditor/FlatColorPicker
-$coloreditor-spacer: k-map-get( $kendo-spacing, 3 ) !default;
+$kendo-color-editor-spacer: k-map-get( $kendo-spacing, 3 ) !default;
 
-$coloreditor-min-width: 272px !default;
-$coloreditor-border-width: 1px !default;
-$coloreditor-border-radius: $kendo-border-radius-md !default;
-$coloreditor-font-family: $font-family !default;
-$coloreditor-font-size: $font-size !default;
-$coloreditor-line-height: $line-height !default;
-$coloreditor-bg: $kendo-component-bg !default;
-$coloreditor-text: $kendo-component-text !default;
-$coloreditor-border: $kendo-component-border !default;
+$kendo-color-editor-min-width: 272px !default;
+$kendo-color-editor-border-width: 1px !default;
+$kendo-color-editor-border-radius: $kendo-border-radius-md !default;
+$kendo-color-editor-font-family: $kendo-font-family !default;
+$kendo-color-editor-font-size: $kendo-font-size-md !default;
+$kendo-color-editor-line-height: $kendo-line-height-md !default;
+$kendo-color-editor-bg: $kendo-component-bg !default;
+$kendo-color-editor-text: $kendo-component-text !default;
+$kendo-color-editor-border: $kendo-component-border !default;
 
-$coloreditor-focus-border: null !default;
-$coloreditor-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
+$kendo-color-editor-focus-border: null !default;
+$kendo-color-editor-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
 
-$coloreditor-header-padding-y: $coloreditor-spacer !default;
-$coloreditor-header-padding-x: $coloreditor-header-padding-y !default;
-$coloreditor-header-actions-gap: k-math-div( $coloreditor-spacer, 1.5 ) !default;
+$kendo-color-editor-header-padding-y: $kendo-color-editor-spacer !default;
+$kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-y !default;
+$kendo-color-editor-header-actions-gap: k-math-div( $kendo-color-editor-spacer, 1.5 ) !default;
 
-$coloreditor-preview-gap: k-map-get( $kendo-spacing, 1 ) !default;
-$coloreditor-color-preview-width: 32px !default;
-$coloreditor-color-preview-height: 12px !default;
+$kendo-color-editor-preview-gap: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-color-editor-color-preview-width: 32px !default;
+$kendo-color-editor-color-preview-height: 12px !default;
 
-$coloreditor-views-padding-y: $coloreditor-spacer !default;
-$coloreditor-views-padding-x: $coloreditor-views-padding-y !default;
-$coloreditor-views-gap: $coloreditor-spacer !default;
+$kendo-color-editor-views-padding-y: $kendo-color-editor-spacer !default;
+$kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-y !default;
+$kendo-color-editor-views-gap: $kendo-color-editor-spacer !default;
 
-$coloreditor-colorgradient-focus-outline-color: rgba(0, 0, 0, .3) !default;
-$coloreditor-colorgradient-focus-outline: 2px !default;
-$coloreditor-colorgradient-focus-outline-offset: 4px !default;
+$kendo-color-editor-color-gradient-focus-outline-color: rgba(0, 0, 0, .3) !default;
+$kendo-color-editor-color-gradient-focus-outline: 2px !default;
+$kendo-color-editor-color-gradient-focus-outline-offset: 4px !default;

package/scss/colorgradient/_variables.scss

@@ -1,52 +1,52 @@
 // ColorGradient
-$colorgradient-spacer: k-map-get( $kendo-spacing, 3 ) !default;
-
-$colorgradient-width: 272px !default;
-$colorgradient-border-width: 1px !default;
-$colorgradient-border-radius: $kendo-border-radius-md !default;
-$colorgradient-padding-y: $colorgradient-spacer !default;
-$colorgradient-padding-x: $colorgradient-padding-y !default;
-$colorgradient-gap: $colorgradient-spacer !default;
-$colorgradient-font-family: $font-family !default;
-$colorgradient-font-size: $font-size !default;
-$colorgradient-line-height: $line-height !default;
-$colorgradient-bg: $kendo-component-bg !default;
-$colorgradient-text: $kendo-component-text !default;
-$colorgradient-border: $kendo-component-border !default;
-
-$colorgradient-focus-border: null !default;
-$colorgradient-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
-
-
-$colorgradient-canvas-border-radius: $kendo-border-radius-md !default;
-$colorgradient-canvas-gap: $colorgradient-spacer !default;
-$colorgradient-canvas-rectangle-height: 180px !default;
-
-$colorgradient-slider-track-size: 10px !default;
-$colorgradient-slider-border-radius: 10px !default;
-$colorgradient-slider-draghandle-border-width: 3px !default;
-
-$colorgradient-slider-vertical-size: 180px !default;
-$colorgradient-slider-horizontal-size: 100% !default;
-
-$colorgradient-draghandle-width: 14px !default;
-$colorgradient-draghandle-height: 14px !default;
-$colorgradient-draghandle-border-width: 1px !default;
-$colorgradient-draghandle-border-radius: 50% !default;
-$colorgradient-draghandle-bg: transparent !default;
-$colorgradient-draghandle-text: null !default;
-$colorgradient-draghandle-border: rgba( white, .8) !default;
-$colorgradient-draghandle-shadow: 0 1px 4px rgba( black, .5 ) !default;
-$colorgradient-draghandle-focus-shadow: 0 1px 4px black !default;
-$colorgradient-draghandle-hover-shadow: $colorgradient-draghandle-focus-shadow !default;
-
-$colorgradient-canvas-draghandle-margin-y: - k-math-div( $colorgradient-draghandle-height, 2 ) !default;
-$colorgradient-canvas-draghandle-margin-x: - k-math-div( $colorgradient-draghandle-width, 2 ) !default;
-
-$colorgradient-input-width: 46px !default;
-$colorgradient-input-gap: k-math-div( $colorgradient-spacer, 1.5 ) !default;
-$colorgradient-input-label-gap: k-math-div( $colorgradient-spacer, 3 ) !default;
-$colorgradient-input-label-text: $kendo-subtle-text !default;
-
-$colorgradient-contrast-ratio-font-weight: $font-weight-bold !default;
-$colorgradient-contrast-spacer: k-math-div( $colorgradient-spacer, 1.5 ) !default;
+$kendo-color-gradient-spacer: k-map-get( $kendo-spacing, 3 ) !default;
+
+$kendo-color-gradient-width: 272px !default;
+$kendo-color-gradient-border-width: 1px !default;
+$kendo-color-gradient-border-radius: $kendo-border-radius-md !default;
+$kendo-color-gradient-padding-y: $kendo-color-gradient-spacer !default;
+$kendo-color-gradient-padding-x: $kendo-color-gradient-padding-y !default;
+$kendo-color-gradient-gap: $kendo-color-gradient-spacer !default;
+$kendo-color-gradient-font-family: $kendo-font-family !default;
+$kendo-color-gradient-font-size: $kendo-font-size-md !default;
+$kendo-color-gradient-line-height: $kendo-line-height-md !default;
+$kendo-color-gradient-bg: $kendo-component-bg !default;
+$kendo-color-gradient-text: $kendo-component-text !default;
+$kendo-color-gradient-border: $kendo-component-border !default;
+
+$kendo-color-gradient-focus-border: null !default;
+$kendo-color-gradient-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
+
+
+$kendo-color-gradient-canvas-border-radius: $kendo-border-radius-md !default;
+$kendo-color-gradient-canvas-gap: $kendo-color-gradient-spacer !default;
+$kendo-color-gradient-canvas-rectangle-height: 180px !default;
+
+$kendo-color-gradient-slider-track-size: 10px !default;
+$kendo-color-gradient-slider-border-radius: 10px !default;
+$kendo-color-gradient-slider-draghandle-border-width: 3px !default;
+
+$kendo-color-gradient-slider-vertical-size: 180px !default;
+$kendo-color-gradient-slider-horizontal-size: 100% !default;
+
+$kendo-color-gradient-draghandle-width: 14px !default;
+$kendo-color-gradient-draghandle-height: 14px !default;
+$kendo-color-gradient-draghandle-border-width: 1px !default;
+$kendo-color-gradient-draghandle-border-radius: 50% !default;
+$kendo-color-gradient-draghandle-bg: transparent !default;
+$kendo-color-gradient-draghandle-text: null !default;
+$kendo-color-gradient-draghandle-border: rgba( white, .8) !default;
+$kendo-color-gradient-draghandle-shadow: 0 1px 4px rgba( black, .5 ) !default;
+$kendo-color-gradient-draghandle-focus-shadow: 0 1px 4px black !default;
+$kendo-color-gradient-draghandle-hover-shadow: $kendo-color-gradient-draghandle-focus-shadow !default;
+
+$kendo-color-gradient-canvas-draghandle-margin-y: - k-math-div( $kendo-color-gradient-draghandle-height, 2 ) !default;
+$kendo-color-gradient-canvas-draghandle-margin-x: - k-math-div( $kendo-color-gradient-draghandle-width, 2 ) !default;
+
+$kendo-color-gradient-input-width: 46px !default;
+$kendo-color-gradient-input-gap: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;
+$kendo-color-gradient-input-label-gap: k-math-div( $kendo-color-gradient-spacer, 3 ) !default;
+$kendo-color-gradient-input-label-text: $kendo-subtle-text !default;
+
+$kendo-color-gradient-contrast-ratio-font-weight: $kendo-font-weight-bold !default;
+$kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;

package/scss/colorpalette/_variables.scss

@@ -1,10 +1,10 @@
 // Colorpalette
-$colorpalette-font-family: $font-family !default;
-$colorpalette-font-size: $font-size !default;
-$colorpalette-line-height: 0 !default;
+$kendo-color-palette-font-family: $kendo-font-family !default;
+$kendo-color-palette-font-size: $kendo-font-size-md !default;
+$kendo-color-palette-line-height: 0 !default;
 
-$colorpalette-tile-width: k-map-get( $kendo-spacing, 6 ) !default;
-$colorpalette-tile-height: $colorpalette-tile-width !default;
-$colorpalette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 ) !default;
-$colorpalette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .8 ) !default;
-$colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 ) !default;
+$kendo-color-palette-tile-width: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-color-palette-tile-height: $kendo-color-palette-tile-width !default;
+$kendo-color-palette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 ) !default;
+$kendo-color-palette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .8 ) !default;
+$kendo-color-palette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 ) !default;

package/scss/dataviz/_variables.scss

@@ -5,135 +5,135 @@
 
 /// The first base series color and its light and dark shades.
 /// @group charts
-$series-a: #ff6358 !default;
-$series-a-dark: k-color-mix( black, $series-a, 25% ) !default;
-$series-a-darker: k-color-mix( black, $series-a, 50% ) !default;
-$series-a-light: k-color-mix( white, $series-a, 25% ) !default;
-$series-a-lighter: k-color-mix( white, $series-a, 50% ) !default;
+$kendo-series-a: #ff6358 !default;
+$kendo-series-a-dark: k-color-mix( black, $kendo-series-a, 25% ) !default;
+$kendo-series-a-darker: k-color-mix( black, $kendo-series-a, 50% ) !default;
+$kendo-series-a-light: k-color-mix( white, $kendo-series-a, 25% ) !default;
+$kendo-series-a-lighter: k-color-mix( white, $kendo-series-a, 50% ) !default;
 
 /// The second base series color and its light and dark shades.
 /// @group charts
-$series-b: #ffd246 !default;
-$series-b-dark: k-color-mix( black, $series-b, 25% ) !default;
-$series-b-darker: k-color-mix( black, $series-b, 50% ) !default;
-$series-b-light: k-color-mix( white, $series-b, 25% ) !default;
-$series-b-lighter: k-color-mix( white, $series-b, 50% ) !default;
+$kendo-series-b: #ffd246 !default;
+$kendo-series-b-dark: k-color-mix( black, $kendo-series-b, 25% ) !default;
+$kendo-series-b-darker: k-color-mix( black, $kendo-series-b, 50% ) !default;
+$kendo-series-b-light: k-color-mix( white, $kendo-series-b, 25% ) !default;
+$kendo-series-b-lighter: k-color-mix( white, $kendo-series-b, 50% ) !default;
 
 /// The third base series color and its light and dark shades.
 /// @group charts
-$series-c: #78d237 !default;
-$series-c-dark: k-color-mix( black, $series-c, 25% ) !default;
-$series-c-darker: k-color-mix( black, $series-c, 50% ) !default;
-$series-c-light: k-color-mix( white, $series-c, 25% ) !default;
-$series-c-lighter: k-color-mix( white, $series-c, 50% ) !default;
+$kendo-series-c: #78d237 !default;
+$kendo-series-c-dark: k-color-mix( black, $kendo-series-c, 25% ) !default;
+$kendo-series-c-darker: k-color-mix( black, $kendo-series-c, 50% ) !default;
+$kendo-series-c-light: k-color-mix( white, $kendo-series-c, 25% ) !default;
+$kendo-series-c-lighter: k-color-mix( white, $kendo-series-c, 50% ) !default;
 
 /// The fourth base series color and its light and dark shades.
 /// @group charts
-$series-d: #28b4c8 !default;
-$series-d-dark: k-color-mix( black, $series-d, 25% ) !default;
-$series-d-darker: k-color-mix( black, $series-d, 50% ) !default;
-$series-d-light: k-color-mix( white, $series-d, 25% ) !default;
-$series-d-lighter: k-color-mix( white, $series-d, 50% ) !default;
+$kendo-series-d: #28b4c8 !default;
+$kendo-series-d-dark: k-color-mix( black, $kendo-series-d, 25% ) !default;
+$kendo-series-d-darker: k-color-mix( black, $kendo-series-d, 50% ) !default;
+$kendo-series-d-light: k-color-mix( white, $kendo-series-d, 25% ) !default;
+$kendo-series-d-lighter: k-color-mix( white, $kendo-series-d, 50% ) !default;
 
 /// The fifth base series color and its light and dark shades.
 /// @group charts
-$series-e: #2d73f5 !default;
-$series-e-dark: k-color-mix( black, $series-e, 25% ) !default;
-$series-e-darker: k-color-mix( black, $series-e, 50% ) !default;
-$series-e-light: k-color-mix( white, $series-e, 25% ) !default;
-$series-e-lighter: k-color-mix( white, $series-e, 50% ) !default;
+$kendo-series-e: #2d73f5 !default;
+$kendo-series-e-dark: k-color-mix( black, $kendo-series-e, 25% ) !default;
+$kendo-series-e-darker: k-color-mix( black, $kendo-series-e, 50% ) !default;
+$kendo-series-e-light: k-color-mix( white, $kendo-series-e, 25% ) !default;
+$kendo-series-e-lighter: k-color-mix( white, $kendo-series-e, 50% ) !default;
 
 /// The sixth base series color and its light and dark shades.
 /// @group charts
-$series-f: #aa46be !default;
-$series-f-dark: k-color-mix( black, $series-f, 25% ) !default;
-$series-f-darker: k-color-mix( black, $series-f, 50% ) !default;
-$series-f-light: k-color-mix( white, $series-f, 25% ) !default;
-$series-f-lighter: k-color-mix( white, $series-f, 50% ) !default;
+$kendo-series-f: #aa46be !default;
+$kendo-series-f-dark: k-color-mix( black, $kendo-series-f, 25% ) !default;
+$kendo-series-f-darker: k-color-mix( black, $kendo-series-f, 50% ) !default;
+$kendo-series-f-light: k-color-mix( white, $kendo-series-f, 25% ) !default;
+$kendo-series-f-lighter: k-color-mix( white, $kendo-series-f, 50% ) !default;
 
 /// The series colors in order:
 /// base, light, dark, lighter, darker
 /// @group charts
-$series-1: $series-a !default;
-$series-2: $series-b !default;
-$series-3: $series-c !default;
-$series-4: $series-d !default;
-$series-5: $series-e !default;
-$series-6: $series-f !default;
-$series-7: $series-a-light !default;
-$series-8: $series-b-light !default;
-$series-9: $series-c-light !default;
-$series-10: $series-d-light !default;
-$series-11: $series-e-light !default;
-$series-12: $series-f-light !default;
-$series-13: $series-a-dark !default;
-$series-14: $series-b-dark !default;
-$series-15: $series-c-dark !default;
-$series-16: $series-d-dark !default;
-$series-17: $series-e-dark !default;
-$series-18: $series-f-dark !default;
-$series-19: $series-a-lighter !default;
-$series-20: $series-b-lighter !default;
-$series-21: $series-c-lighter !default;
-$series-22: $series-d-lighter !default;
-$series-23: $series-e-lighter !default;
-$series-24: $series-f-lighter !default;
-$series-25: $series-a-darker !default;
-$series-26: $series-b-darker !default;
-$series-27: $series-c-darker !default;
-$series-28: $series-d-darker !default;
-$series-29: $series-e-darker !default;
-$series-30: $series-f-darker !default;
-
-$chart-border-width: 0px !default;
-$chart-font-family: $font-family !default;
-$chart-font-size: $font-size !default;
-$chart-line-height: $line-height !default;
-$chart-font-size-sm: 11px !default;
-$chart-font-size-md: 12px !default;
-$chart-font-size-lg: 16px !default;
-$chart-tooltip-font-size: ($font-size * .929) !default;
-$chart-label-font-size: .857em !default;
-$chart-title-font-size: 1.143em !default;
-$chart-pane-title-font-size: $chart-label-font-size !default;
-$chart-pane-title-font-weight: $font-weight-normal !default;
+$kendo-series-1: $kendo-series-a !default;
+$kendo-series-2: $kendo-series-b !default;
+$kendo-series-3: $kendo-series-c !default;
+$kendo-series-4: $kendo-series-d !default;
+$kendo-series-5: $kendo-series-e !default;
+$kendo-series-6: $kendo-series-f !default;
+$kendo-series-7: $kendo-series-a-light !default;
+$kendo-series-8: $kendo-series-b-light !default;
+$kendo-series-9: $kendo-series-c-light !default;
+$kendo-series-10: $kendo-series-d-light !default;
+$kendo-series-11: $kendo-series-e-light !default;
+$kendo-series-12: $kendo-series-f-light !default;
+$kendo-series-13: $kendo-series-a-dark !default;
+$kendo-series-14: $kendo-series-b-dark !default;
+$kendo-series-15: $kendo-series-c-dark !default;
+$kendo-series-16: $kendo-series-d-dark !default;
+$kendo-series-17: $kendo-series-e-dark !default;
+$kendo-series-18: $kendo-series-f-dark !default;
+$kendo-series-19: $kendo-series-a-lighter !default;
+$kendo-series-20: $kendo-series-b-lighter !default;
+$kendo-series-21: $kendo-series-c-lighter !default;
+$kendo-series-22: $kendo-series-d-lighter !default;
+$kendo-series-23: $kendo-series-e-lighter !default;
+$kendo-series-24: $kendo-series-f-lighter !default;
+$kendo-series-25: $kendo-series-a-darker !default;
+$kendo-series-26: $kendo-series-b-darker !default;
+$kendo-series-27: $kendo-series-c-darker !default;
+$kendo-series-28: $kendo-series-d-darker !default;
+$kendo-series-29: $kendo-series-e-darker !default;
+$kendo-series-30: $kendo-series-f-darker !default;
+
+$kendo-chart-border-width: 0px !default;
+$kendo-chart-font-family: $kendo-font-family !default;
+$kendo-chart-font-size: $kendo-font-size-md !default;
+$kendo-chart-line-height: $kendo-line-height-md !default;
+$kendo-chart-sm-font-size: 11px !default;
+$kendo-chart-md-font-size: 12px !default;
+$kendo-chart-lg-font-size: 16px !default;
+$kendo-chart-tooltip-font-size: ($kendo-font-size-md * .929) !default;
+$kendo-chart-label-font-size: .857em !default;
+$kendo-chart-title-font-size: 1.143em !default;
+$kendo-chart-pane-title-font-size: $kendo-chart-label-font-size !default;
+$kendo-chart-pane-title-font-weight: $kendo-font-weight-normal !default;
 
 /// The color of the Chart grid lines (major).
 /// @group charts
-$chart-major-lines: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .08 ) !default;
+$kendo-chart-major-lines: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .08 ) !default;
 
 /// The color of the Chart grid lines (minor).
 /// @group charts
-$chart-minor-lines: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .04 ) !default;
+$kendo-chart-minor-lines: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .04 ) !default;
 
-$chart-inactive: rgba( $kendo-body-text, .5 ) !default;
-$chart-area-opacity: .6 !default;
-$chart-area-inactive-opacity: .1 !default;
-$chart-line-inactive-opacity: .1 !default;
+$kendo-chart-inactive: rgba( $kendo-body-text, .5 ) !default;
+$kendo-chart-area-opacity: .6 !default;
+$kendo-chart-area-inactive-opacity: .1 !default;
+$kendo-chart-line-inactive-opacity: .1 !default;
 
-$chart-tooltip-transition: left 300ms cubic-bezier(0, .33, .19, 1), top 300ms cubic-bezier(0, .33, .19, 1) !default;
+$kendo-chart-tooltip-transition: left 300ms cubic-bezier(0, .33, .19, 1), top 300ms cubic-bezier(0, .33, .19, 1) !default;
 
-$chart-bg: $kendo-component-bg !default;
-$chart-text: $kendo-component-text !default;
-$chart-border: $kendo-component-border !default;
+$kendo-chart-bg: $kendo-component-bg !default;
+$kendo-chart-text: $kendo-component-text !default;
+$kendo-chart-border: $kendo-component-border !default;
 
-$chart-crosshair-background: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
-$chart-crosshair-shared-tooltip-color: $chart-text !default;
-$chart-crosshair-shared-tooltip-background: k-try-shade( $chart-bg, 1 ) !default;
-$chart-crosshair-shared-tooltip-border: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .08) !default;
+$kendo-chart-crosshair-background: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
+$kendo-chart-crosshair-shared-tooltip-color: $kendo-chart-text !default;
+$kendo-chart-crosshair-shared-tooltip-background: k-try-shade( $kendo-chart-bg, 1 ) !default;
+$kendo-chart-crosshair-shared-tooltip-border: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .08) !default;
 
-$chart-notes-background: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
-$chart-notes-border: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
-$chart-notes-lines: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
+$kendo-chart-notes-background: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
+$kendo-chart-notes-border: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
+$kendo-chart-notes-lines: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
 
-$error-bars-background: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
+$kendo-chart-error-bars-background: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
 
-$selection-handle-size: 22px !default;
-$selection-border-color: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .08 ) !default;
-$selection-shadow: inset 0 1px 7px rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .15) !default;
+$kendo-chart-selection-handle-size: 22px !default;
+$kendo-chart-selection-border-color: rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .08 ) !default;
+$kendo-chart-selection-shadow: inset 0 1px 7px rgba( if( $kendo-is-dark-theme, $kendo-color-white, $kendo-color-black ), .15) !default;
 
 
 // TreeMap
-$treemap-font-family: $font-family !default;
-$treemap-font-size: $font-size !default;
-$treemap-line-height: $line-height !default;
+$kendo-treemap-font-family: $kendo-font-family !default;
+$kendo-treemap-font-size: $kendo-font-size-md !default;
+$kendo-treemap-line-height: $kendo-line-height-md !default;

package/scss/datetimepicker/_variables.scss

@@ -1,2 +1,2 @@
 // DateTime
-$datetime-width: calc( #{$calendar-cell-size * 8} + #{$infinite-calendar-view-padding-x * 2}) !default;
+$kendo-datetime-width: calc( #{$kendo-calendar-cell-size * 8} + #{$kendo-infinite-calendar-view-padding-x * 2}) !default;

package/scss/dialog/_variables.scss

@@ -3,11 +3,11 @@ $kendo-dialog-titlebar-bg: null !default;
 $kendo-dialog-titlebar-text: null !default;
 $kendo-dialog-titlebar-border: null !default;
 
-$kendo-dialog-buttongroup-padding-x: $actions-padding-x !default;
-$kendo-dialog-buttongroup-padding-y: $actions-padding-y !default;
+$kendo-dialog-buttongroup-padding-x: $kendo-actions-padding-x !default;
+$kendo-dialog-buttongroup-padding-y: $kendo-actions-padding-y !default;
 $kendo-dialog-buttongroup-border-width: 1px !default;
 
-$kendo-dialog-button-spacing: $actions-button-spacing !default;
+$kendo-dialog-button-spacing: $kendo-actions-button-spacing !default;
 
 /// Theme colors map for the dialog.
 /// @group dialog

package/scss/draggable/_variables.scss

@@ -1,27 +1,27 @@
 // Drag hint
-$drag-clue-padding-x: $kendo-padding-md-x !default;
-$drag-clue-padding-y: $kendo-padding-md-y !default;
-$drag-clue-border-width: 1px !default;
-$drag-clue-border-radius: $kendo-border-radius-md !default;
-$drag-clue-font-size: $font-size !default;
-$drag-clue-font-family: $font-family !default;
-$drag-clue-line-height: $line-height !default;
+$kendo-drag-hint-padding-x: $kendo-padding-md-x !default;
+$kendo-drag-hint-padding-y: $kendo-padding-md-y !default;
+$kendo-drag-hint-border-width: 1px !default;
+$kendo-drag-hint-border-radius: $kendo-border-radius-md !default;
+$kendo-drag-hint-font-size: $kendo-font-size-md !default;
+$kendo-drag-hint-font-family: $kendo-font-family !default;
+$kendo-drag-hint-line-height: $kendo-line-height-md !default;
 
-$drag-clue-bg: $base-bg !default;
-$drag-clue-text: $base-text !default;
-$drag-clue-border: $base-border !default;
-$drag-clue-gradient: null !default;
-$drag-clue-shadow: null !default;
+$kendo-drag-hint-bg: $kendo-base-bg !default;
+$kendo-drag-hint-text: $kendo-base-text !default;
+$kendo-drag-hint-border: $kendo-base-border !default;
+$kendo-drag-hint-gradient: null !default;
+$kendo-drag-hint-shadow: null !default;
 
-$drag-clue-opacity: null !default;
+$kendo-drag-hint-opacity: null !default;
 
 
 // Drop hint
-$drop-hint-arrow-size: 8px !default;
-$drop-hint-arrow-spacing: k-math-div( $drop-hint-arrow-size, 2 ) !default;
-$drop-hint-line-h-width: 20px !default;
-$drop-hint-line-h-height: 1px !default;
-$drop-hint-line-v-width: $drop-hint-line-h-height !default;
-$drop-hint-line-v-height: $drop-hint-line-h-width !default;
+$kendo-drop-hint-arrow-size: 8px !default;
+$kendo-drop-hint-arrow-spacing: k-math-div( $kendo-drop-hint-arrow-size, 2 ) !default;
+$kendo-drop-hint-line-h-width: 20px !default;
+$kendo-drop-hint-line-h-height: 1px !default;
+$kendo-drop-hint-line-v-width: $kendo-drop-hint-line-h-height !default;
+$kendo-drop-hint-line-v-height: $kendo-drop-hint-line-h-width !default;
 
-$drop-hint-bg: $kendo-color-primary !default;
+$kendo-drop-hint-bg: $kendo-color-primary !default;

package/scss/drawer/_variables.scss

@@ -3,9 +3,9 @@ $kendo-drawer-bg: $kendo-component-bg !default;
 $kendo-drawer-text: $kendo-component-text !default;
 $kendo-drawer-border: $kendo-component-border !default;
 $kendo-drawer-border-width: 1px !default;
-$kendo-drawer-font-family: $font-family !default;
-$kendo-drawer-font-size: $font-size !default;
-$kendo-drawer-line-height: $line-height !default;
+$kendo-drawer-font-family: $kendo-font-family !default;
+$kendo-drawer-font-size: $kendo-font-size-md !default;
+$kendo-drawer-line-height: $kendo-line-height-md !default;
 $kendo-drawer-content-padding-x: $kendo-padding-md-x !default;
 $kendo-drawer-content-padding-y: $kendo-padding-md-y !default;
 
@@ -18,7 +18,7 @@ $kendo-drawer-scrollbar-hover-color: rgba( 156, 156, 156, 1 ) !default;
 $kendo-drawer-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 $kendo-drawer-item-padding-y: $kendo-padding-md-x !default;
 $kendo-drawer-item-font-size: 16px !default;
-$kendo-drawer-item-line-height: $line-height-lg !default;
+$kendo-drawer-item-line-height: $kendo-line-height-lg !default;
 
 $kendo-drawer-item-level-padding-x: $kendo-drawer-item-padding-x !default;
 $kendo-drawer-item-level-count: 5 !default;

package/scss/dropdowntree/_variables.scss

@@ -1,3 +1,3 @@
 // Dropdowntree
-$dropdowntree-popup-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$dropdowntree-popup-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-dropdowntree-popup-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-dropdowntree-popup-padding-y: k-map-get( $kendo-spacing, 2 ) !default;

package/scss/dropzone/_variables.scss

@@ -1,27 +1,27 @@
 // Dropzone
 
-$dropzone-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$dropzone-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$dropzone-border-width: 1px !default;
-$dropzone-min-height: 220px !default;
+$kendo-dropzone-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-dropzone-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-dropzone-border-width: 1px !default;
+$kendo-dropzone-min-height: 220px !default;
 
-$dropzone-font-family: $font-family !default;
-$dropzone-font-size: $font-size !default;
-$dropzone-line-height: $line-height !default;
+$kendo-dropzone-font-family: $kendo-font-family !default;
+$kendo-dropzone-font-size: $kendo-font-size-md !default;
+$kendo-dropzone-line-height: $kendo-line-height-md !default;
 
-$dropzone-bg: $base-bg !default;
-$dropzone-text: $base-text !default;
-$dropzone-border: $base-border !default;
+$kendo-dropzone-bg: $kendo-base-bg !default;
+$kendo-dropzone-text: $kendo-base-text !default;
+$kendo-dropzone-border: $kendo-base-border !default;
 
-$dropzone-icon-size: ( $kendo-icon-size * 3 ) !default;
-$dropzone-icon-spacing: k-map-get( $kendo-spacing, 6 ) !default;
-$dropzone-icon-text: k-try-tint( $dropzone-text, 4 ) !default;
-$dropzone-icon-hover-text: $kendo-color-primary !default;
+$kendo-dropzone-icon-size: ( $kendo-icon-size * 3 ) !default;
+$kendo-dropzone-icon-spacing: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-dropzone-icon-text: k-try-tint( $kendo-dropzone-text, 4 ) !default;
+$kendo-dropzone-icon-hover-text: $kendo-color-primary !default;
 
-$dropzone-hint-font-size: null !default;
-$dropzone-hint-spacing: k-map-get( $kendo-spacing, 2 ) !default;
-$dropzone-hint-text: null !default;
+$kendo-dropzone-hint-font-size: null !default;
+$kendo-dropzone-hint-spacing: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-dropzone-hint-text: null !default;
 
-$dropzone-note-font-size: $font-size-sm !default;
-$dropzone-note-spacing: null !default;
-$dropzone-note-text: $kendo-subtle-text !default;
+$kendo-dropzone-note-font-size: $kendo-font-size-sm !default;
+$kendo-dropzone-note-spacing: null !default;
+$kendo-dropzone-note-text: $kendo-subtle-text !default;

package/scss/editor/_variables.scss

@@ -1,8 +1,8 @@
 // Editor
 $kendo-editor-border-width: 1px !default;
-$kendo-editor-font-family: $font-family !default;
-$kendo-editor-font-size: $font-size !default;
-$kendo-editor-line-height: $line-height !default;
+$kendo-editor-font-family: $kendo-font-family !default;
+$kendo-editor-font-size: $kendo-font-size-md !default;
+$kendo-editor-line-height: $kendo-line-height-md !default;
 
 $kendo-editor-placeholder-text: $kendo-input-placeholder-text !default;
 $kendo-editor-placeholder-opacity: $kendo-input-placeholder-opacity !default;