@progress/kendo-theme-bootstrap 5.12.1-dev.2 → 5.12.1-dev.3

package/scss/_variables.scss

@@ -10,6 +10,7 @@ $kendo-enable-shadows: true !default;
 $kendo-enable-gradients: true !default;
 $kendo-enable-transitions: true !default;
 $kendo-enable-focus-contrast: false !default;
+$kendo-enable-typography: false !default;
 
 $kendo-use-input-button-width: false !default;
 $kendo-use-input-spinner-width: false !default;
@@ -55,8 +56,6 @@ $kendo-spacing: (
     24: 6rem
 ) !default;
 
-$default-scrollbar-width: 17px !default;
-
 
 // Icons
 $kendo-icon-size: 16px !default;
@@ -84,9 +83,9 @@ $kendo-padding-lg-y: k-map-get( $kendo-spacing, 3 ) !default;
 
 /// Border radius for all components.
 $kendo-border-radius: $border-radius !default;
-$kendo-border-radius-sm: k-math-div( $kendo-border-radius, 2 ) !default;
+$kendo-border-radius-sm: $border-radius-sm !default;
 $kendo-border-radius-md: $kendo-border-radius !default;
-$kendo-border-radius-lg: $kendo-border-radius * 1.5 !default;
+$kendo-border-radius-lg: $border-radius-lg !default;
 
 $kendo-border-radii: (
     DEFAULT: $kendo-border-radius-md,
@@ -104,7 +103,7 @@ $kendo-zindex-loading: 100 !default;
 
 
 // Color settings
-$dark-theme: false !default;
+$kendo-is-dark-theme: false !default;
 
 // Theme colors
 /// The color that focuses the user attention.
@@ -187,7 +186,7 @@ $kendo-color-light: $light !default;
 
 /// Inverse color of the theme. Depending on the theme luminance dark or light, it will be light or dark
 /// @group color-system
-$kendo-color-inverse: if( $dark-theme, $kendo-color-light, $kendo-color-dark ) !default;
+$kendo-color-inverse: if( $kendo-is-dark-theme, $kendo-color-light, $kendo-color-dark ) !default;
 
 
 $kendo-theme-colors: (
@@ -208,57 +207,69 @@ $kendo-theme-colors: (
 
 /// Base font size across all components.
 /// @group typography
-$font-size: $font-size-base !default;
-$font-size-xs: ( $font-size * .75 ) !default;
-$font-size-sm: $font-size-sm !default;
-$font-size-md: $font-size !default;
-$font-size-lg: $font-size-lg !default;
-$font-size-xl: ( $font-size-md * 1.5 ) !default;
+$kendo-font-size: $font-size-base !default;
+$kendo-font-size-xs: ( $kendo-font-size * .75 ) !default;
+$kendo-font-size-sm: $font-size-sm !default;
+$kendo-font-size-md: $kendo-font-size !default;
+$kendo-font-size-lg: $font-size-lg !default;
+$kendo-font-size-xl: ( $kendo-font-size-md * 1.5 ) !default;
 
 $kendo-font-sizes: (
-    xs: $font-size-xs,
-    sm: $font-size-sm,
-    md: $font-size-md,
-    lg: $font-size-lg,
-    xl: $font-size-xl
+    xs: $kendo-font-size-xs,
+    sm: $kendo-font-size-sm,
+    md: $kendo-font-size-md,
+    lg: $kendo-font-size-lg,
+    xl: $kendo-font-size-xl
 ) !default;
 
-/// Font family across all components.
+/// Font family for text.
 /// @group typography
-$font-family: $font-family-sans-serif !default;
+$kendo-font-family-sans-serif: $font-family-sans-serif !default;
 
 /// Font family for monospaced text. Used for styling the code.
 /// @group typography
-$font-family-monospace: $font-family-monospace !default;
+$kendo-font-family-monospace: $font-family-monospace !default;
+
+/// Font family across all components.
+/// @group typography
+$kendo-font-family: $kendo-font-family-sans-serif !default;
 
-/// Line height used along with $font-size.
+/// Line height used along with $kendo-font-size.
 /// @group typography
-$line-height: $line-height-base !default;
-$line-height-xs: 1 !default;
-$line-height-sm: $line-height-sm !default;
-$line-height-md: $line-height !default;
-$line-height-lg: $line-height-lg !default;
-$line-height-em: calc( #{$line-height} * 1em ) !default;
+$kendo-line-height: $line-height-base !default;
+$kendo-line-height-xs: 1 !default;
+$kendo-line-height-sm: $line-height-sm !default;
+$kendo-line-height-md: $kendo-line-height !default;
+$kendo-line-height-lg: $line-height-lg !default;
+$kendo-line-height-em: calc( #{$kendo-line-height} * 1em ) !default;
 
 // Font weight
-$font-weight-light: $font-weight-light !default;
-$font-weight-normal: $font-weight-normal !default;
-$font-weight-bold: $font-weight-bold !default;
+$kendo-font-weight-light: $font-weight-light !default;
+$kendo-font-weight-normal: $font-weight-normal !default;
+$kendo-font-weight-medium: 500 !default; // TODO: use from bootstrap when we update
+$kendo-font-weight-semibold: 600 !default; // TODO: use from bootstrap when we update
+$kendo-font-weight-bold: $font-weight-bold !default;
 
 // Letter Spacing
-$letter-spacing: null !default;
+$kendo-letter-spacing: null !default;
 
 
+// Generic styles
+
 // Root styles
 $kendo-body-bg: $kendo-color-white !default;
 $kendo-body-text: k-contrast-color( $kendo-body-bg, $gray-900, $gray-100 ) !default;
 
-$kendo-subtle-text: if( $dark-theme, $gray-400, $text-muted ) !default;
+$kendo-subtle-text: if( $kendo-is-dark-theme, $gray-400, $text-muted ) !default;
 
 $kendo-app-bg: k-try-shade( $kendo-body-bg, .25 ) !default;
 $kendo-app-text: $kendo-body-text !default;
 $kendo-app-border: if( k-is-light( $kendo-app-bg ), $gray-300, $gray-700 ) !default;
 
+// Link
+$kendo-link-text: $link-color !default;
+$kendo-link-hover-text: $link-hover-color !default;
+
 
 // Components
 
@@ -278,18 +289,18 @@ $kendo-component-border: if( k-is-light( $kendo-component-bg ), $gray-300, $gray
 
 
 /// The background of the components' chrome area.
-$base-bg: $gray-100 !default;
+$kendo-base-bg: $gray-100 !default;
 /// The text color of the components' chrome area.
-$base-text: $kendo-body-text !default;
+$kendo-base-text: $kendo-body-text !default;
 /// The border color of the components' chrome area.
-$base-border: k-try-shade( $base-bg, 1 ) !default;
+$kendo-base-border: k-try-shade( $kendo-base-bg, 1 ) !default;
 /// The gradient background of the components' chrome area.
-$base-gradient: null !default;
+$kendo-base-gradient: null !default;
 
 /// The background of hovered items.
 $kendo-hover-bg: $gray-200 !default;
 /// The text color of hovered items.
-$kendo-hover-text: $base-text !default;
+$kendo-hover-text: $kendo-base-text !default;
 /// The border color of hovered items.
 $kendo-hover-border: k-try-shade( $kendo-hover-bg, 1 ) !default;
 /// The gradient background of hovered items.
@@ -306,7 +317,7 @@ $kendo-selected-gradient: null !default;
 
 $kendo-selected-hover-bg: k-try-shade( $kendo-selected-bg, .5 ) !default;
 $kendo-selected-hover-text: $kendo-selected-text !default;
-$kendo-selected-hover-border: $base-border !default;
+$kendo-selected-hover-border: $kendo-base-border !default;
 $kendo-selected-hover-gradient: null !default;
 
 
@@ -317,7 +328,7 @@ $kendo-transition: color .2s ease-in-out, background-color .2s ease-in-out, bord
 
 
 // Disabled mixin variables
-$kendo-disabled-text: if( $dark-theme, $gray-600, $gray-500) !default;
+$kendo-disabled-text: if( $kendo-is-dark-theme, $gray-600, $gray-500) !default;
 $kendo-disabled-filter: grayscale(.1) !default;
 $kendo-disabled-opacity: .65 !default;
 
@@ -333,7 +344,7 @@ $kendo-disabled-styling: (
 
 
 // Header
-$kendo-component-header-bg: $base-bg !default;
+$kendo-component-header-bg: $kendo-base-bg !default;
 $kendo-component-header-text: $kendo-component-text !default;
 $kendo-component-header-border: $kendo-component-border !default;
 $kendo-component-header-gradient: null !default;
@@ -344,9 +355,3 @@ $kendo-invalid-bg: null !default;
 $kendo-invalid-text: $kendo-color-error !default;
 $kendo-invalid-border: $kendo-color-error !default;
 $kendo-invalid-shadow: 0 0 0 .25rem rgba( $kendo-invalid-border, .25 ) !default;
-
-
-// Layout
-$grid-cols: 12 !default;
-$grid-rows: 10 !default;
-$grid-gap: 10px !default;

package/scss/action-buttons/_variables.scss

@@ -1,11 +1,11 @@
 // Actions
-$actions-margin-top: k-map-get( $kendo-spacing, 4 ) !default;
-$actions-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-$actions-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$actions-border-width: 0px !default;
-$actions-button-spacing: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-actions-margin-top: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-actions-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-actions-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-actions-border-width: 0px !default;
+$kendo-actions-button-spacing: k-map-get( $kendo-spacing, 2 ) !default;
 
-$actions-bg: null !default;
-$actions-text: null !default;
-$actions-border: null !default;
-$actions-gradient: null !default;
+$kendo-actions-bg: null !default;
+$kendo-actions-text: null !default;
+$kendo-actions-border: null !default;
+$kendo-actions-gradient: null !default;

package/scss/action-sheet/_variables.scss

@@ -1,86 +1,86 @@
 // Action sheet
-$actionsheet-padding-x: null !default;
-$actionsheet-padding-y: null !default;
-$actionsheet-width: 360px !default;
-$actionsheet-max-width: 100% !default;
-$actionsheet-height: 60vh !default;
-$actionsheet-max-height: 60vh !default;
+$kendo-actionsheet-padding-x: null !default;
+$kendo-actionsheet-padding-y: null !default;
+$kendo-actionsheet-width: 360px !default;
+$kendo-actionsheet-max-width: 100% !default;
+$kendo-actionsheet-height: 60vh !default;
+$kendo-actionsheet-max-height: 60vh !default;
 
-$actionsheet-border-width: 0px !default;
-$actionsheet-border-radius: 0px !default;
+$kendo-actionsheet-border-width: 0px !default;
+$kendo-actionsheet-border-radius: 0px !default;
 
-$actionsheet-font-size: $font-size !default;
-$actionsheet-font-family: $font-family !default;
-$actionsheet-line-height: $line-height !default;
+$kendo-actionsheet-font-size: $kendo-font-size-md !default;
+$kendo-actionsheet-font-family: $kendo-font-family !default;
+$kendo-actionsheet-line-height: $kendo-line-height-md !default;
 
-$actionsheet-bg: $kendo-component-bg !default;
-$actionsheet-text: $kendo-component-text !default;
-$actionsheet-border: $kendo-component-border !default;
-$actionsheet-shadow: 0 8px 10px -5px rgba( black, .2 ), 0 16px 24px 2px rgba( black, .14 ), 0 6px 30px 5px rgba( black, .12 ) !default;
+$kendo-actionsheet-bg: $kendo-component-bg !default;
+$kendo-actionsheet-text: $kendo-component-text !default;
+$kendo-actionsheet-border: $kendo-component-border !default;
+$kendo-actionsheet-shadow: 0 8px 10px -5px rgba( black, .2 ), 0 16px 24px 2px rgba( black, .14 ), 0 6px 30px 5px rgba( black, .12 ) !default;
 
 
 // Actionsheet header
-$actionsheet-titlebar-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
-$actionsheet-titlebar-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$actionsheet-titlebar-border-width: null !default;
-$actionsheet-titlebar-font-size: null !default;
-$actionsheet-titlebar-font-family: null !default;
-$actionsheet-titlebar-line-height: null !default;
-$actionsheet-titlebar-gap: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-actionsheet-titlebar-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-actionsheet-titlebar-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-actionsheet-titlebar-border-width: null !default;
+$kendo-actionsheet-titlebar-font-size: null !default;
+$kendo-actionsheet-titlebar-font-family: null !default;
+$kendo-actionsheet-titlebar-line-height: null !default;
+$kendo-actionsheet-titlebar-gap: k-map-get( $kendo-spacing, 4 ) !default;
 
-$actionsheet-titlebar-bg: null !default;
-$actionsheet-titlebar-text: null !default;
-$actionsheet-titlebar-border: null !default;
-$actionsheet-titlebar-gradient: null !default;
-$actionsheet-titlebar-shadow: null !default;
+$kendo-actionsheet-titlebar-bg: null !default;
+$kendo-actionsheet-titlebar-text: null !default;
+$kendo-actionsheet-titlebar-border: null !default;
+$kendo-actionsheet-titlebar-gradient: null !default;
+$kendo-actionsheet-titlebar-shadow: null !default;
 
-$actionsheet-subtitle-font-size: $font-size-sm !default;
-$actionsheet-subtitle-line-height: $line-height-sm !default;
-$actionsheet-subtitle-text: $kendo-subtle-text !default;
+$kendo-actionsheet-subtitle-font-size: $kendo-font-size-sm !default;
+$kendo-actionsheet-subtitle-line-height: $kendo-line-height-sm !default;
+$kendo-actionsheet-subtitle-text: $kendo-subtle-text !default;
 
 
 // Actionsheet item
-$actionsheet-item-min-height: 40px !default;
-$actionsheet-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
-$actionsheet-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$actionsheet-item-border-width: 1px !default;
-$actionsheet-item-spacing: 12px !default;
+$kendo-actionsheet-item-min-height: 40px !default;
+$kendo-actionsheet-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-actionsheet-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-actionsheet-item-border-width: 1px !default;
+$kendo-actionsheet-item-spacing: 12px !default;
 
-$actionsheet-item-icon-size: null !default;
+$kendo-actionsheet-item-icon-size: null !default;
 
-$actionsheet-item-title-font-weight: null !default;
-$actionsheet-item-title-text-transform: null !default;
+$kendo-actionsheet-item-title-font-weight: null !default;
+$kendo-actionsheet-item-title-text-transform: null !default;
 
-$actionsheet-item-description-font-size: .875em !default;
-$actionsheet-item-description-text: $kendo-subtle-text !default;
+$kendo-actionsheet-item-description-font-size: .875em !default;
+$kendo-actionsheet-item-description-text: $kendo-subtle-text !default;
 
-$actionsheet-item-hover-bg: $kendo-hover-bg !default;
-$actionsheet-item-hover-text: null !default;
-$actionsheet-item-hover-border: null !default;
-$actionsheet-item-hover-gradient: null !default;
-$actionsheet-item-hover-shadow: null !default;
+$kendo-actionsheet-item-hover-bg: $kendo-hover-bg !default;
+$kendo-actionsheet-item-hover-text: null !default;
+$kendo-actionsheet-item-hover-border: null !default;
+$kendo-actionsheet-item-hover-gradient: null !default;
+$kendo-actionsheet-item-hover-shadow: null !default;
 
-$actionsheet-item-focus-bg: null !default;
-$actionsheet-item-focus-text: null !default;
-$actionsheet-item-focus-border: null !default;
-$actionsheet-item-focus-gradient: null !default;
-$actionsheet-item-focus-shadow: inset 0 0 0 2px rgba( black, .13 ) !default;
+$kendo-actionsheet-item-focus-bg: null !default;
+$kendo-actionsheet-item-focus-text: null !default;
+$kendo-actionsheet-item-focus-border: null !default;
+$kendo-actionsheet-item-focus-gradient: null !default;
+$kendo-actionsheet-item-focus-shadow: inset 0 0 0 2px rgba( black, .13 ) !default;
 
-$actionsheet-item-disabled-bg: null !default;
-$actionsheet-item-disabled-text: null !default;
-$actionsheet-item-disabled-border: null !default;
-$actionsheet-item-disabled-gradient: null !default;
-$actionsheet-item-disabled-shadow: null !default;
+$kendo-actionsheet-item-disabled-bg: null !default;
+$kendo-actionsheet-item-disabled-text: null !default;
+$kendo-actionsheet-item-disabled-border: null !default;
+$kendo-actionsheet-item-disabled-gradient: null !default;
+$kendo-actionsheet-item-disabled-shadow: null !default;
 
 
 // Adaptive Actionsheet
-$adaptive-actionsheet-titlebar-border-width: 1px !default;
-$adaptive-actionsheet-titlebar-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
-$adaptive-actionsheet-titlebar-padding-x: $adaptive-actionsheet-titlebar-padding-y !default;
-$adaptive-actionsheet-titlebar-border: $kendo-component-border !default;
+$kendo-adaptive-actionsheet-titlebar-border-width: 1px !default;
+$kendo-adaptive-actionsheet-titlebar-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-adaptive-actionsheet-titlebar-padding-x: $kendo-adaptive-actionsheet-titlebar-padding-y !default;
+$kendo-adaptive-actionsheet-titlebar-border: $kendo-component-border !default;
 
-$adaptive-actionsheet-content-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$adaptive-actionsheet-content-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-adaptive-actionsheet-content-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-adaptive-actionsheet-content-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
 
-$adaptive-actionsheet-footer-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
-$adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-adaptive-actionsheet-footer-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !default;

package/scss/adaptive/_variables.scss

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

package/scss/appbar/_variables.scss

@@ -7,9 +7,9 @@ $kendo-appbar-border-width: 0px !default;
 
 $kendo-appbar-zindex: 1000 !default;
 
-$kendo-appbar-font-size: $font-size !default;
-$kendo-appbar-line-height: $line-height !default;
-$kendo-appbar-font-family: $font-family !default;
+$kendo-appbar-font-size: $kendo-font-size-md !default;
+$kendo-appbar-line-height: $kendo-line-height-md !default;
+$kendo-appbar-font-family: $kendo-font-family !default;
 $kendo-appbar-gap: k-map-get( $kendo-spacing, 2 ) !default;
 
 $kendo-appbar-light-bg: $kendo-color-light !default;

package/scss/avatar/_variables.scss

@@ -6,13 +6,13 @@ $kendo-avatar-border-width: 1px !default;
 
 /// Font family of the avatar.
 /// @group avatar
-$kendo-avatar-font-family: $font-family !default;
+$kendo-avatar-font-family: $kendo-font-family !default;
 /// Font size of the avatar.
 /// @group avatar
-$kendo-avatar-font-size: $font-size !default;
+$kendo-avatar-font-size: $kendo-font-size-md !default;
 /// Line height of the avatar.
 /// @group avatar
-$kendo-avatar-line-height: $line-height !default;
+$kendo-avatar-line-height: $kendo-line-height-md !default;
 
 /// The sizes of the avatar.
 /// @group avatar

package/scss/badge/_variables.scss

@@ -12,60 +12,60 @@ $kendo-badge-border-radius: $badge-border-radius !default;
 /// Horizontal padding of the badge.
 /// @group badge
 $kendo-badge-padding-x: $badge-padding-x !default;
-$kendo-badge-padding-x-sm: k-math-div( $badge-padding-x, 2 ) !default;
-$kendo-badge-padding-x-md: $badge-padding-x !default;
-$kendo-badge-padding-x-lg: ( $badge-padding-x * 1.5 ) !default;
+$kendo-badge-sm-padding-x: k-math-div( $badge-padding-x, 2 ) !default;
+$kendo-badge-md-padding-x: $badge-padding-x !default;
+$kendo-badge-lg-padding-x: ( $badge-padding-x * 1.5 ) !default;
 
 /// Vertical padding of the badge.
 /// @group badge
 $kendo-badge-padding-y: $badge-padding-y !default;
-$kendo-badge-padding-y-sm: k-math-div( $badge-padding-y, 2 ) !default;
-$kendo-badge-padding-y-md: $badge-padding-y !default;
-$kendo-badge-padding-y-lg: ( $badge-padding-y * 1.5 ) !default;
+$kendo-badge-sm-padding-y: k-math-div( $badge-padding-y, 2 ) !default;
+$kendo-badge-md-padding-y: $badge-padding-y !default;
+$kendo-badge-lg-padding-y: ( $badge-padding-y * 1.5 ) !default;
 
 /// Font sizes of the badge.
 /// @group badge
 $kendo-badge-font-size: $badge-font-size !default;
-$kendo-badge-font-size-sm: $badge-font-size !default;
-$kendo-badge-font-size-md: $badge-font-size !default;
-$kendo-badge-font-size-lg: $badge-font-size !default;
+$kendo-badge-sm-font-size: $badge-font-size !default;
+$kendo-badge-md-font-size: $badge-font-size !default;
+$kendo-badge-lg-font-size: $badge-font-size !default;
 
-/// Line heights used along with $font-size.
+/// Line heights used along with $kendo-font-size.
 /// @group badge
 $kendo-badge-line-height: 1 !default;
-$kendo-badge-line-height-sm: $kendo-badge-line-height !default;
-$kendo-badge-line-height-md: $kendo-badge-line-height !default;
-$kendo-badge-line-height-lg: $kendo-badge-line-height !default;
+$kendo-badge-sm-line-height: $kendo-badge-line-height !default;
+$kendo-badge-md-line-height: $kendo-badge-line-height !default;
+$kendo-badge-lg-line-height: $kendo-badge-line-height !default;
 
 /// Badge min width used for circle badge.
 /// @group badge
 $kendo-badge-min-width: calc( #{$kendo-badge-line-height * 1em} + #{$kendo-badge-padding-y * 2} + #{$kendo-badge-border-width * 2}) !default;
-$kendo-badge-min-width-sm: calc( #{$kendo-badge-line-height-sm * 1em} + #{$kendo-badge-padding-y-sm * 2} + #{$kendo-badge-border-width * 2} ) !default;
-$kendo-badge-min-width-md: calc( #{$kendo-badge-line-height-md * 1em} + #{$kendo-badge-padding-y-md * 2} + #{$kendo-badge-border-width * 2} ) !default;
-$kendo-badge-min-width-lg: calc( #{$kendo-badge-line-height-lg * 1em} + #{$kendo-badge-padding-y-lg * 2} + #{$kendo-badge-border-width * 2} ) !default;
+$kendo-badge-sm-min-width: calc( #{$kendo-badge-sm-line-height * 1em} + #{$kendo-badge-sm-padding-y * 2} + #{$kendo-badge-border-width * 2} ) !default;
+$kendo-badge-md-min-width: calc( #{$kendo-badge-md-line-height * 1em} + #{$kendo-badge-md-padding-y * 2} + #{$kendo-badge-border-width * 2} ) !default;
+$kendo-badge-lg-min-width: calc( #{$kendo-badge-lg-line-height * 1em} + #{$kendo-badge-lg-padding-y * 2} + #{$kendo-badge-border-width * 2} ) !default;
 
 /// Sizes map for the badge.
 /// @group badge
 $kendo-badge-sizes: (
     sm: (
-        padding-x: $kendo-badge-padding-x-sm,
-        padding-y: $kendo-badge-padding-y-sm,
-        font-size: $kendo-badge-font-size-sm,
-        line-height: $kendo-badge-line-height-sm,
-        min-width: $kendo-badge-min-width-sm
+        padding-x: $kendo-badge-sm-padding-x,
+        padding-y: $kendo-badge-sm-padding-y,
+        font-size: $kendo-badge-sm-font-size,
+        line-height: $kendo-badge-sm-line-height,
+        min-width: $kendo-badge-sm-min-width
     ),
     md: (
-        padding-x: $kendo-badge-padding-x-md,
-        padding-y: $kendo-badge-padding-y-md,
-        font-size: $kendo-badge-font-size-md,
-        line-height: $kendo-badge-line-height-md,
-        min-width: $kendo-badge-min-width-md
+        padding-x: $kendo-badge-md-padding-x,
+        padding-y: $kendo-badge-md-padding-y,
+        font-size: $kendo-badge-md-font-size,
+        line-height: $kendo-badge-md-line-height,
+        min-width: $kendo-badge-md-min-width
     ),
     lg: (
-        padding-x: $kendo-badge-padding-x-lg,
-        padding-y: $kendo-badge-padding-y-lg,
-        font-size: $kendo-badge-font-size-lg,
-        line-height: $kendo-badge-line-height-lg,
-        min-width: $kendo-badge-min-width-lg
+        padding-x: $kendo-badge-lg-padding-x,
+        padding-y: $kendo-badge-lg-padding-y,
+        font-size: $kendo-badge-lg-font-size,
+        line-height: $kendo-badge-lg-line-height,
+        min-width: $kendo-badge-lg-min-width
     )
 ) !default;

package/scss/bottom-navigation/_variables.scss

@@ -1,29 +1,29 @@
 // Bottom-navigation
-$bottom-nav-padding-x: 0px !default;
-$bottom-nav-padding-y: $bottom-nav-padding-x !default;
-$bottom-nav-gap: $bottom-nav-padding-x !default;
-$bottom-nav-border-width: 1px 0px 0px 0px !default;
+$kendo-bottom-nav-padding-x: 0px !default;
+$kendo-bottom-nav-padding-y: $kendo-bottom-nav-padding-x !default;
+$kendo-bottom-nav-gap: $kendo-bottom-nav-padding-x !default;
+$kendo-bottom-nav-border-width: 1px 0px 0px 0px !default;
 
-$bottom-nav-font-family: $font-family !default;
-$bottom-nav-font-size: $font-size !default;
-$bottom-nav-line-height: normal !default;
-$bottom-nav-letter-spacing: .2px !default;
+$kendo-bottom-nav-font-family: $kendo-font-family !default;
+$kendo-bottom-nav-font-size: $kendo-font-size-md !default;
+$kendo-bottom-nav-line-height: normal !default;
+$kendo-bottom-nav-letter-spacing: .2px !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( #{$kendo-icon-size * 2.5} + #{k-map-get( $kendo-spacing, 4 )} - #{$bottom-nav-padding-x * 2} ) !default;
-$bottom-nav-item-border-radius: null !default;
-$bottom-nav-item-gap: 0 k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-bottom-nav-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-bottom-nav-item-padding-y: 0 !default;
+$kendo-bottom-nav-item-min-width: 72px !default;
+$kendo-bottom-nav-item-max-width: null !default;
+$kendo-bottom-nav-item-min-height: calc( #{$kendo-icon-size * 2.5} + #{k-map-get( $kendo-spacing, 4 )} - #{$kendo-bottom-nav-padding-x * 2} ) !default;
+$kendo-bottom-nav-item-border-radius: null !default;
+$kendo-bottom-nav-item-gap: 0 k-map-get( $kendo-spacing, 1 ) !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( $kendo-spacing, 6 ) !default;
-$bottom-nav-item-disabled-opacity: .5 !default;
+$kendo-bottom-nav-item-icon-margin-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-bottom-nav-item-icon-margin-x: $kendo-bottom-nav-item-icon-margin-y !default;
+$kendo-bottom-nav-item-icon-size: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-bottom-nav-item-disabled-opacity: .5 !default;
 
-$bottom-nav-shadow: 0px 0px 5px rgba( black, .12 ) !default;
+$kendo-bottom-nav-shadow: 0px 0px 5px rgba( black, .12 ) !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;
+$kendo-bottom-nav-flat-bg: $kendo-component-bg !default;
+$kendo-bottom-nav-flat-text: $kendo-component-text !default;
+$kendo-bottom-nav-flat-border: $kendo-component-border !default;

package/scss/breadcrumb/_layout.scss

@@ -2,7 +2,6 @@
 
 @include exports( "breadcrumb/layout/bootstrap" ) {
 
-
     // Breadcrumb links
     .k-breadcrumb-link,
     .k-breadcrumb-root-link {
@@ -13,4 +12,13 @@
             text-decoration: $link-hover-decoration;
         }
     }
+
+    // Breadcrumb current (last) item
+    .k-breadcrumb-current-item {
+        .k-disabled {
+            opacity: 1;
+            filter: none;
+        }
+    }
+
 }

package/scss/breadcrumb/_theme.scss

@@ -1,18 +1 @@
 @import "@progress/kendo-theme-default/scss/breadcrumb/_theme.scss";
-
-@include exports( "breadcrumb/theme/bootstrap" ) {
-
-    // Current page (last item)
-    .k-breadcrumb-last-item {
-
-        .k-breadcrumb-link {
-            color: $breadcrumb-active-color;
-        }
-
-        .k-disabled {
-            opacity: 1;
-            filter: none;
-        }
-    }
-
-}