@progress/kendo-theme-material 5.12.1-dev.1 → 5.12.1-dev.3

package/scss/listgroup/_variables.scss

@@ -1,14 +1,14 @@
 // Listgroup
-$listgroup-border-width: 1px !default;
-$listgroup-border-radius: $kendo-border-radius-md !default;
+$kendo-listgroup-border-width: 1px !default;
+$kendo-listgroup-border-radius: $kendo-border-radius-md !default;
 
-$listgroup-font-size: $font-size !default;
-$listgroup-line-height: k-math-div( 20, 14 ) !default;
+$kendo-listgroup-font-size: $kendo-font-size-md !default;
+$kendo-listgroup-line-height: k-math-div( 20, 14 ) !default;
 
-$listgroup-bg: $kendo-component-bg !default;
-$listgroup-text: $kendo-component-text !default;
-$listgroup-border: $kendo-component-border !default;
+$kendo-listgroup-bg: $kendo-component-bg !default;
+$kendo-listgroup-text: $kendo-component-text !default;
+$kendo-listgroup-border: $kendo-component-border !default;
 
-$listgroup-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$listgroup-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$listgroup-item-border-width: 1px !default;
+$kendo-listgroup-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-listgroup-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-listgroup-item-border-width: 1px !default;

package/scss/listview/_index.scss

@@ -3,8 +3,8 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../utils/_flex.scss";
-@import "../utils/_grid.scss";
+// @import "../utils/_flex.scss";
+// @import "../utils/_grid.scss";
 @import "../pager/_index.scss";
 @import "../icons/_index.scss";
 

package/scss/listview/_variables.scss

@@ -2,9 +2,9 @@
 $kendo-listview-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-listview-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-listview-border-width: 1px !default;
-$kendo-listview-font-family: $font-family !default;
-$kendo-listview-font-size: $font-size !default;
-$kendo-listview-line-height: $line-height !default;
+$kendo-listview-font-family: $kendo-font-family !default;
+$kendo-listview-font-size: $kendo-font-size-md !default;
+$kendo-listview-line-height: $kendo-line-height-md !default;
 
 $kendo-listview-bg: $kendo-component-bg !default;
 $kendo-listview-text: $kendo-component-text !default;

package/scss/loader/_variables.scss

@@ -1,26 +1,27 @@
 // Loader
+
 $kendo-loader-segment-border-radius: 50% !default;
-$kendo-loader-segment-size-sm: k-map-get( $kendo-spacing, 1 ) !default;
-$kendo-loader-segment-size-md: k-map-get( $kendo-spacing, 2 ) !default;
-$kendo-loader-segment-size-lg: k-map-get( $kendo-spacing, 4 ) !default;
-
-$kendo-loader-padding-sm: k-math-div( $kendo-loader-segment-size-sm, 2 ) !default;
-$kendo-loader-padding-md: k-math-div( $kendo-loader-segment-size-md, 2 ) !default;
-$kendo-loader-padding-lg: k-math-div( $kendo-loader-segment-size-lg, 2 ) !default;
-
-$kendo-loader-spinner-3-width-sm: ( $kendo-loader-segment-size-sm * 4 ) !default;
-$kendo-loader-spinner-3-height-sm: ( $kendo-loader-spinner-3-width-sm * $equilateral-height ) !default;
-$kendo-loader-spinner-3-width-md: ( $kendo-loader-segment-size-md * 4 ) !default;
-$kendo-loader-spinner-3-height-md: ( $kendo-loader-spinner-3-width-md * $equilateral-height ) !default;
-$kendo-loader-spinner-3-width-lg: ( $kendo-loader-segment-size-lg * 4 ) !default;
-$kendo-loader-spinner-3-height-lg: ( $kendo-loader-spinner-3-width-lg * $equilateral-height ) !default;
-
-$kendo-loader-spinner-4-width-sm: $kendo-loader-segment-size-sm * 4 !default;
-$kendo-loader-spinner-4-height-sm: $kendo-loader-spinner-4-width-sm !default;
-$kendo-loader-spinner-4-width-md: $kendo-loader-segment-size-md * 4 !default;
-$kendo-loader-spinner-4-height-md: $kendo-loader-spinner-4-width-md !default;
-$kendo-loader-spinner-4-width-lg: $kendo-loader-segment-size-lg * 4 !default;
-$kendo-loader-spinner-4-height-lg: $kendo-loader-spinner-4-width-lg !default;
+$kendo-loader-sm-segment-size: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-loader-md-segment-size: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-loader-lg-segment-size: k-map-get( $kendo-spacing, 4 ) !default;
+
+$kendo-loader-sm-padding: k-math-div( $kendo-loader-sm-segment-size, 2 ) !default;
+$kendo-loader-md-padding: k-math-div( $kendo-loader-md-segment-size, 2 ) !default;
+$kendo-loader-lg-padding: k-math-div( $kendo-loader-lg-segment-size, 2 ) !default;
+
+$kendo-loader-sm-spinner-3-width: ( $kendo-loader-sm-segment-size * 4 ) !default;
+$kendo-loader-sm-spinner-3-height: ( $kendo-loader-sm-spinner-3-width * $equilateral-height ) !default;
+$kendo-loader-md-spinner-3-width: ( $kendo-loader-md-segment-size * 4 ) !default;
+$kendo-loader-md-spinner-3-height: ( $kendo-loader-md-spinner-3-width * $equilateral-height ) !default;
+$kendo-loader-lg-spinner-3-width: ( $kendo-loader-lg-segment-size * 4 ) !default;
+$kendo-loader-lg-spinner-3-height: ( $kendo-loader-lg-spinner-3-width * $equilateral-height ) !default;
+
+$kendo-loader-sm-spinner-4-width: $kendo-loader-sm-segment-size * 4 !default;
+$kendo-loader-sm-spinner-4-height: $kendo-loader-sm-spinner-4-width !default;
+$kendo-loader-md-spinner-4-width: $kendo-loader-md-segment-size * 4 !default;
+$kendo-loader-md-spinner-4-height: $kendo-loader-md-spinner-4-width !default;
+$kendo-loader-lg-spinner-4-width: $kendo-loader-lg-segment-size * 4 !default;
+$kendo-loader-lg-spinner-4-height: $kendo-loader-lg-spinner-4-width !default;
 
 $kendo-loader-secondary-bg: #000000 !default;
 
@@ -30,17 +31,17 @@ $kendo-loader-container-panel-border-color: $kendo-component-border !default;
 $kendo-loader-container-panel-border-radius: $kendo-border-radius-md !default;
 $kendo-loader-container-panel-bg: $kendo-color-white !default;
 
-$kendo-loader-container-padding-sm: k-map-get( $kendo-spacing, 4 ) !default;
-$kendo-loader-container-gap-sm: k-map-get( $kendo-spacing, 1 ) !default;
-$kendo-loader-container-font-size-sm: $font-size-sm !default;
+$kendo-loader-sm-container-padding: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-loader-sm-container-gap: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-loader-sm-container-font-size: $kendo-font-size-sm !default;
 
-$kendo-loader-container-padding-md: k-map-get( $kendo-spacing, 5 ) !default;
-$kendo-loader-container-gap-md: k-map-get( $kendo-spacing, 2 ) !default;
-$kendo-loader-container-font-size-md: $font-size-md !default;
+$kendo-loader-md-container-padding: k-map-get( $kendo-spacing, 5 ) !default;
+$kendo-loader-md-container-gap: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-loader-md-container-font-size: $kendo-font-size-md !default;
 
-$kendo-loader-container-padding-lg: k-map-get( $kendo-spacing, 6 ) !default;
-$kendo-loader-container-gap-lg: k-map-get( $kendo-spacing, 3 ) !default;
-$kendo-loader-container-font-size-lg: $font-size-lg !default;
+$kendo-loader-lg-container-padding: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-loader-lg-container-gap: k-map-get( $kendo-spacing, 3 ) !default;
+$kendo-loader-lg-container-font-size: $kendo-font-size-lg !default;
 
 
 // Loading

package/scss/map/_index.scss

@@ -3,7 +3,7 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../utils/_position.scss";
+// @import "../utils/_position.scss";
 @import "../button/_index.scss";
 @import "../scroller/_index.scss";
 @import "../icons/_index.scss";

package/scss/map/_variables.scss

@@ -1,28 +1,28 @@
 // Map
-$map-border-width: 0px !default;
+$kendo-map-border-width: 0px !default;
 
-$map-font-size: $font-size !default;
-$map-line-height: $line-height !default;
-$map-font-family: $font-family !default;
+$kendo-map-font-size: $kendo-font-size-md !default;
+$kendo-map-line-height: $kendo-line-height-md !default;
+$kendo-map-font-family: $kendo-font-family !default;
 
-$map-bg: $kendo-component-bg !default;
-$map-text: $kendo-component-text !default;
-$map-border: $kendo-component-border !default;
+$kendo-map-bg: $kendo-component-bg !default;
+$kendo-map-text: $kendo-component-text !default;
+$kendo-map-border: $kendo-component-border !default;
 
-$map-navigator-margin: $spacer-x !default;
-$map-navigator-padding: 2px !default;
-$map-navigator-width: calc( #{$icon-size * 3} + #{$map-navigator-padding * 2} ) !default;
-$map-navigator-height: $map-navigator-width !default;
-$map-navigator-border-width: 1px !default;
+$kendo-map-navigator-margin: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-map-navigator-padding: 2px !default;
+$kendo-map-navigator-width: calc( #{$kendo-icon-size * 3} + #{$kendo-map-navigator-padding * 2} ) !default;
+$kendo-map-navigator-height: $kendo-map-navigator-width !default;
+$kendo-map-navigator-border-width: 1px !default;
 
-$map-zoom-control-margin: $spacer-x !default;
-$map-zoom-control-button-padding-x: $kendo-button-padding-y !default;
-$map-zoom-control-button-padding-y: $map-zoom-control-button-padding-x !default;
+$kendo-map-zoom-control-margin: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-map-zoom-control-button-padding-x: $kendo-button-padding-y !default;
+$kendo-map-zoom-control-button-padding-y: $kendo-map-zoom-control-button-padding-x !default;
 
-$map-attribution-padding-x: $kendo-padding-sm-x !default;
-$map-attribution-padding-y: $kendo-padding-sm-y !default;
-$map-attribution-font-size: ($map-font-size * .75) !default;
-$map-attribution-bg: rgba( $map-bg, .8 ) !default;
+$kendo-map-attribution-padding-x: $kendo-padding-sm-x !default;
+$kendo-map-attribution-padding-y: $kendo-padding-sm-y !default;
+$kendo-map-attribution-font-size: ($kendo-map-font-size * .75) !default;
+$kendo-map-attribution-bg: rgba( $kendo-map-bg, .8 ) !default;
 
-$map-marker-size: $icon-size-lg !default;
-$map-marker-fill: $kendo-color-primary !default;
+$kendo-map-marker-size: $kendo-icon-size-xxl !default;
+$kendo-map-marker-fill: $kendo-color-primary !default;

package/scss/mediaplayer/_variables.scss

@@ -1,16 +1,16 @@
 // Media player
-$mediaplayer-border-width: 1px !default;
-$mediaplayer-font-family: $font-family !default;
-$mediaplayer-font-size: $font-size !default;
-$mediaplayer-line-height: $line-height !default;
+$kendo-media-player-border-width: 1px !default;
+$kendo-media-player-font-family: $kendo-font-family !default;
+$kendo-media-player-font-size: $kendo-font-size-md !default;
+$kendo-media-player-line-height: $kendo-line-height-md !default;
 
-$mediaplayer-bg: $kendo-component-bg !default;
-$mediaplayer-text: $kendo-component-text !default;
-$mediaplayer-border: $kendo-component-border !default;
+$kendo-media-player-bg: $kendo-component-bg !default;
+$kendo-media-player-text: $kendo-component-text !default;
+$kendo-media-player-border: $kendo-component-border !default;
 
-$mediaplayer-titlebar-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$mediaplayer-titlebar-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$mediaplayer-titlebar-bg: null !default;
-$mediaplayer-titlebar-text: $mediaplayer-bg !default;
-$mediaplayer-titlebar-border: null !default;
-$mediaplayer-titlebar-gradient: rgba( $mediaplayer-text, .7 ), rgba( $mediaplayer-text, 0 ) !default;
+$kendo-media-player-titlebar-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-media-player-titlebar-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-media-player-titlebar-bg: null !default;
+$kendo-media-player-titlebar-text: $kendo-media-player-bg !default;
+$kendo-media-player-titlebar-border: null !default;
+$kendo-media-player-titlebar-gradient: rgba( $kendo-media-player-text, .7 ), rgba( $kendo-media-player-text, 0 ) !default;

package/scss/menu/_layout.scss

@@ -18,11 +18,11 @@
         }
 
         &.horizontal .k-menu-scroll-button {
-            width: calc( #{$line-height-em} + #{k-map-get( $kendo-spacing, 1 )});
+            width: calc( #{$kendo-line-height-em} + #{k-map-get( $kendo-spacing, 1 )});
         }
 
         &.vertical .k-menu-scroll-button {
-            height: calc( #{$line-height-em} + #{k-map-get( $kendo-spacing, 1 )});
+            height: calc( #{$kendo-line-height-em} + #{k-map-get( $kendo-spacing, 1 )});
         }
     }
 }

package/scss/menu/_theme.scss

@@ -11,10 +11,10 @@
             &:focus,
             &.k-focus {
                 @include fill(
-                    $menu-item-hover-text,
-                    $menu-item-hover-bg,
-                    $menu-item-hover-border,
-                    $menu-item-hover-gradient
+                    $kendo-menu-item-hover-text,
+                    $kendo-menu-item-hover-bg,
+                    $kendo-menu-item-hover-border,
+                    $kendo-menu-item-hover-gradient
                 );
             }
 

package/scss/menu/_variables.scss

@@ -1,49 +1,49 @@
 // Menu
-$menu-padding-x: 0px !default;
-$menu-padding-y: 0px !default;
-$menu-border-width: 0px !default;
-$menu-font-family: $font-family !default;
-$menu-font-size: $font-size !default;
-$menu-line-height: $line-height !default;
+$kendo-menu-padding-x: 0px !default;
+$kendo-menu-padding-y: 0px !default;
+$kendo-menu-border-width: 0px !default;
+$kendo-menu-font-family: $kendo-font-family !default;
+$kendo-menu-font-size: $kendo-font-size-md !default;
+$kendo-menu-line-height: $kendo-line-height-md !default;
 
-$menu-bg: transparent !default;
-$menu-text: $kendo-component-text !default;
-$menu-border: null !default;
-$menu-gradient: null !default;
+$kendo-menu-bg: transparent !default;
+$kendo-menu-text: $kendo-component-text !default;
+$kendo-menu-border: null !default;
+$kendo-menu-gradient: null !default;
 
-$menu-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
-$menu-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
-$menu-item-spacing: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
-$menu-item-icon-spacing: $icon-spacing !default;
+$kendo-menu-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-menu-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-menu-item-spacing: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-menu-item-icon-spacing: $kendo-icon-spacing !default;
 
-$menu-item-bg: rgba( $menu-text, 0 ) !default;
-$menu-item-text: null !default;
-$menu-item-border: null !default;
-$menu-item-gradient: null !default;
+$kendo-menu-item-bg: rgba( $kendo-menu-text, 0 ) !default;
+$kendo-menu-item-text: null !default;
+$kendo-menu-item-border: null !default;
+$kendo-menu-item-gradient: null !default;
 
-$menu-item-hover-bg: rgba( $menu-text, $kendo-flat-button-hover-opacity * k-color-alpha( $menu-text ) ) !default;
-$menu-item-hover-text: null !default;
-$menu-item-hover-border: null !default;
-$menu-item-hover-gradient: null !default;
+$kendo-menu-item-hover-bg: rgba( $kendo-menu-text, $kendo-flat-button-hover-opacity * k-color-alpha( $kendo-menu-text ) ) !default;
+$kendo-menu-item-hover-text: null !default;
+$kendo-menu-item-hover-border: null !default;
+$kendo-menu-item-hover-gradient: null !default;
 
-$menu-item-expanded-bg: rgba( $menu-text, $kendo-flat-button-active-opacity * k-color-alpha( $menu-text ) ) !default;
-$menu-item-expanded-text: null !default;
-$menu-item-expanded-border: null !default;
-$menu-item-expanded-gradient: null !default;
+$kendo-menu-item-expanded-bg: rgba( $kendo-menu-text, $kendo-flat-button-active-opacity * k-color-alpha( $kendo-menu-text ) ) !default;
+$kendo-menu-item-expanded-text: null !default;
+$kendo-menu-item-expanded-border: null !default;
+$kendo-menu-item-expanded-gradient: null !default;
 
-$menu-item-focus-shadow: null !default;
+$kendo-menu-item-focus-shadow: null !default;
 
-$menu-separator-spacing: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-menu-separator-spacing: k-map-get( $kendo-spacing, 1 ) !default;
 
-$menu-scroll-button-bg: $kendo-component-bg !default;
-$menu-scroll-button-text: $kendo-subtle-text !default;
-$menu-scroll-button-border: transparent !default;
-$menu-scroll-button-gradient: null !default;
+$kendo-menu-scroll-button-bg: $kendo-component-bg !default;
+$kendo-menu-scroll-button-text: $kendo-subtle-text !default;
+$kendo-menu-scroll-button-border: transparent !default;
+$kendo-menu-scroll-button-gradient: null !default;
 
-$menu-scroll-button-hover-bg: null !default;
-$menu-scroll-button-hover-text: $menu-text !default;
-$menu-scroll-button-hover-border: null !default;
-$menu-scroll-button-hover-gradient: null !default;
+$kendo-menu-scroll-button-hover-bg: null !default;
+$kendo-menu-scroll-button-hover-text: $kendo-menu-text !default;
+$kendo-menu-scroll-button-hover-border: null !default;
+$kendo-menu-scroll-button-hover-gradient: null !default;
 
 
 // Menu popup
@@ -58,31 +58,31 @@ $kendo-menu-popup-padding-y: null !default;
 
 /// Width of the border around the menu popup.
 /// @group menu
-$kendo-menu-popup-border-width: $popup-border-width !default;
+$kendo-menu-popup-border-width: $kendo-popup-border-width !default;
 
 /// Font sizes of the menu popup.
 /// @group menu
-$kendo-menu-popup-font-size: $font-size-lg !default;
-$kendo-menu-popup-font-size-sm: $font-size-lg !default;
-$kendo-menu-popup-font-size-md: $font-size-lg !default;
-$kendo-menu-popup-font-size-lg: $font-size-lg !default;
+$kendo-menu-popup-font-size: $kendo-font-size-lg !default;
+$kendo-menu-popup-sm-font-size: $kendo-font-size-lg !default;
+$kendo-menu-popup-md-font-size: $kendo-font-size-lg !default;
+$kendo-menu-popup-lg-font-size: $kendo-font-size-lg !default;
 
-/// Line heights used along with $font-size.
+/// Line heights used along with $kendo-font-size.
 /// @group menu
 $kendo-menu-popup-line-height: 1.25 !default;
-$kendo-menu-popup-line-height-sm: 1.25 !default;
-$kendo-menu-popup-line-height-md: 1.25 !default;
-$kendo-menu-popup-line-height-lg: 1.25 !default;
+$kendo-menu-popup-sm-line-height: 1.25 !default;
+$kendo-menu-popup-md-line-height: 1.25 !default;
+$kendo-menu-popup-lg-line-height: 1.25 !default;
 
 /// The background of the menu popup.
 /// @group menu
-$kendo-menu-popup-bg: $popup-bg !default;
+$kendo-menu-popup-bg: $kendo-popup-bg !default;
 /// The text color of the menu popup.
 /// @group menu
-$kendo-menu-popup-text: $popup-text !default;
+$kendo-menu-popup-text: $kendo-popup-text !default;
 /// The border color of the menu popup.
 /// @group menu
-$kendo-menu-popup-border: $popup-border !default;
+$kendo-menu-popup-border: $kendo-popup-border !default;
 /// The background gradient of the menu popup.
 /// @group menu
 $kendo-menu-popup-gradient: null !default;
@@ -93,35 +93,35 @@ $kendo-menu-popup-gradient: null !default;
 /// Horizontal padding of the menu item in popup.
 /// @group menu
 $kendo-menu-popup-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
-$kendo-menu-popup-item-padding-x-sm: k-map-get( $kendo-spacing, 4 ) !default;
-$kendo-menu-popup-item-padding-x-md: k-map-get( $kendo-spacing, 4 ) !default;
-$kendo-menu-popup-item-padding-x-lg: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-menu-popup-sm-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-menu-popup-md-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-menu-popup-lg-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 
 /// Vertical padding of the menu item in popup.
 /// @group menu
 $kendo-menu-popup-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$kendo-menu-popup-item-padding-y-sm: k-map-get( $kendo-spacing, 1.5 ) !default;
-$kendo-menu-popup-item-padding-y-md: k-map-get( $kendo-spacing, 2 ) !default;
-$kendo-menu-popup-item-padding-y-lg: k-map-get( $kendo-spacing, 2.5 ) !default;
+$kendo-menu-popup-sm-item-padding-y: k-map-get( $kendo-spacing, 1.5 ) !default;
+$kendo-menu-popup-md-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-menu-popup-lg-item-padding-y: k-map-get( $kendo-spacing, 2.5 ) !default;
 
 /// The end padding of the menu item in popup.
 /// @group menu
-$kendo-menu-popup-item-padding-end: calc( #{$kendo-menu-popup-item-padding-x * 2} + #{$icon-size} ) !default;
-$kendo-menu-popup-item-padding-end-sm: calc( #{$kendo-menu-popup-item-padding-x-sm * 2} + #{$icon-size} ) !default;
-$kendo-menu-popup-item-padding-end-md: calc( #{$kendo-menu-popup-item-padding-x-md * 2} + #{$icon-size} ) !default;
-$kendo-menu-popup-item-padding-end-lg: calc( #{$kendo-menu-popup-item-padding-x-lg * 2} + #{$icon-size} ) !default;
+$kendo-menu-popup-item-padding-end: calc( #{$kendo-menu-popup-item-padding-x * 2} + #{$kendo-icon-size} ) !default;
+$kendo-menu-popup-sm-item-padding-end: calc( #{$kendo-menu-popup-sm-item-padding-x * 2} + #{$kendo-icon-size} ) !default;
+$kendo-menu-popup-md-item-padding-end: calc( #{$kendo-menu-popup-md-item-padding-x * 2} + #{$kendo-icon-size} ) !default;
+$kendo-menu-popup-lg-item-padding-end: calc( #{$kendo-menu-popup-lg-item-padding-x * 2} + #{$kendo-icon-size} ) !default;
 
 /// The start margin of the menu item expand icon.
 /// @group menu
-$kendo-menu-popup-item-icon-margin-start-sm: $kendo-menu-popup-item-padding-x-sm !default;
-$kendo-menu-popup-item-icon-margin-start: $kendo-menu-popup-item-padding-x-md !default;
-$kendo-menu-popup-item-icon-margin-start-lg: $kendo-menu-popup-item-padding-x-lg !default;
+$kendo-menu-popup-sm-item-icon-margin-start: $kendo-menu-popup-sm-item-padding-x !default;
+$kendo-menu-popup-md-item-icon-margin-start: $kendo-menu-popup-md-item-padding-x !default;
+$kendo-menu-popup-lg-item-icon-margin-start: $kendo-menu-popup-lg-item-padding-x !default;
 
 /// The end margin of the menu item expand icon.
 /// @group menu
-$kendo-menu-popup-item-icon-margin-end-sm: calc( -1 * (#{$kendo-menu-popup-item-padding-end-sm} - #{k-math-div( $kendo-menu-popup-item-padding-x-sm, 2 )}) ) !default;
-$kendo-menu-popup-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-item-padding-end-md} - #{k-math-div( $kendo-menu-popup-item-padding-x-md, 2 )}) ) !default;
-$kendo-menu-popup-item-icon-margin-end-lg: calc( -1 * (#{$kendo-menu-popup-item-padding-end-lg} - #{k-math-div( $kendo-menu-popup-item-padding-x-lg, 2 )}) ) !default;
+$kendo-menu-popup-sm-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-sm-item-padding-end} - #{k-math-div( $kendo-menu-popup-sm-item-padding-x, 2 )}) ) !default;
+$kendo-menu-popup-md-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-md-item-padding-end} - #{k-math-div( $kendo-menu-popup-md-item-padding-x, 2 )}) ) !default;
+$kendo-menu-popup-lg-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-lg-item-padding-end} - #{k-math-div( $kendo-menu-popup-lg-item-padding-x, 2 )}) ) !default;
 
 /// The spacing between the menu items in popup.
 /// @group menu

package/scss/messagebox/_variables.scss

@@ -1,15 +1,15 @@
 // Message box
-$message-box-margin: 0 0 $spacer 0 !default;
-$message-box-padding-x: $kendo-padding-md-x !default;
-$message-box-padding-y: $kendo-padding-md-y !default;
-$message-box-border-width: 0 0 0 4px !default;
+$kendo-message-box-margin: 0 0 k-map-get( $kendo-spacing, 4 ) 0 !default;
+$kendo-message-box-padding-x: $kendo-padding-md-x !default;
+$kendo-message-box-padding-y: $kendo-padding-md-y !default;
+$kendo-message-box-border-width: 0 0 0 4px !default;
 
-$message-box-font-size: $font-size !default;
-$message-box-line-height: $line-height !default;
+$kendo-message-box-font-size: $kendo-font-size-md !default;
+$kendo-message-box-line-height: $kendo-line-height-md !default;
 
-$message-box-bg-level: -10 !default;
-$message-box-text-level: 6 !default;
-$message-box-border-level: -9 !default;
+$kendo-message-box-bg-level: -10 !default;
+$kendo-message-box-text-level: 6 !default;
+$kendo-message-box-border-level: -9 !default;
 
-$message-box-link-font-style: normal !default;
-$message-box-link-text-decoration: underline !default;
+$kendo-message-box-link-font-style: normal !default;
+$kendo-message-box-link-text-decoration: underline !default;

package/scss/multiselect/_index.scss

@@ -3,7 +3,6 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../forms/_variables.scss";
 @import "../button/_index.scss";
 @import "../input/_index.scss";
 @import "../chip/_index.scss";

package/scss/notification/_variables.scss

@@ -14,20 +14,20 @@ $kendo-notification-border-width: 0px !default;
 $kendo-notification-border-radius: k-map-get( $kendo-spacing, 1 ) !default;
 /// Box shadow of the notification.
 /// @group notification
-$kendo-notification-shadow: $popup-shadow !default;
+$kendo-notification-shadow: $kendo-popup-shadow !default;
 /// Font family of the notification.
 /// @group notification
-$kendo-notification-font-family: $font-family !default;
+$kendo-notification-font-family: $kendo-font-family !default;
 /// Font size of the notification.
 /// @group notification
-$kendo-notification-font-size: $font-size !default;
+$kendo-notification-font-size: $kendo-font-size-md !default;
 /// Line height of the notification.
 /// @group notification
 $kendo-notification-line-height: k-math-div( 20, 14 ) !default;
 
 /// Horizontal spacing of the notification icon.
 /// @group notification
-$kendo-notification-icon-spacing: $icon-spacing !default;
+$kendo-notification-icon-spacing: $kendo-icon-spacing !default;
 
 /// Background color of the notification.
 /// @group notification

package/scss/orgchart/_index.scss

@@ -2,7 +2,7 @@
 
 
 // Dependencies
-@import "../utils/_index.scss";
+// @import "../utils/_index.scss";
 @import "../common/_index.scss";
 @import "../icons/_index.scss";
 @import "../forms/_index.scss";

package/scss/orgchart/_variables.scss

@@ -1,57 +1,57 @@
 // Orgchart
-$orgchart-spacer: k-map-get( $kendo-spacing, 6 ) !default;
-$orgchart-padding-y: $orgchart-spacer !default;
-$orgchart-padding-x: $orgchart-padding-y !default;
-$orgchart-font-family: $font-family !default;
-$orgchart-font-size: $font-size !default;
-$orgchart-line-height: $line-height !default;
-$orgchart-bg: $kendo-component-bg !default;
-$orgchart-text: $kendo-component-text !default;
-$orgchart-border: $kendo-component-border !default;
-
-$orgchart-node-gap: $orgchart-spacer !default;
-$orgchart-group-gap: $orgchart-spacer !default;
-$orgchart-node-container-gap: $orgchart-spacer !default;
-
-$orgchart-node-group-padding-y: $orgchart-spacer !default;
-$orgchart-node-group-padding-x: $orgchart-node-group-padding-y !default;
-$orgchart-node-group-border-width: 1px !default;
-$orgchart-node-group-border-radius: $kendo-border-radius-md !default;
-$orgchart-node-group-bg: if( $dark-theme, $kendo-color-dark, $kendo-color-light) !default;
-$orgchart-node-group-text: $base-text !default;
-$orgchart-node-group-border: $base-border !default;
-
-$orgchart-node-group-focus-border: $card-focus-border !default;
-$orgchart-node-group-focus-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $elevation, .14 ), 0 1px 10px 0 rgba( $elevation, .12 ) !default;
-
-$orgchart-node-group-title-font-size: $font-size-xl !default;
-$orgchart-node-group-title-margin-bottom: k-math-div( $orgchart-spacer, 4 ) !default;
-$orgchart-node-group-title-line-height: $line-height-sm !default;
-
-$orgchart-node-group-subtitle-font-size: $font-size !default;
-$orgchart-node-group-subtitle-margin-bottom: $orgchart-spacer !default;
-$orgchart-node-group-subtitle-text: rgba( black, .54 ) !default;
-
-$orgchart-card-width: 300px !default;
-$orgchart-card-padding-y: $card-padding-y !default;
-$orgchart-card-padding-x: $orgchart-card-padding-y !default;
-$orgchart-card-border-width: 1px !default;
-$orgchart-card-shadow: none !default;
-$orgchart-card-focus-shadow: $orgchart-node-group-focus-shadow !default;
-
-$orgchart-card-title-margin-bottom: 0px !default;
-$orgchart-card-title-font-size: null !default;
-
-$orgchart-card-subtitle-margin-bottom: 0px !default;
-$orgchart-card-subtitle-font-size: null !default;
-
-$orgchart-card-body-border-width: 2px 0 0 !default;
-$orgchart-card-body-border-color: transparent !default;
-
-$orgchart-card-body-vbox-margin-right: k-math-div( $orgchart-spacer, 2 ) !default;
-$orgchart-card-body-vbox-min-height: $card-avatar-size !default;
-
-$orgchart-line-size: 1px !default;
-$orgchart-line-fill: $base-border !default;
-
-$orgchart-line-v-height: 25px !default;
+$kendo-orgchart-spacer: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-orgchart-padding-y: $kendo-orgchart-spacer !default;
+$kendo-orgchart-padding-x: $kendo-orgchart-padding-y !default;
+$kendo-orgchart-font-family: $kendo-font-family !default;
+$kendo-orgchart-font-size: $kendo-font-size-md !default;
+$kendo-orgchart-line-height: $kendo-line-height-md !default;
+$kendo-orgchart-bg: $kendo-component-bg !default;
+$kendo-orgchart-text: $kendo-component-text !default;
+$kendo-orgchart-border: $kendo-component-border !default;
+
+$kendo-orgchart-node-gap: $kendo-orgchart-spacer !default;
+$kendo-orgchart-group-gap: $kendo-orgchart-spacer !default;
+$kendo-orgchart-node-container-gap: $kendo-orgchart-spacer !default;
+
+$kendo-orgchart-node-group-padding-y: $kendo-orgchart-spacer !default;
+$kendo-orgchart-node-group-padding-x: $kendo-orgchart-node-group-padding-y !default;
+$kendo-orgchart-node-group-border-width: 1px !default;
+$kendo-orgchart-node-group-border-radius: $kendo-border-radius-md !default;
+$kendo-orgchart-node-group-bg: if( $kendo-is-dark-theme, $kendo-color-dark, $kendo-color-light) !default;
+$kendo-orgchart-node-group-text: $kendo-base-text !default;
+$kendo-orgchart-node-group-border: $kendo-base-border !default;
+
+$kendo-orgchart-node-group-focus-border: $kendo-card-focus-border !default;
+$kendo-orgchart-node-group-focus-shadow: 0 2px 4px -1px rgba( $elevation, .2 ), 0 4px 5px 0 rgba( $elevation, .14 ), 0 1px 10px 0 rgba( $elevation, .12 ) !default;
+
+$kendo-orgchart-node-group-title-font-size: $kendo-font-size-xl !default;
+$kendo-orgchart-node-group-title-margin-bottom: k-math-div( $kendo-orgchart-spacer, 4 ) !default;
+$kendo-orgchart-node-group-title-line-height: $kendo-line-height-sm !default;
+
+$kendo-orgchart-node-group-subtitle-font-size: $kendo-font-size-md !default;
+$kendo-orgchart-node-group-subtitle-margin-bottom: $kendo-orgchart-spacer !default;
+$kendo-orgchart-node-group-subtitle-text: rgba( black, .54 ) !default;
+
+$kendo-orgchart-card-width: 300px !default;
+$kendo-orgchart-card-padding-y: $kendo-card-padding-y !default;
+$kendo-orgchart-card-padding-x: $kendo-orgchart-card-padding-y !default;
+$kendo-orgchart-card-border-width: 1px !default;
+$kendo-orgchart-card-shadow: none !default;
+$kendo-orgchart-card-focus-shadow: $kendo-orgchart-node-group-focus-shadow !default;
+
+$kendo-orgchart-card-title-margin-bottom: 0px !default;
+$kendo-orgchart-card-title-font-size: null !default;
+
+$kendo-orgchart-card-subtitle-margin-bottom: 0px !default;
+$kendo-orgchart-card-subtitle-font-size: null !default;
+
+$kendo-orgchart-card-body-border-width: 2px 0 0 !default;
+$kendo-orgchart-card-body-border-color: transparent !default;
+
+$kendo-orgchart-card-body-vbox-margin-right: k-math-div( $kendo-orgchart-spacer, 2 ) !default;
+$kendo-orgchart-card-body-vbox-min-height: $kendo-card-avatar-size !default;
+
+$kendo-orgchart-line-size: 1px !default;
+$kendo-orgchart-line-fill: $kendo-base-border !default;
+
+$kendo-orgchart-line-v-height: 25px !default;

package/scss/overlay/_variables.scss

@@ -1,4 +1,4 @@
-$overlay-theme-colors: $kendo-theme-colors !default;
+$kendo-overlay-theme-colors: $kendo-theme-colors !default;
 
-$overlay-bg: $kendo-color-black !default;
-$overlay-opacity: .32 !default;
+$kendo-overlay-bg: $kendo-color-black !default;
+$kendo-overlay-opacity: .32 !default;