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

package/scss/scheduler/_variables.scss

@@ -1,94 +1,94 @@
 // Scheduler
-$scheduler-border-width: 1px !default;
-$scheduler-font-family: $font-family !default;
-$scheduler-font-size: $font-size !default;
-$scheduler-line-height: $line-height !default;
-
-$scheduler-bg: $kendo-component-bg !default;
-$scheduler-text: $kendo-component-text !default;
-$scheduler-border: $kendo-component-border !default;
-
-$scheduler-toolbar-bg: $kendo-toolbar-bg !default;
-$scheduler-toolbar-text: $kendo-toolbar-text !default;
-$scheduler-toolbar-border: $kendo-toolbar-border !default;
-$scheduler-toolbar-gradient: $kendo-toolbar-gradient !default;
-
-$scheduler-footer-bg: $kendo-toolbar-bg !default;
-$scheduler-footer-text: $kendo-toolbar-text !default;
-$scheduler-footer-border: $kendo-toolbar-border !default;
-$scheduler-footer-gradient: $kendo-toolbar-gradient !default;
-
-$scheduler-event-min-height: 25px !default;
-$scheduler-event-border-radius: $kendo-border-radius-md !default;
-$scheduler-event-line-height: calc( #{$scheduler-event-min-height} - (2 * #{$kendo-padding-md-y}) ) !default;
-
-$scheduler-event-bg: k-color-tint( $kendo-selected-bg, 2 ) !default;
-$scheduler-event-text: $kendo-selected-text !default;
-$scheduler-event-border: null !default;
-$scheduler-event-gradient: null !default;
-$scheduler-event-shadow: null !default;
-
-$scheduler-event-hover-bg: null !default;
-$scheduler-event-hover-text: null !default;
-$scheduler-event-hover-border: null !default;
-$scheduler-event-hover-gradient: null !default;
-$scheduler-event-hover-shadow: null !default;
-
-$scheduler-event-selected-bg: $kendo-selected-bg !default;
-$scheduler-event-selected-text: $kendo-selected-text !default;
-$scheduler-event-selected-border: null !default;
-$scheduler-event-selected-gradient: null !default;
-$scheduler-event-selected-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
-
-$scheduler-event-ongoing-shadow: inset 0px 0px 0px 1px #ff0000 !default;
-
-$scheduler-cell-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$scheduler-cell-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$scheduler-cell-height: $line-height-em !default;
-$scheduler-datecolumn-width: 12em !default;
-$scheduler-timecolumn-width: 11em !default;
-
-$scheduler-current-time-color: #ff0000 !default;
-
-$scheduler-nonwork-bg: k-try-shade( $scheduler-bg, .5 ) !default;
-$scheduler-nonwork-text: null !default;
-
-$scheduler-weekend-bg: null !default;
-$scheduler-weekend-text: null !default;
-
-$scheduler-othermonth-bg: k-try-shade( $scheduler-bg, .5 ) !default;
-$scheduler-othermonth-text: null !default;
-
-$scheduler-yearview-padding-x: k-map-get( $kendo-spacing, 3 ) !default;
-$scheduler-yearview-padding-y: $scheduler-yearview-padding-x !default;
-
-$scheduler-yearview-calendar-gap: k-map-get( $kendo-spacing, 3 ) !default;
-
-$scheduler-yearview-indicator-size: 3px !default;
-$scheduler-yearview-indicator-calc-offset-top: calc( #{$calendar-cell-size} - (#{$calendar-cell-padding-y} * 2)) !default;
-$scheduler-yearview-indicator-calc-offset-left: calc( 50% - #{k-math-div( $scheduler-yearview-indicator-size, 2 )} ) !default;
-$scheduler-yearview-indicator-border-radius: 50% !default;
-$scheduler-yearview-indicator-bg: $kendo-color-primary !default;
-$scheduler-yearview-indicator-selected-bg: $kendo-color-primary-contrast !default;
-
-$scheduler-tooltip-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$scheduler-tooltip-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$scheduler-tooltip-border-width: 0 !default;
-$scheduler-tooltip-bg: $kendo-color-primary-contrast !default;
-$scheduler-tooltip-text: $base-text !default;
-$scheduler-tooltip-border: null !default;
-$scheduler-tooltip-shadow: 0px 0px 10px rgba(0, 0, 0, .2) !default;
-
-$scheduler-tooltip-title-margin-y: k-map-get( $kendo-spacing, 3 ) !default;
-$scheduler-tooltip-month-font-size: $font-size-sm !default;
-$scheduler-tooltip-day-font-size: $scheduler-tooltip-month-font-size * 2 !default;
-
-$scheduler-tooltip-events-max-height: 250px !default;
-$scheduler-tooltip-events-gap: k-map-get( $kendo-spacing, 1 ) !default;
-
-$scheduler-tooltip-event-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$scheduler-tooltip-event-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
-$scheduler-tooltip-event-border-radius: $kendo-border-radius-md !default;
-$scheduler-tooltip-event-gap: k-map-get( $kendo-spacing, 1 ) !default;
-
-$scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
+$kendo-scheduler-border-width: 1px !default;
+$kendo-scheduler-font-family: $kendo-font-family !default;
+$kendo-scheduler-font-size: $kendo-font-size-md !default;
+$kendo-scheduler-line-height: $kendo-line-height-md !default;
+
+$kendo-scheduler-bg: $kendo-component-bg !default;
+$kendo-scheduler-text: $kendo-component-text !default;
+$kendo-scheduler-border: $kendo-component-border !default;
+
+$kendo-scheduler-toolbar-bg: $kendo-toolbar-bg !default;
+$kendo-scheduler-toolbar-text: $kendo-toolbar-text !default;
+$kendo-scheduler-toolbar-border: $kendo-toolbar-border !default;
+$kendo-scheduler-toolbar-gradient: $kendo-toolbar-gradient !default;
+
+$kendo-scheduler-footer-bg: $kendo-toolbar-bg !default;
+$kendo-scheduler-footer-text: $kendo-toolbar-text !default;
+$kendo-scheduler-footer-border: $kendo-toolbar-border !default;
+$kendo-scheduler-footer-gradient: $kendo-toolbar-gradient !default;
+
+$kendo-scheduler-event-min-height: 25px !default;
+$kendo-scheduler-event-border-radius: $kendo-border-radius-md !default;
+$kendo-scheduler-event-line-height: calc( #{$kendo-scheduler-event-min-height} - (2 * #{$kendo-padding-md-y}) ) !default;
+
+$kendo-scheduler-event-bg: k-color-tint( $kendo-selected-bg, 2 ) !default;
+$kendo-scheduler-event-text: $kendo-selected-text !default;
+$kendo-scheduler-event-border: null !default;
+$kendo-scheduler-event-gradient: null !default;
+$kendo-scheduler-event-shadow: null !default;
+
+$kendo-scheduler-event-hover-bg: null !default;
+$kendo-scheduler-event-hover-text: null !default;
+$kendo-scheduler-event-hover-border: null !default;
+$kendo-scheduler-event-hover-gradient: null !default;
+$kendo-scheduler-event-hover-shadow: null !default;
+
+$kendo-scheduler-event-selected-bg: $kendo-selected-bg !default;
+$kendo-scheduler-event-selected-text: $kendo-selected-text !default;
+$kendo-scheduler-event-selected-border: null !default;
+$kendo-scheduler-event-selected-gradient: null !default;
+$kendo-scheduler-event-selected-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
+
+$kendo-scheduler-event-ongoing-shadow: inset 0px 0px 0px 1px #ff0000 !default;
+
+$kendo-scheduler-cell-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-scheduler-cell-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-scheduler-cell-height: $kendo-line-height-em !default;
+$kendo-scheduler-datecolumn-width: 12em !default;
+$kendo-scheduler-timecolumn-width: 11em !default;
+
+$kendo-scheduler-current-time-color: #ff0000 !default;
+
+$kendo-scheduler-nonwork-bg: k-try-shade( $kendo-scheduler-bg, .5 ) !default;
+$kendo-scheduler-nonwork-text: null !default;
+
+$kendo-scheduler-weekend-bg: null !default;
+$kendo-scheduler-weekend-text: null !default;
+
+$kendo-scheduler-othermonth-bg: k-try-shade( $kendo-scheduler-bg, .5 ) !default;
+$kendo-scheduler-othermonth-text: null !default;
+
+$kendo-scheduler-yearview-padding-x: k-map-get( $kendo-spacing, 3 ) !default;
+$kendo-scheduler-yearview-padding-y: $kendo-scheduler-yearview-padding-x !default;
+
+$kendo-scheduler-yearview-calendar-gap: k-map-get( $kendo-spacing, 3 ) !default;
+
+$kendo-scheduler-yearview-indicator-size: 3px !default;
+$kendo-scheduler-yearview-indicator-calc-offset-top: calc( #{$kendo-calendar-cell-size} - (#{$kendo-calendar-cell-padding-y} * 2)) !default;
+$kendo-scheduler-yearview-indicator-calc-offset-left: calc( 50% - #{k-math-div( $kendo-scheduler-yearview-indicator-size, 2 )} ) !default;
+$kendo-scheduler-yearview-indicator-border-radius: 50% !default;
+$kendo-scheduler-yearview-indicator-bg: $kendo-color-primary !default;
+$kendo-scheduler-yearview-indicator-selected-bg: $kendo-color-primary-contrast !default;
+
+$kendo-scheduler-tooltip-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-scheduler-tooltip-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-scheduler-tooltip-border-width: 0 !default;
+$kendo-scheduler-tooltip-bg: $kendo-color-primary-contrast !default;
+$kendo-scheduler-tooltip-text: $kendo-base-text !default;
+$kendo-scheduler-tooltip-border: null !default;
+$kendo-scheduler-tooltip-shadow: 0px 0px 10px rgba(0, 0, 0, .2) !default;
+
+$kendo-scheduler-tooltip-title-margin-y: k-map-get( $kendo-spacing, 3 ) !default;
+$kendo-scheduler-tooltip-month-font-size: $kendo-font-size-sm !default;
+$kendo-scheduler-tooltip-day-font-size: $kendo-scheduler-tooltip-month-font-size * 2 !default;
+
+$kendo-scheduler-tooltip-events-max-height: 250px !default;
+$kendo-scheduler-tooltip-events-gap: k-map-get( $kendo-spacing, 1 ) !default;
+
+$kendo-scheduler-tooltip-event-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-scheduler-tooltip-event-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-scheduler-tooltip-event-border-radius: $kendo-border-radius-md !default;
+$kendo-scheduler-tooltip-event-gap: k-map-get( $kendo-spacing, 1 ) !default;
+
+$kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;

package/scss/scrollview/_layout.scss

@@ -3,13 +3,13 @@
     kendo-scrollview.k-scrollview-wrap,
     kendo-scrollview.k-scrollview,
     .k-scrollview {
-        border-width: $scrollview-border-width;
+        border-width: $kendo-scrollview-border-width;
         border-style: solid;
         box-sizing: border-box;
         outline: 0;
-        font-family: $scrollview-font-family;
-        font-size: $scrollview-font-size;
-        line-height: $scrollview-line-height;
+        font-family: $kendo-scrollview-font-family;
+        font-size: $kendo-scrollview-font-size;
+        line-height: $kendo-scrollview-line-height;
         position: relative;
         overflow: hidden;
         display: block;
@@ -53,8 +53,8 @@
         display: flex;
         flex-flow: row nowrap;
         width: calc( var(--kendo-scrollview-views, 1) * 100% );
-        transition-duration: $scrollview-transition-duration;
-        transition-timing-function: $scrollview-transition-timing-function;
+        transition-duration: $kendo-scrollview-transition-duration;
+        transition-timing-function: $kendo-scrollview-transition-timing-function;
         transform: translateX( calc( -100% / var(--kendo-scrollview-views, 1) * ( var(--kendo-scrollview-current, 1) - 1) ) );
 
         .k-scrollview-view {
@@ -77,8 +77,8 @@
         position: absolute;
         left: 0;
         right: 0;
-        bottom: $scrollview-pager-offset;
-        height: $scrollview-pager-height;
+        bottom: $kendo-scrollview-pager-offset;
+        height: $kendo-scrollview-pager-height;
         text-align: center;
     }
 
@@ -95,7 +95,7 @@
     .k-scrollview-pageable,
     .k-scrollview-nav {
         margin: 0;
-        padding: $scrollview-pager-item-spacing;
+        padding: $kendo-scrollview-pager-item-spacing;
         max-width: 100%;
         box-sizing: border-box;
         line-height: 0;
@@ -116,11 +116,11 @@
     .k-scrollview-pageable > .k-button,
     .k-scrollview-nav > .k-link {
         margin-block: 0;
-        margin-inline: k-math-div( $scrollview-pager-item-spacing, 2 );
+        margin-inline: k-math-div( $kendo-scrollview-pager-item-spacing, 2 );
         padding: 0;
-        width: $scrollview-pagebutton-size;
-        height: $scrollview-pagebutton-size;
-        border-width: $scrollview-pager-item-border-width;
+        width: $kendo-scrollview-pagebutton-size;
+        height: $kendo-scrollview-pagebutton-size;
+        border-width: $kendo-scrollview-pager-item-border-width;
         border-style: solid;
         border-radius: 50%;
         box-sizing: content-box;
@@ -133,8 +133,8 @@
 
         &::before {
             content: "";
-            width: ($scrollview-pagebutton-size + $scrollview-pager-item-spacing);
-            height: ($scrollview-pagebutton-size + $scrollview-pager-item-spacing);
+            width: ($kendo-scrollview-pagebutton-size + $kendo-scrollview-pager-item-spacing);
+            height: ($kendo-scrollview-pagebutton-size + $kendo-scrollview-pager-item-spacing);
             display: block;
             position: absolute;
             top: 50%;
@@ -162,7 +162,7 @@
             margin: 0;
             padding: 0;
             vertical-align: middle;
-            font-size: $scrollview-arrow-icon-size;
+            font-size: $kendo-scrollview-arrow-icon-size;
             font-weight: normal;
         }
     }

package/scss/scrollview/_theme.scss

@@ -4,19 +4,19 @@
     kendo-scrollview.k-scrollview,
     div.k-scrollview {
         @include fill(
-            $scrollview-text,
-            $scrollview-bg,
-            $scrollview-border
+            $kendo-scrollview-text,
+            $kendo-scrollview-bg,
+            $kendo-scrollview-border
         );
 
         &.k-scrollview-dark {
             kendo-scrollview-pager,
             .k-scrollview-nav-wrap {
-                background-color: $scrollview-dark-bg;
+                background-color: $kendo-scrollview-dark-bg;
             }
             .k-scrollview-next,
             .k-scrollview-prev {
-                color: $scrollview-dark-bg;
+                color: $kendo-scrollview-dark-bg;
 
             }
         }
@@ -24,7 +24,7 @@
         &.k-scrollview-light {
             kendo-scrollview-pager,
             .k-scrollview-nav-wrap {
-                background-color: $scrollview-light-bg;
+                background-color: $kendo-scrollview-light-bg;
             }
 
         }
@@ -36,32 +36,32 @@
 
     }
     .k-scrollview-elements {
-        color: $scrollview-navigation-color;
+        color: $kendo-scrollview-navigation-color;
     }
 
     .k-scrollview-next,
     .k-scrollview-prev {
-        color: $scrollview-navigation-color;
-        background-color: $scrollview-navigation-bg;
-        text-shadow: $scrollview-navigation-icon-shadow;
-        opacity: $scrollview-navigation-default-opacity;
+        color: $kendo-scrollview-navigation-color;
+        background-color: $kendo-scrollview-navigation-bg;
+        text-shadow: $kendo-scrollview-navigation-icon-shadow;
+        opacity: $kendo-scrollview-navigation-default-opacity;
         outline-width: 0;
-        -webkit-tap-highlight-color: $scrollview-arrow-tap-highlight-color;
+        -webkit-tap-highlight-color: $kendo-scrollview-arrow-tap-highlight-color;
 
         &:focus,
         &.k-focus {
-            color: $scrollview-navigation-color;
-            opacity: $scrollview-navigation-hover-opacity;
+            color: $kendo-scrollview-navigation-color;
+            opacity: $kendo-scrollview-navigation-hover-opacity;
 
             .k-icon::before {
-                box-shadow: $scrollview-pagebutton-shadow;
+                @include focus-indicator( $kendo-scrollview-pagebutton-shadow );
             }
         }
 
         &:hover,
         &.k-hover {
-            color: $scrollview-navigation-color;
-            opacity: $scrollview-navigation-hover-opacity;
+            color: $kendo-scrollview-navigation-color;
+            opacity: $kendo-scrollview-navigation-hover-opacity;
 
         }
     }
@@ -69,23 +69,23 @@
     // refactor when https://github.com/telerik/kendo-angular-scrollview/issues/130 is done
     .k-scrollview-pageable > .k-button,
     .k-scrollview-nav > .k-link {
-        background: $scrollview-pagebutton-bg;
-        border: $scrollview-pagebutton-border;
+        background: $kendo-scrollview-pagebutton-bg;
+        border: $kendo-scrollview-pagebutton-border;
 
         &.k-primary {
-            background: $scrollview-pagebutton-primary-bg;
-            border: $scrollview-pagebutton-primary-border;
+            background: $kendo-scrollview-pagebutton-primary-bg;
+            border: $kendo-scrollview-pagebutton-primary-border;
         }
 
         &:focus,
         &.k-focus {
-            box-shadow: $scrollview-pagebutton-shadow;
+            @include focus-indicator( $kendo-scrollview-pagebutton-shadow );
         }
     }
 
     .k-scrollview-nav > .k-link:hover,
     .k-scrollview-nav > .k-link.k-hover {
-        box-shadow: $scrollview-pagebutton-shadow;
+        box-shadow: $kendo-scrollview-pagebutton-shadow;
     }
 
     .k-scrollview-pageable > .k-button {

package/scss/scrollview/_variables.scss

@@ -1,40 +1,40 @@
 // Scrollview
-$scrollview-border-width: 1px !default;
-$scrollview-font-family: $font-family !default;
-$scrollview-font-size: $font-size !default;
-$scrollview-line-height: $line-height !default;
+$kendo-scrollview-border-width: 1px !default;
+$kendo-scrollview-font-family: $kendo-font-family !default;
+$kendo-scrollview-font-size: $kendo-font-size-md !default;
+$kendo-scrollview-line-height: $kendo-line-height-md !default;
 
-$scrollview-bg: $kendo-component-bg !default;
-$scrollview-text: $kendo-component-text !default;
-$scrollview-border: $kendo-component-border !default;
+$kendo-scrollview-bg: $kendo-component-bg !default;
+$kendo-scrollview-text: $kendo-component-text !default;
+$kendo-scrollview-border: $kendo-component-border !default;
 
-$scrollview-pagebutton-size: 10px !default;
-$scrollview-pagebutton-bg: $kendo-button-bg !default;
-$scrollview-pagebutton-border: $kendo-button-border !default;
-$scrollview-pagebutton-primary-bg: $kendo-color-primary !default;
-$scrollview-pagebutton-primary-border: $kendo-color-primary !default;
-$scrollview-pagebutton-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
+$kendo-scrollview-pagebutton-size: 10px !default;
+$kendo-scrollview-pagebutton-bg: $kendo-button-bg !default;
+$kendo-scrollview-pagebutton-border: $kendo-button-border !default;
+$kendo-scrollview-pagebutton-primary-bg: $kendo-color-primary !default;
+$kendo-scrollview-pagebutton-primary-border: $kendo-color-primary !default;
+$kendo-scrollview-pagebutton-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
 
-$scrollview-pager-offset: 0 !default;
-$scrollview-pager-item-spacing: 20px !default;
-$scrollview-pager-item-border-width: 0px !default;
-$scrollview-pager-height: calc( #{$scrollview-pagebutton-size} + #{$scrollview-pager-item-border-width * 2} + #{$scrollview-pager-item-spacing * 2} ) !default;
+$kendo-scrollview-pager-offset: 0 !default;
+$kendo-scrollview-pager-item-spacing: 20px !default;
+$kendo-scrollview-pager-item-border-width: 0px !default;
+$kendo-scrollview-pager-height: calc( #{$kendo-scrollview-pagebutton-size} + #{$kendo-scrollview-pager-item-border-width * 2} + #{$kendo-scrollview-pager-item-spacing * 2} ) !default;
 
-$scrollview-pager-multidot-threshold: 10 !default;
-$scrollview-pager-multidot-intermediate: 3 !default;
-$scrollview-pager-multidot-step: 1px !default;
+$kendo-scrollview-pager-multidot-threshold: 10 !default;
+$kendo-scrollview-pager-multidot-intermediate: 3 !default;
+$kendo-scrollview-pager-multidot-step: 1px !default;
 
-$scrollview-arrow-icon-size: 4.5em !default;
-$scrollview-arrow-tap-highlight-color: $kendo-color-rgba-transparent !default;
-$scrollview-navigation-color: white !default;
-$scrollview-navigation-icon-shadow: rgba(0, 0, 0, .3) 0 0 15px !default;
-$scrollview-navigation-bg: rgba(0, 0, 0, 0) !default;
-$scrollview-navigation-default-opacity: .7 !default;
-$scrollview-navigation-hover-opacity: 1 !default;
-$scrollview-navigation-hover-span-bg: null !default;
+$kendo-scrollview-arrow-icon-size: 4.5em !default;
+$kendo-scrollview-arrow-tap-highlight-color: $kendo-color-rgba-transparent !default;
+$kendo-scrollview-navigation-color: white !default;
+$kendo-scrollview-navigation-icon-shadow: rgba(0, 0, 0, .3) 0 0 15px !default;
+$kendo-scrollview-navigation-bg: rgba(0, 0, 0, 0) !default;
+$kendo-scrollview-navigation-default-opacity: .7 !default;
+$kendo-scrollview-navigation-hover-opacity: 1 !default;
+$kendo-scrollview-navigation-hover-span-bg: null !default;
 
-$scrollview-light-bg: rgba(255, 255, 255, .4) !default;
-$scrollview-dark-bg: rgba(0, 0, 0, .4) !default;
+$kendo-scrollview-light-bg: rgba(255, 255, 255, .4) !default;
+$kendo-scrollview-dark-bg: rgba(0, 0, 0, .4) !default;
 
-$scrollview-transition-duration: .3s !default;
-$scrollview-transition-timing-function: ease-in-out !default;
+$kendo-scrollview-transition-duration: .3s !default;
+$kendo-scrollview-transition-timing-function: ease-in-out !default;

package/scss/signature/_variables.scss

@@ -7,41 +7,41 @@ $kendo-signature-maximized-width: 750px !default;
 $kendo-signature-maximized-height: 252px !default;
 
 $kendo-signature-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
-$kendo-signature-padding-x-sm: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
-$kendo-signature-padding-x-md: k-map-get( $kendo-spacing, 1 ) !default;
-$kendo-signature-padding-x-lg: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-signature-sm-padding-x: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-signature-md-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-signature-lg-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 
 $kendo-signature-padding-y: $kendo-signature-padding-x !default;
-$kendo-signature-padding-y-sm: $kendo-signature-padding-x-sm !default;
-$kendo-signature-padding-y-md: $kendo-signature-padding-x-md !default;
-$kendo-signature-padding-y-lg: $kendo-signature-padding-x-lg !default;
+$kendo-signature-sm-padding-y: $kendo-signature-sm-padding-x !default;
+$kendo-signature-md-padding-y: $kendo-signature-md-padding-x !default;
+$kendo-signature-lg-padding-y: $kendo-signature-lg-padding-x !default;
 
 $kendo-signature-line-width: 1px !default;
 $kendo-signature-line-style: dashed !default;
 $kendo-signature-line-color: rgba( $kendo-color-info, .24 ) !default;
 
 $kendo-signature-line-size: calc( 100% - 2 * #{$kendo-signature-padding-x} ) !default;
-$kendo-signature-line-size-sm: calc( 100% - 2 * #{$kendo-signature-padding-x-sm} ) !default;
-$kendo-signature-line-size-md: calc( 100% - 2 * #{$kendo-signature-padding-x-md} ) !default;
-$kendo-signature-line-size-lg: calc( 100% - 2 * #{$kendo-signature-padding-x-lg} ) !default;
+$kendo-signature-sm-line-size: calc( 100% - 2 * #{$kendo-signature-sm-padding-x} ) !default;
+$kendo-signature-md-line-size: calc( 100% - 2 * #{$kendo-signature-md-padding-x} ) !default;
+$kendo-signature-lg-line-size: calc( 100% - 2 * #{$kendo-signature-lg-padding-x} ) !default;
 
 $kendo-signature-line-bottom-offset: 33% !default;
 
 $kendo-signature-sizes: (
     sm: (
-        padding-x: $kendo-signature-padding-x-sm,
-        padding-y: $kendo-signature-padding-y-sm,
-        line-size: $kendo-signature-line-size-sm
+        padding-x: $kendo-signature-sm-padding-x,
+        padding-y: $kendo-signature-sm-padding-y,
+        line-size: $kendo-signature-sm-line-size
     ),
     md: (
-        padding-x: $kendo-signature-padding-x-md,
-        padding-y: $kendo-signature-padding-y-md,
-        line-size: $kendo-signature-line-size-md
+        padding-x: $kendo-signature-md-padding-x,
+        padding-y: $kendo-signature-md-padding-y,
+        line-size: $kendo-signature-md-line-size
     ),
     lg: (
-        padding-x: $kendo-signature-padding-x-lg,
-        padding-y: $kendo-signature-padding-y-lg,
-        line-size: $kendo-signature-line-size-lg
+        padding-x: $kendo-signature-lg-padding-x,
+        padding-y: $kendo-signature-lg-padding-y,
+        line-size: $kendo-signature-lg-line-size
     )
 ) !default;
 

package/scss/skeleton/_layout.scss

@@ -5,8 +5,8 @@
     }
 
     .k-skeleton-text {
-        border-radius: $skeleton-text-border-radius;
-        transform: $skeleton-text-transform;
+        border-radius: $kendo-skeleton-text-border-radius;
+        transform: $kendo-skeleton-text-transform;
 
         &:empty::before {
             content: "\200b";
@@ -14,11 +14,11 @@
     }
 
     .k-skeleton-rect {
-        border-radius: $skeleton-rect-border-radius;
+        border-radius: $kendo-skeleton-rect-border-radius;
     }
 
     .k-skeleton-circle {
-        border-radius: $skeleton-circle-border-radius;
+        border-radius: $kendo-skeleton-circle-border-radius;
     }
 
 

package/scss/skeleton/_theme.scss

@@ -1,7 +1,7 @@
 @include exports("skeleton/theme") {
 
     .k-skeleton {
-        @include fill( $bg: $skeleton-item-bg );
+        @include fill( $bg: $kendo-skeleton-item-bg );
     }
 
 }
@@ -16,7 +16,7 @@
             background-image: linear-gradient(
                 to right,
                 transparent,
-                $skeleton-wave-bg,
+                $kendo-skeleton-wave-bg,
                 transparent
             );
         }

package/scss/skeleton/_variables.scss

@@ -1,11 +1,11 @@
 // Skeleton
-$skeleton-text-transform: scale( 1, .6 ) !default;
-$skeleton-text-border-radius: $kendo-border-radius-md !default;
+$kendo-skeleton-text-transform: scale( 1, .6 ) !default;
+$kendo-skeleton-text-border-radius: $kendo-border-radius-md !default;
 
-$skeleton-rect-border-radius: 0 !default;
+$kendo-skeleton-rect-border-radius: 0 !default;
 
-$skeleton-circle-border-radius: 9999px !default;
+$kendo-skeleton-circle-border-radius: 9999px !default;
 
-$skeleton-item-bg: rgba( $kendo-color-inverse, .2 ) !default;
+$kendo-skeleton-item-bg: rgba( $kendo-color-inverse, .2 ) !default;
 
-$skeleton-wave-bg: rgba( black, .04 ) !default;
+$kendo-skeleton-wave-bg: rgba( black, .04 ) !default;