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

package/scss/tabstrip/_variables.scss

@@ -1,108 +1,108 @@
 // Tabstrip
-$tabstrip-wrapper-padding-x: 0px !default;
-$tabstrip-wrapper-padding-y: 0px !default;
-$tabstrip-wrapper-border-width: 0px !default;
+$kendo-tabstrip-wrapper-padding-x: 0px !default;
+$kendo-tabstrip-wrapper-padding-y: 0px !default;
+$kendo-tabstrip-wrapper-border-width: 0px !default;
 
-$tabstrip-font-family: $font-family !default;
-$tabstrip-font-size: $font-size !default;
-$tabstrip-line-height: $line-height !default;
-$tabstrip-border-width: 1px !default;
+$kendo-tabstrip-font-family: $kendo-font-family !default;
+$kendo-tabstrip-font-size: $kendo-font-size-md !default;
+$kendo-tabstrip-line-height: $kendo-line-height-md !default;
+$kendo-tabstrip-border-width: 1px !default;
 
-$tabstrip-wrapper-bg: null !default;
-$tabstrip-wrapper-text: null !default;
-$tabstrip-wrapper-border: null !default;
+$kendo-tabstrip-wrapper-bg: null !default;
+$kendo-tabstrip-wrapper-text: null !default;
+$kendo-tabstrip-wrapper-border: null !default;
 
 /// Background color of tabstrip component
 /// @group tabstrip
-$tabstrip-bg: null !default;
+$kendo-tabstrip-bg: null !default;
 /// Text color of tabstrip component
 /// @group tabstrip
-$tabstrip-text: $kendo-component-text !default;
+$kendo-tabstrip-text: $kendo-component-text !default;
 /// Border color of tabstrip component
 /// @group tabstrip
-$tabstrip-border: $kendo-component-border !default;
+$kendo-tabstrip-border: $kendo-component-border !default;
 
 /// Horizontal padding of tabs
 /// @group tabstrip
-$tabstrip-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-tabstrip-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 /// Vertical padding of tabs
 /// @group tabstrip
-$tabstrip-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-tabstrip-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 /// Width of border around tabs
 /// @group tabstrip
-$tabstrip-item-border-width: 1px !default;
+$kendo-tabstrip-item-border-width: 1px !default;
 /// Border radius of tabs
 /// @group tabstrip
-$tabstrip-item-border-radius: $kendo-border-radius-md !default;
+$kendo-tabstrip-item-border-radius: $kendo-border-radius-md !default;
 /// Spacing between tabs
 /// @group tabstrip
-$tabstrip-item-gap: 0 !default;
+$kendo-tabstrip-item-gap: 0 !default;
 
 /// Background color of tabs
 /// @group tabstrip
-$tabstrip-item-bg: $base-bg !default;
+$kendo-tabstrip-item-bg: $kendo-base-bg !default;
 /// Text color of tabs
 /// @group tabstrip
-$tabstrip-item-text: $base-text !default;
+$kendo-tabstrip-item-text: $kendo-base-text !default;
 /// Border color of tabs
 /// @group tabstrip
-$tabstrip-item-border: $base-border !default;
+$kendo-tabstrip-item-border: $kendo-base-border !default;
 /// Background gradient of tabs
 /// @group tabstrip
-$tabstrip-item-gradient: $base-gradient !default;
+$kendo-tabstrip-item-gradient: $kendo-base-gradient !default;
 
 /// Background color of hovered tabs
 /// @group tabstrip
-$tabstrip-item-hover-bg: $kendo-hover-bg !default;
+$kendo-tabstrip-item-hover-bg: $kendo-hover-bg !default;
 /// Text color of hovered tabs
 /// @group tabstrip
-$tabstrip-item-hover-text: $kendo-hover-text !default;
+$kendo-tabstrip-item-hover-text: $kendo-hover-text !default;
 /// Border color of hovered tabs
 /// @group tabstrip
-$tabstrip-item-hover-border: $kendo-hover-border !default;
+$kendo-tabstrip-item-hover-border: $kendo-hover-border !default;
 /// Background gradient of hovered tabs
 /// @group tabstrip
-$tabstrip-item-hover-gradient: null !default;
+$kendo-tabstrip-item-hover-gradient: null !default;
 
 /// Background color of selected tabs
 /// @group tabstrip
-$tabstrip-item-selected-bg: $kendo-component-bg !default;
+$kendo-tabstrip-item-selected-bg: $kendo-component-bg !default;
 /// Text color of selected tabs
 /// @group tabstrip
-$tabstrip-item-selected-text: $kendo-component-text !default;
+$kendo-tabstrip-item-selected-text: $kendo-component-text !default;
 /// Border color of selected tabs
 /// @group tabstrip
-$tabstrip-item-selected-border: $kendo-component-border !default;
+$kendo-tabstrip-item-selected-border: $kendo-component-border !default;
 /// Background gradient of selected tabs
 /// @group tabstrip
-$tabstrip-item-selected-gradient: false !default;
+$kendo-tabstrip-item-selected-gradient: false !default;
 
-$tabstrip-item-focus-shadow: $kendo-list-item-focus-shadow !default;
+$kendo-tabstrip-item-focus-shadow: $kendo-list-item-focus-shadow !default;
 
-$tabstrip-item-dragging-shadow: 0px 3px 4px rgba( black, .15 ) !default;
+$kendo-tabstrip-item-dragging-shadow: 0px 3px 4px rgba( black, .15 ) !default;
 
-$tabstrip-indicator-size: null !default;
-$tabstrip-indicator-color: null !default;
+$kendo-tabstrip-indicator-size: null !default;
+$kendo-tabstrip-indicator-color: null !default;
 
 /// Horizontal padding of tabstrip content
 /// @group tabstrip
-$tabstrip-content-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-tabstrip-content-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 /// Vertical padding of tabstrip content
 /// @group tabstrip
-$tabstrip-content-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-tabstrip-content-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
 /// Width of border around tabstrip content
 /// @group tabstrip
-$tabstrip-content-border-width: 1px !default;
+$kendo-tabstrip-content-border-width: 1px !default;
 
 /// Background color of tabstrip content
 /// @group tabstrip
-$tabstrip-content-bg: $kendo-component-bg !default;
+$kendo-tabstrip-content-bg: $kendo-component-bg !default;
 /// Text color of tabstrip content
 /// @group tabstrip
-$tabstrip-content-text: $kendo-component-text !default;
+$kendo-tabstrip-content-text: $kendo-component-text !default;
 /// Border color of tabstrip content
 /// @group tabstrip
-$tabstrip-content-border: $kendo-component-border !default;
+$kendo-tabstrip-content-border: $kendo-component-border !default;
 /// Border color of tabstrip focused content
 /// @group tabstrip
-$tabstrip-content-focus-border: $kendo-component-text !default;
+$kendo-tabstrip-content-focus-border: $kendo-component-text !default;

package/scss/taskboard/_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/taskboard/_variables.scss

@@ -1,94 +1,94 @@
 // TaskBoard
-$taskboard-spacer: k-map-get( $kendo-spacing, 4 ) !default;
-$taskboard-padding-y: null !default;
-$taskboard-padding-x: null !default;
-$taskboard-font-family: $font-family !default;
-$taskboard-font-size: $font-size !default;
-$taskboard-line-height: $line-height !default;
-$taskboard-bg: null !default;
-$taskboard-text: null !default;
-$taskboard-border: null !default;
-
-$taskboard-toolbar-padding-y: $taskboard-spacer !default;
-$taskboard-toolbar-padding-x: $taskboard-toolbar-padding-y !default;
-$taskboard-toolbar-bg: null !default;
-$taskboard-toolbar-text: null !default;
-$taskboard-toolbar-border: null !default;
-$taskboard-toolbar-gradient: null !default;
-
-$taskboard-content-padding-y: $taskboard-spacer !default;
-$taskboard-content-padding-x: $taskboard-content-padding-y !default;
-
-$taskboard-column-container-spacing-y: k-math-div( $taskboard-spacer, 2 ) !default;
-$taskboard-column-container-padding-y: 0px !default;
-$taskboard-column-container-padding-x: k-math-div( $taskboard-spacer, 2 ) !default;
-$taskboard-columns-container-gap: $taskboard-spacer !default;
-
-$taskboard-column-width: 320px !default;
-$taskboard-column-border-width: 1px !default;
-$taskboard-column-border-radius: $kendo-border-radius-md !default;
-$taskboard-column-bg: $base-bg !default;
-$taskboard-column-text: null !default;
-$taskboard-column-border: transparent !default;
-
-$taskboard-column-focus-bg: null !default;
-$taskboard-column-focus-text: null !default;
-$taskboard-column-focus-border: k-try-shade( $base-border, 2.5 ) !default;
-
-$taskboard-column-header-padding-y: k-math-div( $taskboard-spacer, 2 ) !default;
-$taskboard-column-header-padding-x: $taskboard-column-header-padding-y !default;
-$taskboard-column-header-gap: k-math-div( $taskboard-spacer, 4 ) !default;
-$taskboard-column-header-actions-gap: k-math-div( $taskboard-spacer, 2 ) !default;
-$taskboard-column-header-font-weight: 500 !default;
-$taskboard-column-header-text: $kendo-component-header-text !default;
-
-$taskboard-column-cards-padding-y: null !default;
-$taskboard-column-cards-padding-x: null !default;
-$taskboard-column-cards-gap: k-math-div( $taskboard-spacer, 2 ) !default;
-
-$taskboard-pane-width: $taskboard-column-width !default;
-$taskboard-pane-padding-y: null !default;
-$taskboard-pane-padding-x: null !default;
-$taskboard-pane-border-width: 1px !default;
-$taskboard-pane-bg: $kendo-component-bg !default;
-$taskboard-pane-text: $kendo-component-text !default;
-$taskboard-pane-border: $kendo-component-border !default;
-
-$taskboard-pane-header-padding-y: ( $taskboard-spacer * .75 ) !default;
-$taskboard-pane-header-padding-x: $taskboard-spacer !default;
-$taskboard-pane-header-font-weight: 500 !default;
-$taskboard-pane-header-text: $kendo-component-header-text !default;
-
-$taskboard-pane-content-padding-y: 0px !default;
-$taskboard-pane-content-padding-x: $taskboard-spacer !default;
-
-$taskboard-pane-actions-padding-y: ( $taskboard-spacer * .75 ) !default;
-$taskboard-pane-actions-padding-x: $taskboard-spacer !default;
-
-$taskboard-card-padding-y: $taskboard-spacer !default;
-$taskboard-card-padding-x: $taskboard-card-padding-y !default;
-$taskboard-card-border-width: $card-border-width !default;
-$taskboard-card-border-radius: $card-border-radius !default;
-$taskboard-card-bg: $card-bg !default;
-$taskboard-card-text: $card-text !default;
-$taskboard-card-border: $card-border !default;
-$taskboard-card-shadow: $card-shadow !default;
-
-$taskboard-card-category-border-width: 4px !default;
-
-$taskboard-card-focus-border: k-try-shade( $taskboard-card-border, 18% ) !default;
-$taskboard-card-focus-shadow: none !default;
-
-$taskboard-card-hover-border: k-try-shade( $taskboard-card-border, 10% ) !default;
-
-$taskboard-card-selected-border: k-color-tint( $kendo-color-primary-lighter, 5 ) !default;
-$taskboard-card-selected-shadow: none !default;
-
-$taskboard-card-header-text: $kendo-color-primary !default;
-$taskboard-card-header-focus-text: $kendo-color-primary-darker !default;
-$taskboard-card-header-hover-text: $kendo-color-primary-darker !default;
-
-$taskboard-drag-placeholder-border-width: 1px !default;
-$taskboard-drag-placeholder-border-radius: $taskboard-card-border-radius !default;
-$taskboard-drag-placeholder-bg: rgba( white, .2 ) !default;
-$taskboard-drag-placeholder-border: $kendo-component-border !default;
+$kendo-taskboard-spacer: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-taskboard-padding-y: null !default;
+$kendo-taskboard-padding-x: null !default;
+$kendo-taskboard-font-family: $kendo-font-family !default;
+$kendo-taskboard-font-size: $kendo-font-size-md !default;
+$kendo-taskboard-line-height: $kendo-line-height-md !default;
+$kendo-taskboard-bg: null !default;
+$kendo-taskboard-text: null !default;
+$kendo-taskboard-border: null !default;
+
+$kendo-taskboard-toolbar-padding-y: $kendo-taskboard-spacer !default;
+$kendo-taskboard-toolbar-padding-x: $kendo-taskboard-toolbar-padding-y !default;
+$kendo-taskboard-toolbar-bg: null !default;
+$kendo-taskboard-toolbar-text: null !default;
+$kendo-taskboard-toolbar-border: null !default;
+$kendo-taskboard-toolbar-gradient: null !default;
+
+$kendo-taskboard-content-padding-y: $kendo-taskboard-spacer !default;
+$kendo-taskboard-content-padding-x: $kendo-taskboard-content-padding-y !default;
+
+$kendo-taskboard-column-container-spacing-y: k-math-div( $kendo-taskboard-spacer, 2 ) !default;
+$kendo-taskboard-column-container-padding-y: 0px !default;
+$kendo-taskboard-column-container-padding-x: k-math-div( $kendo-taskboard-spacer, 2 ) !default;
+$kendo-taskboard-columns-container-gap: $kendo-taskboard-spacer !default;
+
+$kendo-taskboard-column-width: 320px !default;
+$kendo-taskboard-column-border-width: 1px !default;
+$kendo-taskboard-column-border-radius: $kendo-border-radius-md !default;
+$kendo-taskboard-column-bg: $kendo-base-bg !default;
+$kendo-taskboard-column-text: null !default;
+$kendo-taskboard-column-border: transparent !default;
+
+$kendo-taskboard-column-focus-bg: null !default;
+$kendo-taskboard-column-focus-text: null !default;
+$kendo-taskboard-column-focus-border: k-try-shade( $kendo-base-border, 2.5 ) !default;
+
+$kendo-taskboard-column-header-padding-y: k-math-div( $kendo-taskboard-spacer, 2 ) !default;
+$kendo-taskboard-column-header-padding-x: $kendo-taskboard-column-header-padding-y !default;
+$kendo-taskboard-column-header-gap: k-math-div( $kendo-taskboard-spacer, 4 ) !default;
+$kendo-taskboard-column-header-actions-gap: k-math-div( $kendo-taskboard-spacer, 2 ) !default;
+$kendo-taskboard-column-header-font-weight: 500 !default;
+$kendo-taskboard-column-header-text: $kendo-component-header-text !default;
+
+$kendo-taskboard-column-cards-padding-y: null !default;
+$kendo-taskboard-column-cards-padding-x: null !default;
+$kendo-taskboard-column-cards-gap: k-math-div( $kendo-taskboard-spacer, 2 ) !default;
+
+$kendo-taskboard-pane-width: $kendo-taskboard-column-width !default;
+$kendo-taskboard-pane-padding-y: null !default;
+$kendo-taskboard-pane-padding-x: null !default;
+$kendo-taskboard-pane-border-width: 1px !default;
+$kendo-taskboard-pane-bg: $kendo-component-bg !default;
+$kendo-taskboard-pane-text: $kendo-component-text !default;
+$kendo-taskboard-pane-border: $kendo-component-border !default;
+
+$kendo-taskboard-pane-header-padding-y: ( $kendo-taskboard-spacer * .75 ) !default;
+$kendo-taskboard-pane-header-padding-x: $kendo-taskboard-spacer !default;
+$kendo-taskboard-pane-header-font-weight: 500 !default;
+$kendo-taskboard-pane-header-text: $kendo-component-header-text !default;
+
+$kendo-taskboard-pane-content-padding-y: 0px !default;
+$kendo-taskboard-pane-content-padding-x: $kendo-taskboard-spacer !default;
+
+$kendo-taskboard-pane-actions-padding-y: ( $kendo-taskboard-spacer * .75 ) !default;
+$kendo-taskboard-pane-actions-padding-x: $kendo-taskboard-spacer !default;
+
+$kendo-taskboard-card-padding-y: $kendo-taskboard-spacer !default;
+$kendo-taskboard-card-padding-x: $kendo-taskboard-card-padding-y !default;
+$kendo-taskboard-card-border-width: $kendo-card-border-width !default;
+$kendo-taskboard-card-border-radius: $kendo-card-border-radius !default;
+$kendo-taskboard-card-bg: $kendo-card-bg !default;
+$kendo-taskboard-card-text: $kendo-card-text !default;
+$kendo-taskboard-card-border: $kendo-card-border !default;
+$kendo-taskboard-card-shadow: $kendo-card-shadow !default;
+
+$kendo-taskboard-card-category-border-width: 4px !default;
+
+$kendo-taskboard-card-focus-border: k-try-shade( $kendo-taskboard-card-border, 18% ) !default;
+$kendo-taskboard-card-focus-shadow: none !default;
+
+$kendo-taskboard-card-hover-border: k-try-shade( $kendo-taskboard-card-border, 10% ) !default;
+
+$kendo-taskboard-card-selected-border: k-color-tint( $kendo-color-primary-lighter, 5 ) !default;
+$kendo-taskboard-card-selected-shadow: none !default;
+
+$kendo-taskboard-card-header-text: $kendo-color-primary !default;
+$kendo-taskboard-card-header-focus-text: $kendo-color-primary-darker !default;
+$kendo-taskboard-card-header-hover-text: $kendo-color-primary-darker !default;
+
+$kendo-taskboard-drag-placeholder-border-width: 1px !default;
+$kendo-taskboard-drag-placeholder-border-radius: $kendo-taskboard-card-border-radius !default;
+$kendo-taskboard-drag-placeholder-bg: rgba( white, .2 ) !default;
+$kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;

package/scss/tilelayout/_variables.scss

@@ -1,12 +1,12 @@
 // TileLayout
-$tilelayout-border-width: 0px !default;
-$tilelayout-card-border-width: $card-border-width !default;
-$tilelayout-card-focus-shadow: $card-focus-shadow !default;
+$kendo-tile-layout-border-width: 0px !default;
+$kendo-tile-layout-card-border-width: $kendo-card-border-width !default;
+$kendo-tile-layout-card-focus-shadow: $kendo-card-focus-shadow !default;
 
-$tilelayout-hint-border-width: 1px !default;
-$tilelayout-hint-border-radius: $kendo-border-radius-lg !default;
+$kendo-tile-layout-hint-border-width: 1px !default;
+$kendo-tile-layout-hint-border-radius: $kendo-border-radius-lg !default;
 
-$tilelayout-bg: $base-bg !default;
+$kendo-tile-layout-bg: $kendo-base-bg !default;
 
-$tilelayout-hint-bg: rgba( white, .2 ) !default;
-$tilelayout-hint-border: $kendo-component-border !default;
+$kendo-tile-layout-hint-bg: rgba( white, .2 ) !default;
+$kendo-tile-layout-hint-border: $kendo-component-border !default;

package/scss/timedurationpicker/_index.scss

@@ -2,7 +2,7 @@
 
 
 // Dependencies
-@import "../icons/index";
+@import "../icons/_index.scss";
 @import "../button/_index.scss";
 @import "../input/_index.scss";
 @import "../popup/_index.scss";

package/scss/timeline/_variables.scss

@@ -1,66 +1,66 @@
 // Timeline
-$timeline-spacing-x: 40px !default;
-$timeline-spacing-y: 40px !default;
-$timeline-items-padding: 16px !default;
+$kendo-timeline-spacing-x: 40px !default;
+$kendo-timeline-spacing-y: 40px !default;
+$kendo-timeline-items-padding: 16px !default;
 
-$timeline-font-family: $font-family !default;
-$timeline-font-size: $font-size !default;
-$timeline-line-height: $line-height !default;
+$kendo-timeline-font-family: $kendo-font-family !default;
+$kendo-timeline-font-size: $kendo-font-size-md !default;
+$kendo-timeline-line-height: $kendo-line-height-md !default;
 
-$timeline-mobile-spacing-x: 16px !default;
-$timeline-mobile-spacing-y: 16px !default;
+$kendo-timeline-mobile-spacing-x: 16px !default;
+$kendo-timeline-mobile-spacing-y: 16px !default;
 
-$timeline-track-arrow-width: 30px !default;
-$timeline-track-arrow-height: 30px !default;
+$kendo-timeline-track-arrow-width: 30px !default;
+$kendo-timeline-track-arrow-height: 30px !default;
 
-$timeline-track-arrow-disabled-text: k-true-mix( $kendo-button-text, $kendo-body-bg, 65% ) !default;
-$timeline-track-arrow-disabled-bg: k-true-mix( $kendo-button-bg, $kendo-body-bg, 65% ) !default;
-$timeline-track-arrow-disabled-border: k-true-mix( #000000, $kendo-body-bg, 4.8% ) !default;
+$kendo-timeline-track-arrow-disabled-text: k-true-mix( $kendo-button-text, $kendo-body-bg, 65% ) !default;
+$kendo-timeline-track-arrow-disabled-bg: k-true-mix( $kendo-button-bg, $kendo-body-bg, 65% ) !default;
+$kendo-timeline-track-arrow-disabled-border: k-true-mix( #000000, $kendo-body-bg, 4.8% ) !default;
 
-$timeline-track-size: 6px !default;
-$timeline-track-wrap-padding-bottom: k-math-div( $timeline-track-size, 2 ) !default;
-$timeline-track-border-width: 1px !default;
-$timeline-track-margin-bottom: 16px !default;
-$timeline-track-bottom-calc: calc(#{k-math-div( $timeline-track-arrow-height, 2 )} + #{$timeline-track-wrap-padding-bottom}) !default;
-$timeline-track-start-calc: calc(#{$timeline-track-arrow-width} - 2 * #{$timeline-track-border-width}) !default;
-$timeline-track-end-calc: calc(#{$timeline-track-arrow-width} - 2 * #{$timeline-track-border-width}) !default;
-$timeline-track-bg: $kendo-button-bg !default;
-$timeline-track-border-color: $kendo-button-border !default;
+$kendo-timeline-track-size: 6px !default;
+$kendo-timeline-track-wrap-padding-bottom: k-math-div( $kendo-timeline-track-size, 2 ) !default;
+$kendo-timeline-track-border-width: 1px !default;
+$kendo-timeline-track-margin-bottom: 16px !default;
+$kendo-timeline-track-bottom-calc: calc(#{k-math-div( $kendo-timeline-track-arrow-height, 2 )} + #{$kendo-timeline-track-wrap-padding-bottom}) !default;
+$kendo-timeline-track-start-calc: calc(#{$kendo-timeline-track-arrow-width} - 2 * #{$kendo-timeline-track-border-width}) !default;
+$kendo-timeline-track-end-calc: calc(#{$kendo-timeline-track-arrow-width} - 2 * #{$kendo-timeline-track-border-width}) !default;
+$kendo-timeline-track-bg: $kendo-button-bg !default;
+$kendo-timeline-track-border-color: $kendo-button-border !default;
 
-$timeline-track-item-focus-shadow: 0 3px 4px 0 rgba( $kendo-color-primary, .4 ) !default;
+$kendo-timeline-track-item-focus-shadow: 0 3px 4px 0 rgba( $kendo-color-primary, .4 ) !default;
 
-$timeline-track-event-offset: 36px !default;
+$kendo-timeline-track-event-offset: 36px !default;
 
-$timeline-flag-padding-x: $kendo-button-padding-x !default;
-$timeline-flag-padding-y: $kendo-button-padding-y !default;
-$timeline-flag-line-height: $kendo-button-line-height !default;
-$timeline-flag-min-width: 80px !default;
-$timeline-flag-max-width: calc(#{$timeline-flag-min-width} + 2 * #{$timeline-spacing-x}) !default;
-$timeline-mobile-flag-max-width: calc(#{$timeline-flag-min-width} + 2 * #{$timeline-mobile-spacing-x}) !default;
-$timeline-horizontal-flag-min-width: 60px !default;
-$timeline-flag-bg: $kendo-color-primary !default;
-$timeline-flag-text: k-contrast-legacy( $timeline-flag-bg ) !default;
+$kendo-timeline-flag-padding-x: $kendo-button-padding-x !default;
+$kendo-timeline-flag-padding-y: $kendo-button-padding-y !default;
+$kendo-timeline-flag-line-height: $kendo-button-line-height !default;
+$kendo-timeline-flag-min-width: 80px !default;
+$kendo-timeline-flag-max-width: calc(#{$kendo-timeline-flag-min-width} + 2 * #{$kendo-timeline-spacing-x}) !default;
+$kendo-timeline-mobile-flag-max-width: calc(#{$kendo-timeline-flag-min-width} + 2 * #{$kendo-timeline-mobile-spacing-x}) !default;
+$kendo-timeline-horizontal-flag-min-width: 60px !default;
+$kendo-timeline-flag-bg: $kendo-color-primary !default;
+$kendo-timeline-flag-text: k-contrast-legacy( $kendo-timeline-flag-bg ) !default;
 
-$timeline-flag-callout-width: 10px !default;
-$timeline-flag-callout-height: 10px !default;
+$kendo-timeline-flag-callout-width: 10px !default;
+$kendo-timeline-flag-callout-height: 10px !default;
 
-$timeline-flag-offset-bottom: 4px !default;
-$timeline-flag-margin-bottom-calc: calc(#{$timeline-track-size} + 2 * #{$timeline-track-border-width} + #{$timeline-flag-offset-bottom} + #{$timeline-flag-callout-height}) !default;
+$kendo-timeline-flag-offset-bottom: 4px !default;
+$kendo-timeline-flag-margin-bottom-calc: calc(#{$kendo-timeline-track-size} + 2 * #{$kendo-timeline-track-border-width} + #{$kendo-timeline-flag-offset-bottom} + #{$kendo-timeline-flag-callout-height}) !default;
 
-$timeline-date-width: 50px !default;
-$timeline-date-margin-bottom: 8px !default;
+$kendo-timeline-date-width: 50px !default;
+$kendo-timeline-date-margin-bottom: 8px !default;
 
-$timeline-vertical-padding-calc: calc(#{$timeline-spacing-x} + (#{$timeline-flag-min-width} - #{$timeline-track-size}) / 2) !default;
-$timeline-vertical-padding-with-dates-calc: calc(#{$timeline-vertical-padding-calc} + #{$timeline-date-width}) !default;
-$timeline-mobile-vertical-padding-calc: calc(#{$timeline-mobile-spacing-x} + (#{$timeline-flag-min-width} - #{$timeline-track-size}) / 2) !default;
-$timeline-mobile-vertical-padding-with-dates-calc: calc(#{$timeline-mobile-vertical-padding-calc} + #{$timeline-date-width}) !default;
+$kendo-timeline-vertical-padding-calc: calc(#{$kendo-timeline-spacing-x} + (#{$kendo-timeline-flag-min-width} - #{$kendo-timeline-track-size}) / 2) !default;
+$kendo-timeline-vertical-padding-with-dates-calc: calc(#{$kendo-timeline-vertical-padding-calc} + #{$kendo-timeline-date-width}) !default;
+$kendo-timeline-mobile-vertical-padding-calc: calc(#{$kendo-timeline-mobile-spacing-x} + (#{$kendo-timeline-flag-min-width} - #{$kendo-timeline-track-size}) / 2) !default;
+$kendo-timeline-mobile-vertical-padding-with-dates-calc: calc(#{$kendo-timeline-mobile-vertical-padding-calc} + #{$kendo-timeline-date-width}) !default;
 
-$timeline-circle-width: 16px !default;
-$timeline-circle-height: 16px !default;
-$timeline-circle-bg: $kendo-color-primary !default;
+$kendo-timeline-circle-width: 16px !default;
+$kendo-timeline-circle-height: 16px !default;
+$kendo-timeline-circle-bg: $kendo-color-primary !default;
 
-$timeline-collapse-arrow-padding-x: $kendo-padding-md-x !default;
+$kendo-timeline-collapse-arrow-padding-x: $kendo-padding-md-x !default;
 
-$timeline-event-width: 400px !default;
-$timeline-event-height: 600px !default;
-$timeline-event-min-height-calc: calc(2 * (#{$timeline-track-event-offset} - #{$card-border-width})) !default;
+$kendo-timeline-event-width: 400px !default;
+$kendo-timeline-event-height: 600px !default;
+$kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-offset} - #{$kendo-card-border-width})) !default;

package/scss/timeselector/_variables.scss

@@ -1,52 +1,53 @@
 // Time selector
-$time-selector-border-width: 1px !default;
-$time-selector-font-family: $font-family !default;
-$time-selector-font-size: $font-size !default;
-$time-selector-line-height: $line-height !default;
 
-$time-selector-bg: $kendo-component-bg !default;
-$time-selector-text: $kendo-component-text !default;
-$time-selector-border: $kendo-component-border !default;
+$kendo-time-selector-border-width: 1px !default;
+$kendo-time-selector-font-family: $kendo-font-family !default;
+$kendo-time-selector-font-size: $kendo-font-size-md !default;
+$kendo-time-selector-line-height: $kendo-line-height-md !default;
 
-$time-selector-header-padding-x: $actions-padding-x !default;
-$time-selector-header-padding-y: $actions-padding-y !default;
-$time-selector-header-border-width: 0px !default;
+$kendo-time-selector-bg: $kendo-component-bg !default;
+$kendo-time-selector-text: $kendo-component-text !default;
+$kendo-time-selector-border: $kendo-component-border !default;
 
-$time-list-width: 4em !default;
-$time-list-height: 240px !default;
+$kendo-time-selector-header-padding-x: $kendo-actions-padding-x !default;
+$kendo-time-selector-header-padding-y: $kendo-actions-padding-y !default;
+$kendo-time-selector-header-border-width: 0px !default;
 
-$time-list-title-font-size: $font-size-sm !default;
-$time-list-title-line-height: 1.5 !default;
-$time-list-title-height: ( $time-list-title-font-size * $time-list-title-line-height) !default;
-$time-list-title-text: $kendo-subtle-text !default;
-$time-list-title-focus-text: $kendo-component-text !default;
+$kendo-time-list-width: 4em !default;
+$kendo-time-list-height: 240px !default;
 
-$time-list-item-padding-x: $kendo-list-item-padding-x-md !default;
-$time-list-item-padding-y: $kendo-list-item-padding-y-md !default;
+$kendo-time-list-title-font-size: $kendo-font-size-sm !default;
+$kendo-time-list-title-line-height: 1.5 !default;
+$kendo-time-list-title-height: ( $kendo-time-list-title-font-size * $kendo-time-list-title-line-height) !default;
+$kendo-time-list-title-text: $kendo-subtle-text !default;
+$kendo-time-list-title-focus-text: $kendo-component-text !default;
 
-$time-list-highlight-border-width: 1px 0px !default;
-$time-list-highlight-height: calc( #{$time-selector-font-size * $time-selector-line-height} + #{ $time-list-item-padding-y * 2} ) !default;
-$time-list-highlight-bg: $kendo-component-bg !default;
-$time-list-highlight-border: $kendo-component-border !default;
+$kendo-time-list-item-padding-x: $kendo-list-md-item-padding-x !default;
+$kendo-time-list-item-padding-y: $kendo-list-md-item-padding-y !default;
 
-$time-list-focus-bg: rgba( black, .04 ) !default;
+$kendo-time-list-highlight-border-width: 1px 0px !default;
+$kendo-time-list-highlight-height: calc( #{$kendo-time-selector-font-size * $kendo-time-selector-line-height} + #{ $kendo-time-list-item-padding-y * 2} ) !default;
+$kendo-time-list-highlight-bg: $kendo-component-bg !default;
+$kendo-time-list-highlight-border: $kendo-component-border !default;
+
+$kendo-time-list-focus-bg: rgba( black, .04 ) !default;
 
 
 // Time selector sizes
-$kendo-time-selector-sm-font-size: $kendo-list-font-size-sm !default;
-$kendo-time-selector-sm-line-height: $kendo-list-line-height-sm !default;
-$kendo-time-selector-sm-list-item-padding-x: $kendo-list-item-padding-x-sm !default;
-$kendo-time-selector-sm-list-item-padding-y: $kendo-list-item-padding-y-sm !default;
+$kendo-time-selector-sm-font-size: $kendo-list-sm-font-size !default;
+$kendo-time-selector-sm-line-height: $kendo-list-sm-line-height !default;
+$kendo-time-selector-sm-list-item-padding-x: $kendo-list-sm-item-padding-x !default;
+$kendo-time-selector-sm-list-item-padding-y: $kendo-list-sm-item-padding-y !default;
 
-$kendo-time-selector-md-font-size: $kendo-list-font-size-md !default;
-$kendo-time-selector-md-line-height: $kendo-list-line-height-md !default;
-$kendo-time-selector-md-list-item-padding-x: $kendo-list-item-padding-x-md !default;
-$kendo-time-selector-md-list-item-padding-y: $kendo-list-item-padding-y-md !default;
+$kendo-time-selector-md-font-size: $kendo-list-md-font-size !default;
+$kendo-time-selector-md-line-height: $kendo-list-md-line-height !default;
+$kendo-time-selector-md-list-item-padding-x: $kendo-list-md-item-padding-x !default;
+$kendo-time-selector-md-list-item-padding-y: $kendo-list-md-item-padding-y !default;
 
-$kendo-time-selector-lg-font-size: $kendo-list-font-size-lg !default;
-$kendo-time-selector-lg-line-height: $kendo-list-line-height-lg !default;
-$kendo-time-selector-lg-list-item-padding-x: $kendo-list-item-padding-x-lg !default;
-$kendo-time-selector-lg-list-item-padding-y: $kendo-list-item-padding-y-lg !default;
+$kendo-time-selector-lg-font-size: $kendo-list-lg-font-size !default;
+$kendo-time-selector-lg-line-height: $kendo-list-lg-line-height !default;
+$kendo-time-selector-lg-list-item-padding-x: $kendo-list-lg-item-padding-x !default;
+$kendo-time-selector-lg-list-item-padding-y: $kendo-list-lg-item-padding-y !default;
 
 $kendo-time-selector-sizes: (
     sm: (