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

package/scss/chip/_variables.scss

@@ -1,3 +1,6 @@
+@import "../button/_variables.scss";
+
+
 // Chip
 
 /// Width of the border around the button.
@@ -5,21 +8,21 @@
 $kendo-chip-border-width: 1px !default;
 /// The spacing between the text and the icons of the chip.
 /// @group chip
-$kendo-chip-spacing: k-map-get( $spacing, 1 ) !default;
+$kendo-chip-spacing: k-map-get( $kendo-spacing, 1 ) !default;
 
 /// Horizontal padding of the chip.
 /// @group chip
-$kendo-chip-padding-x: k-map-get( $spacing, 1 ) !default;
-$kendo-chip-padding-x-sm: k-map-get( $spacing, 1 ) !default;
-$kendo-chip-padding-x-md: k-map-get( $spacing, 1 ) !default;
-$kendo-chip-padding-x-lg: k-map-get( $spacing, 1 ) !default;
+$kendo-chip-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-chip-padding-x-sm: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-chip-padding-x-md: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-chip-padding-x-lg: k-map-get( $kendo-spacing, 1 ) !default;
 
 /// Vertical padding of the chip.
 /// @group chip
-$kendo-chip-padding-y: k-map-get( $spacing, 1 ) !default;
-$kendo-chip-padding-y-sm: k-map-get( $spacing, 1 ) - k-map-get( $spacing, thin )  !default;
-$kendo-chip-padding-y-md: k-map-get( $spacing, 1 ) !default;
-$kendo-chip-padding-y-lg: k-map-get( $spacing, 1 ) + k-map-get( $spacing, thin ) !default;
+$kendo-chip-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-chip-padding-y-sm: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-chip-padding-y-md: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-chip-padding-y-lg: k-map-get( $kendo-spacing, 1.5 ) !default;
 
 /// Font sizes of the chip.
 /// @group chip
@@ -35,6 +38,11 @@ $kendo-chip-line-height-sm: $kendo-chip-line-height !default;
 $kendo-chip-line-height-md: $kendo-chip-line-height !default;
 $kendo-chip-line-height-lg: $kendo-chip-line-height !default;
 
+/// Calculated height of the chip.
+/// @group chip
+$kendo-chip-calc-size: calc( #{$kendo-chip-line-height * 1em} + #{$kendo-chip-padding-y * 2} + #{$kendo-chip-border-width * 2} ) !default;
+$kendo-chip-calc-size-sm: calc( #{$kendo-chip-line-height-sm * 1em} + #{$kendo-chip-padding-y-sm * 2} + #{$kendo-chip-border-width * 2} ) !default;
+
 /// Sizes map for the chip.
 /// @group chip
 $kendo-chip-sizes: (
@@ -83,7 +91,7 @@ $kendo-chip-solid-text: $kendo-button-text !default;
 $kendo-chip-solid-border: $kendo-button-border !default;
 /// The base shadow of solid chip.
 /// @group chip
-$kendo-chip-solid-shadow: 0 0 0 2px if($dark-theme, rgba( 255, 255, 255, .16 ), rgba( 0, 0, 0, .16 )) !default;
+$kendo-chip-solid-shadow: 0 0 0 2px if( $dark-theme, rgba( $kendo-color-white, .16 ), rgba( $kendo-color-black, .16 ) ) !default;
 /// The base gradient of solid chip.
 /// @group chip
 $kendo-chip-solid-gradient: $kendo-button-gradient !default;
@@ -111,7 +119,7 @@ $kendo-chip-solid-selected-text: null !default;
 
 /// The base background color of outline chip.
 /// @group chip
-$kendo-chip-outline-bg: $component-bg !default;
+$kendo-chip-outline-bg: $kendo-component-bg !default;
 /// The base text color of outline chip.
 /// @group chip
 $kendo-chip-outline-text: $kendo-chip-solid-text !default;
@@ -120,14 +128,14 @@ $kendo-chip-outline-text: $kendo-chip-solid-text !default;
 $kendo-chip-outline-border: $kendo-chip-outline-text !default;
 /// The base shadow of outline chip.
 /// @group chip
-$kendo-chip-outline-shadow: 0 0 0 2px if($dark-theme, rgba( 255, 255, 255, .16 ), rgba( 0, 0, 0, .16 )) !default;
+$kendo-chip-outline-shadow: 0 0 0 2px if( $dark-theme, rgba( $kendo-color-white, .16 ), rgba( $kendo-color-black, .16 ) ) !default;
 
 /// The base background color of hovered outline chip.
 /// @group chip
 $kendo-chip-outline-hover-bg: $kendo-chip-outline-text !default;
 /// The base text color of hovered outline chip.
 /// @group chip
-$kendo-chip-outline-hover-text: contrast-wcag( $kendo-chip-outline-hover-bg ) !default;
+$kendo-chip-outline-hover-text: k-contrast-legacy( $kendo-chip-outline-hover-bg ) !default;
 
 /// The base background color of selected outline chip.
 /// @group chip
@@ -141,7 +149,7 @@ $kendo-chip-outline-selected-text: $kendo-chip-outline-hover-text !default;
 /// The sizes of the chip list.
 /// @group chip
 $kendo-chip-list-sizes: (
-    sm: k-map-get( $spacing, 1 ),
-    md: k-map-get( $spacing, 1 ),
-    lg: k-map-get( $spacing, 1 )
+    sm: k-map-get( $kendo-spacing, 1 ),
+    md: k-map-get( $kendo-spacing, 1 ),
+    lg: k-map-get( $kendo-spacing, 1 )
 ) !default;

package/scss/color-preview/_index.scss

@@ -6,6 +6,6 @@
 
 // Component
 @import "../colorgradient/images/alpha-slider-bgr.scss";
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/color-preview/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/color-preview/_layout.scss";
+@import "@progress/kendo-theme-default/scss/color-preview/_layout.scss";

package/scss/color-preview/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/color-preview/_theme.scss";
+@import "@progress/kendo-theme-default/scss/color-preview/_theme.scss";

package/scss/color-preview/_variables.scss

@@ -3,12 +3,12 @@ $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: $component-border !default;
-$color-preview-hover-border: $hovered-border !default;
+$color-preview-border: $kendo-component-border !default;
+$color-preview-hover-border: $kendo-hover-border !default;
 
-$color-preview-no-color-bg: $white !default;
-$color-preview-no-color-text: $error !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;
 
-$color-preview-no-color-image: 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-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;

package/scss/coloreditor/_index.scss

@@ -10,6 +10,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/coloreditor/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/coloreditor/_layout.scss";
+@import "@progress/kendo-theme-default/scss/coloreditor/_layout.scss";

package/scss/coloreditor/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/coloreditor/_theme.scss";
+@import "@progress/kendo-theme-default/scss/coloreditor/_theme.scss";

package/scss/coloreditor/_variables.scss

@@ -1,5 +1,5 @@
 // Coloreditor/FlatColorPicker
-$coloreditor-spacer: k-map-get( $spacing, 3 ) !default;
+$coloreditor-spacer: k-map-get( $kendo-spacing, 3 ) !default;
 
 $coloreditor-min-width: 272px !default;
 $coloreditor-border-width: 1px !default;
@@ -7,9 +7,9 @@ $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: $component-bg !default;
-$coloreditor-text: $component-text !default;
-$coloreditor-border: $component-border !default;
+$coloreditor-bg: $kendo-component-bg !default;
+$coloreditor-text: $kendo-component-text !default;
+$coloreditor-border: $kendo-component-border !default;
 
 $coloreditor-focus-border: null !default;
 $coloreditor-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
@@ -18,7 +18,7 @@ $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;
 
-$coloreditor-preview-gap: k-map-get( $spacing, 1 ) !default;
+$coloreditor-preview-gap: k-map-get( $kendo-spacing, 1 ) !default;
 $coloreditor-color-preview-width: 32px !default;
 $coloreditor-color-preview-height: 12px !default;
 

package/scss/colorgradient/_index.scss

@@ -3,8 +3,8 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../utils/_flex.scss";
-@import "../utils/_spacer.scss";
+// @import "../utils/_flex.scss";
+// @import "../utils/_spacer.scss";
 @import "../icons/_index.scss";
 @import "../button/_index.scss";
 @import "../slider/_index.scss";
@@ -13,7 +13,7 @@
 
 
 // Component
-@import "images/alpha-slider-bgr.scss";
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./images/alpha-slider-bgr.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/colorgradient/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorgradient/_layout.scss";
+@import "@progress/kendo-theme-default/scss/colorgradient/_layout.scss";

package/scss/colorgradient/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorgradient/_theme.scss";
+@import "@progress/kendo-theme-default/scss/colorgradient/_theme.scss";

package/scss/colorgradient/_variables.scss

@@ -1,5 +1,5 @@
 // ColorGradient
-$colorgradient-spacer: k-map-get( $spacing, 3 ) !default;
+$colorgradient-spacer: k-map-get( $kendo-spacing, 3 ) !default;
 
 $colorgradient-width: 272px !default;
 $colorgradient-border-width: 1px !default;
@@ -10,9 +10,9 @@ $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: $component-bg !default;
-$colorgradient-text: $component-text !default;
-$colorgradient-border: $component-border !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;
@@ -46,7 +46,7 @@ $colorgradient-canvas-draghandle-margin-x: - k-math-div( $colorgradient-draghand
 $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: $subtle-text !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;

package/scss/colorpalette/_index.scss

@@ -3,10 +3,10 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../utils/_flex.scss";
+// @import "../utils/_flex.scss";
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/colorpalette/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorpalette/_layout.scss";
+@import "@progress/kendo-theme-default/scss/colorpalette/_layout.scss";

package/scss/colorpalette/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorpalette/_theme.scss";
+@import "@progress/kendo-theme-default/scss/colorpalette/_theme.scss";

package/scss/colorpalette/_variables.scss

@@ -3,7 +3,7 @@ $colorpalette-font-family: $font-family !default;
 $colorpalette-font-size: $font-size !default;
 $colorpalette-line-height: 0 !default;
 
-$colorpalette-tile-width: k-map-get( $spacing, 6 ) !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;

package/scss/colorpicker/_index.scss

@@ -10,6 +10,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/colorpicker/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorpicker/_layout.scss";
+@import "@progress/kendo-theme-default/scss/colorpicker/_layout.scss";

package/scss/colorpicker/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/colorpicker/_theme.scss";
+@import "@progress/kendo-theme-default/scss/colorpicker/_theme.scss";

package/scss/combobox/_index.scss

@@ -11,6 +11,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/combobox/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/combobox/_layout.scss";
+@import "@progress/kendo-theme-default/scss/combobox/_layout.scss";

package/scss/combobox/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/combobox/_theme.scss";
+@import "@progress/kendo-theme-default/scss/combobox/_theme.scss";

package/scss/common/_animations.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/common/_animations.scss";
+@import "@progress/kendo-theme-default/scss/common/_animations.scss";

package/scss/common/_base.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/common/_base.scss";
+@import "@progress/kendo-theme-default/scss/common/_base.scss";

package/scss/common/_index.scss

@@ -1,9 +1,5 @@
-@import "../typography/_variables.scss";
-
-@import "_base.scss";
-@import "_animations.scss";
-@import "_dragdrop.scss";
-@import "_loading.scss";
-@import "_resizing.scss";
-@import "_scrollbar.scss";
-@import "_selection.scss";
+@import "./_base.scss";
+@import "./_animations.scss";
+@import "./_resizing.scss";
+@import "./_scrollbar.scss";
+@import "./_selection.scss";

package/scss/common/_resizing.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/common/_resizing.scss";
+@import "@progress/kendo-theme-default/scss/common/_resizing.scss";

package/scss/common/_scrollbar.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/common/_scrollbar.scss";
+@import "@progress/kendo-theme-default/scss/common/_scrollbar.scss";

package/scss/common/_selection.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/common/_selection.scss";
+@import "@progress/kendo-theme-default/scss/common/_selection.scss";

package/scss/core/_index.scss

@@ -1,9 +1,19 @@
-@import "functions/_index.scss";
-@import "mixins/_index.scss";
-@import "../_variables.scss";
+$wcag-min-contrast-ratio: 4.5 !default;
+
+// Functions
+@import "./functions/index.import.scss";
+
+// Color system
+@import "./color-system/index.import.scss";
+
+// Mixins
+@import "./mixins/index.import.scss";
 
-@import "_asp-fallback.scss";
-@import "_normalize.scss";
-@import "_extra.scss";
-@import "_layout.scss";
-@import "_color-system.scss";
+// Module system
+@import "./module-system/index.import.scss";
+
+// Common styles
+@import "./styles/index.import.scss";
+
+// Variables
+@import "../_variables.scss";

package/scss/core/color-system/index.import.scss

@@ -0,0 +1 @@
+@import "@progress/kendo-theme-core/scss/color-system/index.import.scss";

package/scss/core/functions/index.import.scss

@@ -0,0 +1 @@
+@import "@progress/kendo-theme-core/scss/functions/index.import.scss";

package/scss/core/mixins/index.import.scss

@@ -0,0 +1 @@
+@import "@progress/kendo-theme-core/scss/mixins/index.import.scss";

package/scss/core/module-system/index.import.scss

@@ -0,0 +1 @@
+@import "@progress/kendo-theme-core/scss/module-system/index.import.scss";

package/scss/core/styles/index.import.scss

@@ -0,0 +1 @@
+@import "@progress/kendo-theme-core/scss/styles/index.import.scss";

package/scss/dataviz/_index.scss

@@ -5,10 +5,9 @@
 @import "../common/_index.scss";
 @import "../popup/_index.scss";
 @import "../tooltip/_index.scss";
-@import "../button/_variables.scss";
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/dataviz/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dataviz/_layout.scss";
+@import "@progress/kendo-theme-default/scss/dataviz/_layout.scss";

package/scss/dataviz/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dataviz/_theme.scss";
+@import "@progress/kendo-theme-default/scss/dataviz/_theme.scss";

package/scss/dataviz/_variables.scss

@@ -1,4 +1,8 @@
+@import "../button/_variables.scss";
+
+
 // Chart
+
 /// The first base series color and its light and dark shades.
 /// @group charts
 $series-a: #ff6358 !default;
@@ -94,38 +98,39 @@ $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;
 
-$chart-inactive: rgba( $body-text, .5 ) !default;
-
 /// The color of the Chart grid lines (major).
 /// @group charts
-$chart-major-lines: rgba( if( $dark-theme, $white, $black ), .08 ) !default;
+$chart-major-lines: rgba( if( $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, $white, $black ), .04 ) !default;
+$chart-minor-lines: rgba( if( $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;
 
-$chart-bg: $component-bg !default;
-$chart-text: $component-text !default;
-$chart-border: $component-border !default;
+$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;
 
-$chart-crosshair-background: rgba( if( $dark-theme, $white, $black ), .5 ) !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, $white, $black ), .08) !default;
+$chart-crosshair-shared-tooltip-border: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .08) !default;
 
-$chart-notes-background: rgba( if( $dark-theme, $white, $black ), .5 ) !default;
-$chart-notes-border: rgba( if( $dark-theme, $white, $black ), .5 ) !default;
-$chart-notes-lines: rgba( if( $dark-theme, $white, $black ), .5 ) !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;
 
-$error-bars-background: rgba( if( $dark-theme, $white, $black ), .5 ) !default;
+$error-bars-background: rgba( if( $dark-theme, $kendo-color-white, $kendo-color-black ), .5 ) !default;
 
 $selection-handle-size: 22px !default;
-$selection-border-color: rgba( if( $dark-theme, $white, $black ), .08 ) !default;
-$selection-shadow: inset 0 1px 7px rgba( if( $dark-theme, $white, $black ), .15) !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;
 
 
 // TreeMap

package/scss/dateinput/_index.scss

@@ -6,6 +6,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/dateinput/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dateinput/_layout.scss";
+@import "@progress/kendo-theme-default/scss/dateinput/_layout.scss";

package/scss/dateinput/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dateinput/_theme.scss";
+@import "@progress/kendo-theme-default/scss/dateinput/_theme.scss";

package/scss/datepicker/_index.scss

@@ -8,6 +8,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/datepicker/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/datepicker/_layout.scss";
+@import "@progress/kendo-theme-default/scss/datepicker/_layout.scss";

package/scss/datepicker/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/datepicker/_theme.scss";
+@import "@progress/kendo-theme-default/scss/datepicker/_theme.scss";

package/scss/daterangepicker/_index.scss

@@ -10,6 +10,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/daterangepicker/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/daterangepicker/_layout.scss";
+@import "@progress/kendo-theme-default/scss/daterangepicker/_layout.scss";

package/scss/daterangepicker/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/daterangepicker/_theme.scss";
+@import "@progress/kendo-theme-default/scss/daterangepicker/_theme.scss";

package/scss/datetimepicker/_index.scss

@@ -12,6 +12,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/datetimepicker/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/datetimepicker/_layout.scss";
+@import "@progress/kendo-theme-default/scss/datetimepicker/_layout.scss";

package/scss/datetimepicker/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/datetimepicker/_theme.scss";
+@import "@progress/kendo-theme-default/scss/datetimepicker/_theme.scss";

package/scss/dialog/_index.scss

@@ -7,6 +7,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/dialog/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dialog/_layout.scss";
+@import "@progress/kendo-theme-default/scss/dialog/_layout.scss";

package/scss/dialog/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/dialog/_theme.scss";
+@import "@progress/kendo-theme-default/scss/dialog/_theme.scss";

package/scss/dialog/_variables.scss

@@ -1,10 +1,18 @@
 // Dialog
-$dialog-titlebar-bg: null !default;
-$dialog-titlebar-text: null !default;
-$dialog-titlebar-border: null !default;
+$kendo-dialog-titlebar-bg: null !default;
+$kendo-dialog-titlebar-text: null !default;
+$kendo-dialog-titlebar-border: null !default;
 
-$dialog-buttongroup-padding-x: $actions-padding-x !default;
-$dialog-buttongroup-padding-y: $actions-padding-y !default;
-$dialog-buttongroup-border-width: 1px !default;
+$kendo-dialog-buttongroup-padding-x: $actions-padding-x !default;
+$kendo-dialog-buttongroup-padding-y: $actions-padding-y !default;
+$kendo-dialog-buttongroup-border-width: 1px !default;
 
-$dialog-button-spacing: $actions-button-spacing !default;
+$kendo-dialog-button-spacing: $actions-button-spacing !default;
+
+/// Theme colors map for the dialog.
+/// @group dialog
+$kendo-dialog-theme-colors: (
+    "primary": k-map-get($kendo-theme-colors, "primary"),
+    "light": k-map-get($kendo-theme-colors, "light"),
+    "dark": k-map-get($kendo-theme-colors, "dark")
+) !default;