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

package/scss/adaptive/_variables.scss

@@ -1,18 +1,18 @@
 // Adaptive Common
-$adaptive-bg: $component-bg !default;
-$adaptive-text: $component-text !default;
-$adaptive-border: $component-border !default;
+$adaptive-bg: $kendo-component-bg !default;
+$adaptive-text: $kendo-component-text !default;
+$adaptive-border: $kendo-component-border !default;
 
-$adaptive-content-bg: $app-bg !default;
-$adaptive-content-text: $app-text !default;
+$adaptive-content-bg: $kendo-app-bg !default;
+$adaptive-content-text: $kendo-app-text !default;
 
-$adaptive-menu-bg: $primary !default;
+$adaptive-menu-bg: $kendo-color-primary !default;
 $adaptive-menu-text: k-contrast-color( $adaptive-menu-bg ) !default;
 
-$adaptive-menu-clear-text: $primary !default;
+$adaptive-menu-clear-text: $kendo-color-primary !default;
 
-$adaptive-menu-item-border: $component-border !default;
-$adaptive-menu-title-text: $component-text !default;
+$adaptive-menu-item-border: $kendo-component-border !default;
+$adaptive-menu-title-text: $kendo-component-text !default;
 
 $adaptive-border-width: 1px !default;
 $adaptive-font-family: $font-family !default;
@@ -20,9 +20,9 @@ $adaptive-font-size: $font-size !default;
 $adaptive-line-height: $line-height !default;
 
 // Adaptive Grid
-$adaptive-grid-sort-text: $primary !default;
+$adaptive-grid-sort-text: $kendo-color-primary !default;
 
 // Adaptive Scheduler
-$adaptive-scheduler-current-text: $primary !default;
+$adaptive-scheduler-current-text: $kendo-color-primary !default;
 $adaptive-scheduler-base-text: inherit !default;
-$adaptive-scheduler-subtle-text: $subtle-text !default;
+$adaptive-scheduler-subtle-text: $kendo-subtle-text !default;

package/scss/all.scss

@@ -1 +1 @@
-@import "index.scss";
+@import "./index.scss";

package/scss/appbar/_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/appbar/_layout.scss

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

package/scss/appbar/_theme.scss

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

package/scss/appbar/_variables.scss

@@ -1,22 +1,22 @@
 // Appbar
-$appbar-margin-y: null !default;
-$appbar-margin-x: null !default;
-$appbar-padding-y: k-map-get( $spacing, 2 ) !default;
-$appbar-padding-x: k-map-get( $spacing, 2 ) !default;
-$appbar-border-width: 0px !default;
+$kendo-appbar-margin-y: null !default;
+$kendo-appbar-margin-x: null !default;
+$kendo-appbar-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-appbar-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-appbar-border-width: 0px !default;
 
-$appbar-zindex: 1000 !default;
+$kendo-appbar-zindex: 1000 !default;
 
-$appbar-font-size: $font-size !default;
-$appbar-line-height: $line-height !default;
-$appbar-font-family: $font-family !default;
-$appbar-gap: k-map-get( $spacing, 2 ) !default;
+$kendo-appbar-font-size: $font-size !default;
+$kendo-appbar-line-height: $line-height !default;
+$kendo-appbar-font-family: $font-family !default;
+$kendo-appbar-gap: k-map-get( $kendo-spacing, 2 ) !default;
 
-$appbar-light-bg: $light !default;
-$appbar-light-text: k-contrast-color( $light ) !default;
+$kendo-appbar-light-bg: $kendo-color-light !default;
+$kendo-appbar-light-text: k-contrast-color( $kendo-color-light ) !default;
 
-$appbar-dark-bg: $dark !default;
-$appbar-dark-text: k-contrast-color( $dark ) !default;
+$kendo-appbar-dark-bg: $kendo-color-dark !default;
+$kendo-appbar-dark-text: k-contrast-color( $kendo-color-dark ) !default;
 
-$appbar-box-shadow: 0px 2px 3px rgba( black, .24 ) !default;
-$appbar-bottom-box-shadow: 0px -2px 3px rgba( black, .24 ) !default;
+$kendo-appbar-box-shadow: 0px 2px 3px rgba( black, .24 ) !default;
+$kendo-appbar-bottom-box-shadow: 0px -2px 3px rgba( black, .24 ) !default;

package/scss/autocomplete/_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/autocomplete/_layout.scss

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

package/scss/autocomplete/_theme.scss

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

package/scss/avatar/_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/avatar/_layout.scss

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

package/scss/avatar/_theme.scss

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

package/scss/avatar/_variables.scss

@@ -17,9 +17,9 @@ $kendo-avatar-line-height: $line-height !default;
 /// The sizes of the avatar.
 /// @group avatar
 $kendo-avatar-sizes: (
-    sm: k-map-get( $spacing, 4 ),
-    md: k-map-get( $spacing, 8 ),
-    lg: k-map-get( $spacing, 16 )
+    sm: k-map-get( $kendo-spacing, 4 ),
+    md: k-map-get( $kendo-spacing, 8 ),
+    lg: k-map-get( $kendo-spacing, 16 )
 ) !default;
 
 /// Theme colors map of the avatar.

package/scss/badge/_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/badge/_layout.scss

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

package/scss/badge/_theme.scss

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

package/scss/badge/_variables.scss

@@ -11,17 +11,17 @@ $kendo-badge-border-radius: $kendo-border-radius-md !default;
 
 /// Horizontal padding of the badge.
 /// @group badge
-$kendo-badge-padding-x: k-map-get( $spacing, 1 ) !default;
-$kendo-badge-padding-x-sm: k-map-get( $spacing, 1 ) - k-map-get( $spacing, thin ) !default;
-$kendo-badge-padding-x-md: k-map-get( $spacing, 1 ) !default;
-$kendo-badge-padding-x-lg: k-map-get( $spacing, 1 ) + k-map-get( $spacing, thin ) !default;
+$kendo-badge-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-badge-padding-x-sm: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-badge-padding-x-md: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-badge-padding-x-lg: k-map-get( $kendo-spacing, 1.5 ) !default;
 
 /// Vertical padding of the badge.
 /// @group badge
-$kendo-badge-padding-y: k-map-get( $spacing, 1 ) !default;
-$kendo-badge-padding-y-sm: k-map-get( $spacing, 1 ) - k-map-get( $spacing, thin )  !default;
-$kendo-badge-padding-y-md: k-map-get( $spacing, 1 ) !default;
-$kendo-badge-padding-y-lg: k-map-get( $spacing, 1 ) + k-map-get( $spacing, thin ) !default;
+$kendo-badge-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-badge-padding-y-sm: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-badge-padding-y-md: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-badge-padding-y-lg: k-map-get( $kendo-spacing, 1.5 ) !default;
 
 /// Font sizes of the badge.
 /// @group badge

package/scss/bottom-navigation/_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/bottom-navigation/_layout.scss

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

package/scss/bottom-navigation/_theme.scss

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

package/scss/bottom-navigation/_variables.scss

@@ -9,21 +9,21 @@ $bottom-nav-font-size: $font-size !default;
 $bottom-nav-line-height: normal !default;
 $bottom-nav-letter-spacing: .2px !default;
 
-$bottom-nav-item-padding-x: k-map-get( $spacing, 2 ) !default;
+$bottom-nav-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 $bottom-nav-item-padding-y: 0 !default;
 $bottom-nav-item-min-width: 72px !default;
 $bottom-nav-item-max-width: null !default;
-$bottom-nav-item-min-height: calc( #{$icon-size * 2.5} + #{$padding-x-sm * 2} - #{$bottom-nav-padding-x * 2} ) !default;
+$bottom-nav-item-min-height: calc( #{$icon-size * 2.5} + #{$kendo-padding-sm-x * 2} - #{$bottom-nav-padding-x * 2} ) !default;
 $bottom-nav-item-border-radius: null !default;
-$bottom-nav-item-gap: 0 k-map-get( $spacing, 1 ) !default;
+$bottom-nav-item-gap: 0 k-map-get( $kendo-spacing, 1 ) !default;
 
-$bottom-nav-item-icon-margin-y: k-map-get( $spacing, 2 ) !default;
+$bottom-nav-item-icon-margin-y: k-map-get( $kendo-spacing, 2 ) !default;
 $bottom-nav-item-icon-margin-x: $bottom-nav-item-icon-margin-y !default;
-$bottom-nav-item-icon-size: k-map-get( $spacing, 6 ) !default;
+$bottom-nav-item-icon-size: k-map-get( $kendo-spacing, 6 ) !default;
 $bottom-nav-item-disabled-opacity: .5 !default;
 
 $bottom-nav-shadow: 0px 0px 5px rgba( black, .12 ) !default;
 
-$bottom-nav-flat-bg: $component-bg !default;
-$bottom-nav-flat-text: $component-text !default;
-$bottom-nav-flat-border: $component-border !default;
+$bottom-nav-flat-bg: $kendo-component-bg !default;
+$bottom-nav-flat-text: $kendo-component-text !default;
+$bottom-nav-flat-border: $kendo-component-border !default;

package/scss/breadcrumb/_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/breadcrumb/_layout.scss

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

package/scss/breadcrumb/_theme.scss

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

package/scss/breadcrumb/_variables.scss

@@ -9,16 +9,14 @@ $breadcrumb-font-family: $font-family !default;
 $breadcrumb-font-size: $font-size !default;
 $breadcrumb-line-height: $line-height !default;
 
-$breadcrumb-bg: $component-bg !default;
-$breadcrumb-text: $component-text !default;
-$breadcrumb-border: $component-border !default;
+$breadcrumb-bg: $kendo-component-bg !default;
+$breadcrumb-text: $kendo-component-text !default;
+$breadcrumb-border: $kendo-component-border !default;
 
 $breadcrumb-delimiter-icon-font-size: $icon-size * .75 !default;
-$breadcrumb-delimiter-icon-padding-x: $kendo-button-padding-y !default;
-$breadcrumb-delimiter-icon-padding-y: 0px !default;
 
-$breadcrumb-link-padding-x: ( $padding-x * 1.25 ) / 2 !default;
-$breadcrumb-link-padding-y: $padding-y !default;
+$breadcrumb-link-padding-x: k-map-get( $kendo-spacing, 2.5 ) !default;
+$breadcrumb-link-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $breadcrumb-link-border-radius: $kendo-border-radius-md !default;
 
 $breadcrumb-icon-link-padding-x: $breadcrumb-link-padding-x !default;
@@ -30,29 +28,29 @@ $breadcrumb-link-icon-spacing: $icon-spacing !default;
 $breadcrumb-link-initial-text: inherit !default;
 
 $breadcrumb-link-bg: null !default;
-$breadcrumb-link-text: $primary !default;
+$breadcrumb-link-text: $kendo-color-primary !default;
 $breadcrumb-link-border: null !default;
 
-$breadcrumb-link-hovered-bg: $hovered-bg !default;
-$breadcrumb-link-hovered-text: null !default;
-$breadcrumb-link-hovered-border: null !default;
+$breadcrumb-link-hover-bg: $kendo-hover-bg !default;
+$breadcrumb-link-hover-text: null !default;
+$breadcrumb-link-hover-border: null !default;
 
-$breadcrumb-link-focused-bg: k-map-get( $theme, focus-bg ) !default;
-$breadcrumb-link-focused-text: null !default;
-$breadcrumb-link-focused-border: null !default;
-$breadcrumb-link-focused-shadow: null !default;
+$breadcrumb-link-focus-bg: k-map-get( $theme, focus-bg ) !default;
+$breadcrumb-link-focus-text: null !default;
+$breadcrumb-link-focus-border: null !default;
+$breadcrumb-link-focus-shadow: null !default;
 
 $breadcrumb-root-link-bg: null !default;
 $breadcrumb-root-link-text: null !default;
 $breadcrumb-root-link-border: null !default;
 
-$breadcrumb-root-link-hovered-bg: $hovered-bg !default;
-$breadcrumb-root-link-hovered-text: null !default;
-$breadcrumb-root-link-hovered-border: null !default;
+$breadcrumb-root-link-hover-bg: $kendo-hover-bg !default;
+$breadcrumb-root-link-hover-text: null !default;
+$breadcrumb-root-link-hover-border: null !default;
 
-$breadcrumb-root-link-focused-bg: k-map-get( $theme, focus-bg ) !default;
-$breadcrumb-root-link-focused-text: null !default;
-$breadcrumb-root-link-focused-border: null !default;
-$breadcrumb-root-link-focused-shadow: null !default;
+$breadcrumb-root-link-focus-bg: k-map-get( $theme, focus-bg ) !default;
+$breadcrumb-root-link-focus-text: null !default;
+$breadcrumb-root-link-focus-border: null !default;
+$breadcrumb-root-link-focus-shadow: null !default;
 
-$breadcrumb-focused-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
+$breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;

package/scss/button/_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/button/_layout.scss

@@ -1,4 +1,4 @@
-@import "~@progress/kendo-theme-default/scss/button/_layout.scss";
+@import "@progress/kendo-theme-default/scss/button/_layout.scss";
 
 @include exports("button/layout/material") {
 

package/scss/button/_theme.scss

@@ -1,4 +1,4 @@
-@import "~@progress/kendo-theme-default/scss/button/_theme.scss";
+@import "@progress/kendo-theme-default/scss/button/_theme.scss";
 
 @include exports( "button/theme/material" ) {
 

package/scss/button/_variables.scss

@@ -10,10 +10,10 @@ $kendo-button-border-radius: null !default;
 
 /// Horizontal padding of the button.
 /// @group button
-$kendo-button-padding-x: k-map-get( $spacing, 4 ) !default;
+$kendo-button-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 /// Vertical padding of the button.
 /// @group button
-$kendo-button-padding-y: k-map-get( $spacing, 2 ) !default;
+$kendo-button-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 /// Font family of the button.
 /// @group button
 $kendo-button-font-family: $font-family !default;
@@ -22,30 +22,36 @@ $kendo-button-font-family: $font-family !default;
 $kendo-button-font-size: $font-size-md !default;
 /// Line heights used along with $font-size.
 /// @group button
-$kendo-button-line-height: ( 20 / 14 ) !default;
+$kendo-button-line-height: k-math-div( 20, 14 ) !default;
 
-$kendo-button-padding-x-sm: k-map-get( $spacing, 4 ) !default;
-$kendo-button-padding-y-sm: k-map-get( $spacing, 2 ) - k-map-get( $spacing, thin ) !default;
+$kendo-button-padding-x-sm: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-button-padding-y-sm: k-map-get( $kendo-spacing, 1.5 ) !default;
 $kendo-button-font-size-sm: $font-size-md !default;
-$kendo-button-line-height-sm: ( 20 / 14 ) !default;
+$kendo-button-line-height-sm: k-math-div( 20, 14 ) !default;
 
-$kendo-button-padding-x-md: k-map-get( $spacing, 4 ) !default;
-$kendo-button-padding-y-md: k-map-get( $spacing, 2 ) !default;
+$kendo-button-padding-x-md: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-button-padding-y-md: k-map-get( $kendo-spacing, 2 ) !default;
 $kendo-button-font-size-md: $font-size-md !default;
-$kendo-button-line-height-md: ( 20 / 14 ) !default;
+$kendo-button-line-height-md: k-math-div( 20, 14 ) !default;
 
-$kendo-button-padding-x-lg: k-map-get( $spacing, 4 ) !default;
-$kendo-button-padding-y-lg: k-map-get( $spacing, 2 ) + k-map-get( $spacing, thin ) !default;
+$kendo-button-padding-x-lg: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-button-padding-y-lg: k-map-get( $kendo-spacing, 2.5 ) !default;
 $kendo-button-font-size-lg: $font-size-md !default;
-$kendo-button-line-height-lg: ( 20 / 14 ) !default;
+$kendo-button-line-height-lg: k-math-div( 20, 14 ) !default;
 
 /// Calculated height of the button.
 /// @group button
 $kendo-button-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} + #{$kendo-button-border-width * 2} ) !default;
+$kendo-button-calc-size-sm: calc( #{$kendo-button-line-height-sm * 1em} + #{$kendo-button-padding-y-sm * 2} + #{$kendo-button-border-width * 2} ) !default;
+$kendo-button-calc-size-md: calc( #{$kendo-button-line-height-md * 1em} + #{$kendo-button-padding-y-md * 2} + #{$kendo-button-border-width * 2} ) !default;
+$kendo-button-calc-size-lg: calc( #{$kendo-button-line-height-lg * 1em} + #{$kendo-button-padding-y-lg * 2} + #{$kendo-button-border-width * 2} ) !default;
 
 /// Calculated inner height of the button. Without the border width.
 /// @group button
 $kendo-button-inner-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} ) !default;
+$kendo-button-inner-calc-size-sm: calc( #{$kendo-button-line-height-sm * 1em} + #{$kendo-button-padding-y-sm * 2} ) !default;
+$kendo-button-inner-calc-size-md: calc( #{$kendo-button-line-height-md * 1em} + #{$kendo-button-padding-y-md * 2} ) !default;
+$kendo-button-inner-calc-size-lg: calc( #{$kendo-button-line-height-lg * 1em} + #{$kendo-button-padding-y-lg * 2} ) !default;
 
 $kendo-button-sizes: (
     sm: (
@@ -157,10 +163,10 @@ $kendo-button-focus-shadow: null !default;
 
 /// The base background color of disabled button.
 /// @group button
-$kendo-button-disabled-bg: k-try-shade( $body-bg, 12% ) !default;
+$kendo-button-disabled-bg: k-try-shade( $kendo-body-bg, 12% ) !default;
 /// The base text color of disabled button.
 /// @group button
-$kendo-button-disabled-text: $disabled-text !default;
+$kendo-button-disabled-text: $kendo-disabled-text !default;
 /// The base border color of disabled button.
 /// @group button
 $kendo-button-disabled-border: $kendo-button-disabled-bg !default;

package/scss/calendar/_index.scss

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

package/scss/calendar/_layout.scss

@@ -1,4 +1,4 @@
-@import "~@progress/kendo-theme-default/scss/calendar/_layout.scss";
+@import "@progress/kendo-theme-default/scss/calendar/_layout.scss";
 
 @include exports ( "calendar/layout/material" ) {
 
@@ -6,9 +6,7 @@
 
         .k-title,
         .k-calendar-title,
-        .k-nav-fast,
-        .k-nav-today,
-        .k-calendar-nav-today {
+        .k-nav-fast {
             font-weight: 500;
             text-transform: none;
         }

package/scss/calendar/_theme.scss

@@ -1,4 +1,4 @@
-@import "~@progress/kendo-theme-default/scss/calendar/_theme.scss";
+@import "@progress/kendo-theme-default/scss/calendar/_theme.scss";
 
 @include exports("calendar/theme/material") {
 

package/scss/calendar/_variables.scss

@@ -2,31 +2,28 @@
 $calendar-border-width: 1px !default;
 $calendar-font-family: $font-family !default;
 $calendar-font-size: $font-size !default;
-$calendar-line-height: (20 / 14) !default;
+$calendar-line-height: k-math-div( 20, 14 ) !default;
 
 $calendar-cell-size: 36px !default;
 
-$calendar-bg: $component-bg !default;
-$calendar-text: $component-text !default;
-$calendar-border: $component-border !default;
+$calendar-bg: $kendo-component-bg !default;
+$calendar-text: $kendo-component-text !default;
+$calendar-border: $kendo-component-border !default;
 
-$calendar-header-padding-x: k-map-get( $spacing, 1 ) !default;
-$calendar-header-padding-y: k-map-get( $spacing, 1 ) !default;
+$calendar-header-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$calendar-header-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $calendar-header-border-width: 0px !default;
 
 $calendar-header-bg: null !default;
-$calendar-header-text: $header-text !default;
-$calendar-header-border: $header-border !default;
+$calendar-header-text: $kendo-component-header-text !default;
+$calendar-header-border: $kendo-component-header-border !default;
 $calendar-header-gradient: null !default;
 $calendar-header-shadow: null !default;
 
-$calendar-nav-gap: k-map-get( $spacing, 1 ) !default;
+$calendar-nav-gap: null !default;
 
-$calendar-today-nav-text: $link-text !default;
-$calendar-today-nav-hover-text: $link-hover-text !default;
-
-$calendar-footer-padding-x: k-map-get( $spacing, 4 ) !default;
-$calendar-footer-padding-y: k-map-get( $spacing, 2 ) !default;
+$calendar-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$calendar-footer-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
 $calendar-cell-padding-x: .25em !default;
 $calendar-cell-padding-y: $calendar-cell-padding-x !default;
@@ -40,11 +37,11 @@ $calendar-header-cell-height: $calendar-cell-size !default;
 $calendar-header-cell-font-size: $font-size-sm !default;
 $calendar-header-cell-line-height: 2 !default;
 $calendar-header-cell-bg: null !default;
-$calendar-header-cell-text: $subtle-text !default;
+$calendar-header-cell-text: $kendo-subtle-text !default;
 $calendar-header-cell-opacity: null !default;
 
-$calendar-caption-padding-x: k-map-get( $spacing, 4 ) !default;
-$calendar-caption-padding-y: k-map-get( $spacing, 1 ) !default;
+$calendar-caption-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$calendar-caption-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $calendar-caption-height: $calendar-cell-size !default;
 $calendar-caption-font-size: null !default;
 $calendar-caption-line-height: null !default;
@@ -52,13 +49,13 @@ $calendar-caption-font-weight: bold !default;
 
 $calendar-view-width: ($calendar-cell-size * 8) !default;
 $calendar-view-height: ($calendar-cell-size * 7) !default;
-$calendar-view-gap: k-map-get( $spacing, 4 ) !default;
+$calendar-view-gap: k-map-get( $kendo-spacing, 4 ) !default;
 
 $calendar-weekend-bg: null !default;
 $calendar-weekend-text: null !default;
 
 $calendar-today-style: color !default;
-$calendar-today-color: $primary !default;
+$calendar-today-color: $kendo-color-primary !default;
 
 $calendar-week-number-bg: null !default;
 $calendar-week-number-text: $calendar-header-cell-text !default;
@@ -71,12 +68,12 @@ $calendar-cell-text: null !default;
 $calendar-cell-border: null !default;
 $calendar-cell-gradient: null !default;
 
-$calendar-cell-hover-bg: $hovered-bg !default;
-$calendar-cell-hover-text: $hovered-text !default;
-$calendar-cell-hover-border: $hovered-border !default;
+$calendar-cell-hover-bg: $kendo-hover-bg !default;
+$calendar-cell-hover-text: $kendo-hover-text !default;
+$calendar-cell-hover-border: $kendo-hover-border !default;
 $calendar-cell-hover-gradient: null !default;
 
-$calendar-cell-selected-bg: $primary !default;
+$calendar-cell-selected-bg: $kendo-color-primary !default;
 $calendar-cell-selected-text: k-contrast-color( $calendar-cell-selected-bg ) !default;
 $calendar-cell-selected-border: $calendar-cell-selected-bg !default;
 $calendar-cell-selected-gradient: null !default;
@@ -86,8 +83,8 @@ $calendar-cell-selected-hover-text: $calendar-cell-selected-text !default;
 $calendar-cell-selected-hover-border: null !default;
 $calendar-cell-selected-hover-gradient: null !default;
 
-$calendar-cell-focused-shadow: $kendo-list-item-focus-shadow !default;
-$calendar-cell-selected-focus-shadow: $calendar-cell-focused-shadow !default;
+$calendar-cell-focus-shadow: $kendo-list-item-focus-shadow !default;
+$calendar-cell-selected-focus-shadow: $calendar-cell-focus-shadow !default;
 
 
 // Calendar navigation
@@ -98,12 +95,14 @@ $calendar-navigation-bg: k-true-mix( $calendar-text, $calendar-bg, 3) !default;
 $calendar-navigation-text: $calendar-text !default;
 $calendar-navigation-border: $calendar-border !default;
 
+$calendar-navigation-hover-text: $link-hover-text !default;
+
 
 // Infinite calendar
-$infinite-calendar-header-padding-x: k-map-get( $spacing, 4 ) !default;
-$infinite-calendar-header-padding-y: k-map-get( $spacing, 2 ) !default;
+$infinite-calendar-header-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$infinite-calendar-header-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
-$infinite-calendar-view-padding-x: k-map-get( $spacing, 4 ) !default;
+$infinite-calendar-view-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 $infinite-calendar-view-padding-y: 0px !default;
 $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
 
@@ -121,14 +120,14 @@ $kendo-calendar-sm-cell-padding-y: .125rem !default;
 $kendo-calendar-md-font-size: $font-size-md !default;
 $kendo-calendar-md-line-height: $line-height-md !default;
 $kendo-calendar-md-cell-size: 36px !default;
-$kendo-calendar-md-cell-padding-x: k-map-get( $spacing, 1 ) !default;
-$kendo-calendar-md-cell-padding-y: k-map-get( $spacing, 1 ) !default;
+$kendo-calendar-md-cell-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-calendar-md-cell-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 
 $kendo-calendar-lg-font-size: $font-size-lg !default;
 $kendo-calendar-lg-line-height: $line-height-lg !default;
 $kendo-calendar-lg-cell-size: 40px !default;
-$kendo-calendar-lg-cell-padding-x: k-map-get( $spacing, 1 ) !default;
-$kendo-calendar-lg-cell-padding-y: k-map-get( $spacing, 1 ) !default;
+$kendo-calendar-lg-cell-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-calendar-lg-cell-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 
 $kendo-calendar-sizes: (
     sm: (

package/scss/captcha/_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/captcha/_layout.scss

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