@progress/kendo-theme-fluent 5.12.1-dev.0 → 5.12.1-dev.2

package/scss/radio/_theme.scss

@@ -1,14 +1,14 @@
-@use "_variables.scss" as *;
-@use "../core/mixins/" as *;
+@use "../core/" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-radio--theme() {
 
     // Radio
     .k-radio {
         @include fill(
-            var( --kendo-radio-text, #{ $kendo-radio-text } ),
-            var( --kendo-radio-bg, #{ $kendo-radio-bg } ),
-            var( --kendo-radio-border, #{ $kendo-radio-border } )
+            var( --kendo-radio-text, #{$kendo-radio-text} ),
+            var( --kendo-radio-bg, #{$kendo-radio-bg} ),
+            var( --kendo-radio-border, #{$kendo-radio-border} )
         );
     }
 
@@ -17,52 +17,18 @@
     .k-radio:hover,
     .k-radio.k-hover {
         @include fill(
-            $border: var( --kendo-radio-hover-border, #{ $kendo-radio-hover-border } )
+            var( --kendo-radio-hover-text, #{$kendo-radio-hover-text} ),
+            var( --kendo-radio-hover-bg, #{$kendo-radio-hover-bg} ),
+            var( --kendo-radio-hover-border, #{$kendo-radio-hover-border} )
         );
-
-        &::after {
-            @include fill(
-                $bg: var( --kendo-radio-hover-color, #{ $kendo-radio-hover-color } ),
-                $border: var( --kendo-radio-hover-color, #{ $kendo-radio-hover-color } )
-            );
-        }
-    }
-
-
-    // Checked and Hover state
-    .k-radio:checked:hover,
-    .k-radio.k-checked.k-hover {
-        @include fill(
-            $border: var( --kendo-radio-checked-hover-border, #{ $kendo-radio-checked-hover-border } )
-        );
-
-        &::after {
-            @include fill(
-                $border: var( --kendo-radio-checked-hover-border, #{ $kendo-radio-checked-hover-border } )
-            );
-        }
     }
 
 
     // Focus state
     .k-radio:focus,
     .k-radio.k-focus {
-        &::before {
-            @include fill( $border: var( --kendo-radio-focus-checked-border, #{ $kendo-radio-focus-checked-border }) );
-        }
-    }
-
-
-    // Invalid state
-    .k-radio.k-invalid,
-    .k-radio.ng-invalid.ng-touched,
-    .k-radio.ng-invalid.ng-dirty {
-        @include fill( $border: var( --kendo-radio-invalid-border, #{ $kendo-radio-invalid-border } ) );
-    }
-    .k-radio.k-invalid + .k-radio-label,
-    .k-radio.ng-invalid.ng-touched + .k-radio-label,
-    .k-radio.ng-invalid.ng-dirty + .k-radio-label {
-        @include fill( $color: var( --kendo-radio-invalid-text, #{ $kendo-radio-invalid-text } ) );
+        box-shadow: $kendo-radio-focus-shadow;
+        outline: $kendo-radio-focus-outline;
     }
 
 
@@ -70,56 +36,66 @@
     .k-radio:checked,
     .k-radio.k-checked {
         @include fill(
-            var( --kendo-radio-checked-text, #{ $kendo-radio-checked-text } ),
-            var( --kendo-radio-checked-bg, #{ $kendo-radio-checked-bg } ),
-            var( --kendo-radio-checked-border, #{ $kendo-radio-checked-border } )
+            var( --kendo-radio-checked-text, #{$kendo-radio-checked-text} ),
+            var( --kendo-radio-checked-bg, #{$kendo-radio-checked-bg} ),
+            var( --kendo-radio-checked-border, #{$kendo-radio-checked-border} )
         );
+    }
 
-        &::after {
-            background-color: var( --kendo-radio-checked-border, #{ $kendo-radio-checked-border } );
-        }
+
+    // Hover checked state
+    .k-radio:checked:hover,
+    .k-radio.k-checked.k-hover {
+        @include fill(
+            var( --kendo-radio-hover-checked-text, #{$kendo-radio-hover-checked-text} ),
+            var( --kendo-radio-hover-checked-bg, #{$kendo-radio-hover-checked-bg} ),
+            var( --kendo-radio-hover-checked-border, #{$kendo-radio-hover-checked-border} )
+        );
     }
 
 
     // Disabled
     .k-radio:disabled,
     .k-radio.k-disabled {
-            border-color: var( --kendo-radio-disabled-border, #{ $kendo-radio-disabled-border } );
+        @include fill(
+            var( --kendo-radio-disabled-text, #{$kendo-radio-disabled-text} ),
+            var( --kendo-radio-disabled-bg, #{$kendo-radio-disabled-bg} ),
+            var( --kendo-radio-disabled-border, #{$kendo-radio-disabled-border} )
+        );
     }
-
-
-    // Checked and disabled
     .k-radio:checked:disabled,
     .k-radio.k-checked.k-disabled {
         @include fill(
-            var( --kendo-radio-disabled-checked-text, #{ $kendo-radio-disabled-checked-text } ),
-            var( --kendo-radio-disabled-checked-bg, #{ $kendo-radio-disabled-checked-bg } ),
-            var( --kendo-radio-disabled-checked-border, #{ $kendo-radio-disabled-checked-border } )
+            var( --kendo-radio-disabled-checked-text, #{$kendo-radio-disabled-checked-text} ),
+            var( --kendo-radio-disabled-checked-bg, #{$kendo-radio-disabled-checked-bg} ),
+            var( --kendo-radio-disabled-checked-border, #{$kendo-radio-disabled-checked-border} )
         );
+    }
 
-        &::after {
-            @include fill(
-                $bg: var( --kendo-radio-disabled-checked-border, #{ $kendo-radio-disabled-checked-border } ),
-                $border: var( --kendo-radio-disabled-checked-border, #{ $kendo-radio-disabled-checked-border } )
-            );
-        }
+
+    // Invalid state
+    .k-radio.k-invalid,
+    .k-radio.ng-invalid.ng-touched,
+    .k-radio.ng-invalid.ng-dirty {
+        @include fill( $border: var( --kendo-radio-invalid-border, #{$kendo-radio-invalid-border} ) );
+    }
+    .k-radio.k-invalid + .k-radio-label,
+    .k-radio.ng-invalid.ng-touched + .k-radio-label,
+    .k-radio.ng-invalid.ng-dirty + .k-radio-label {
+        @include fill( $color: var( --kendo-radio-invalid-text, #{$kendo-radio-invalid-text} ) );
     }
 
 
     // Ripple
+    .k-radio-wrap .k-ripple-blob {
+        color: var( --kendo-radio-ripple-bg, #{$kendo-radio-ripple-bg} );
+        opacity: var( --kendo-radio-ripple-opacity, #{$kendo-radio-ripple-opacity} );
+    }
     .k-ripple-container {
         .k-radio::after {
-            background: var( --kendo-radio-checked-bg, #{ $kendo-radio-checked-bg } );
-            opacity: var( --kendo-radio-ripple-opacity, #{ $kendo-radio-ripple-opacity } );
+            background: var( --kendo-radio-ripple-bg, #{$kendo-radio-ripple-bg} );
+            opacity: var( --kendo-radio-ripple-opacity, #{$kendo-radio-ripple-opacity} );
         }
     }
 
-    //Radio items
-    .k-radio-item,
-    .k-radio-list-item {
-        &.k-disabled,
-        &:disabled {
-            background-color: transparent;
-        }
-    }
 }

package/scss/radio/_variables.scss

@@ -1,7 +1,6 @@
+@use "sass:map";
 @use "sass:math";
-@use "../core/color-system" as *;
-@use "../core/_variables.scss" as *;
-@use "../core/functions/" as *;
+@use "../core/" as *;
 @use "../checkbox/_variables.scss" as *;
 @use "../list/_variables.scss" as *;
 
@@ -17,145 +16,116 @@ $kendo-radio-border-width: 1px !default;
 // Radio button sizes
 $kendo-radio-sizes: (
     sm: (
-        size: map-get( $kendo-spacing, 4 ),
-        glyph-size: ( map-get( $kendo-spacing, 4 ) - map-get( $kendo-spacing, thin ) ),
-        ripple-size: map-get( $kendo-spacing, 4 ) * 3,
-        checked-border-width: map-get( $kendo-spacing, 1 ),
-        checked-position: ( map-get( $kendo-spacing, 1 ) - map-get( $kendo-spacing, hair ))
+        size: map.get( $kendo-spacing, 4 ),
+        glyph-size: map.get( $kendo-spacing, 3.5 ),
+        indicator-size: map.get( $kendo-spacing, 2 ),
+        ripple-size: 300%
     ),
     md: (
-        size: map-get( $kendo-spacing, 5 ),
-        glyph-size: ( map-get( $kendo-spacing, 5 ) - map-get( $kendo-spacing, thin ) ),
-        ripple-size: map-get( $kendo-spacing, 5 ) * 3,
-        checked-border-width: ( map-get( $kendo-spacing, 1 ) + map-get( $kendo-spacing, hair )),
-        checked-position: map-get( $kendo-spacing, 1 )
+        size: map.get( $kendo-spacing, 5 ),
+        glyph-size: map.get( $kendo-spacing, 4.5 ),
+        indicator-size: map.get( $kendo-spacing, 2.5 ),
+        ripple-size: 300%
     ),
     lg: (
-        size: map-get( $kendo-spacing, 6 ),
-        glyph-size: ( map-get( $kendo-spacing, 6 ) - map-get( $kendo-spacing, thin ) ),
-        ripple-size: map-get( $kendo-spacing, 6 ) * 3,
-        checked-border-width: ( map-get( $kendo-spacing, 1) + map-get( $kendo-spacing, thin )),
-        checked-position: ( map-get( $kendo-spacing, 1) + map-get( $kendo-spacing, hair ))
+        size: map.get( $kendo-spacing, 6 ),
+        glyph-size: map.get( $kendo-spacing, 5.5 ),
+        indicator-size: map.get( $kendo-spacing, 3 ),
+        ripple-size: 300%
     )
 ) !default;
 
-/// Default width of radio button.
-/// @group radio
-$kendo-radio-width: map-get( $kendo-spacing, 5 ) !default;
-/// Default height of radio button.
-/// @group radio
-$kendo-radio-height: map-get( $kendo-spacing, 5 ) !default;
-/// Default font size of radio button.
-/// @group radio
-$kendo-radio-font-size: ( map-get( $kendo-spacing, 5 ) - map-get( $kendo-spacing, thin ) ) !default;
-/// Default ripple width of radio button.
-/// @group radio
-$kendo-radio-ripple-width: ( map-get( $kendo-spacing, 5 ) * 3 ) !default;
-/// Default ripple height of radio button.
-/// @group radio
-$kendo-radio-ripple-height: ( map-get( $kendo-spacing, 5 ) * 3 ) !default;
-
 /// Background color of radio button.
 /// @group radio
-$kendo-radio-bg: $kendo-checkbox-bg !default;
+$kendo-radio-bg: $kendo-component-bg !default;
 /// Color of radio button.
 /// @group radio
-$kendo-radio-text: $kendo-checkbox-text !default;
+$kendo-radio-text: transparent !default;
 /// Border color of radio button.
 /// @group radio
-$kendo-radio-border: $kendo-checkbox-border !default;
+$kendo-radio-border: get-theme-color-var( neutral-160 ) !default;
 
 /// Background color of hovered radio button.
 /// @group radio
-$kendo-radio-hover-bg: $kendo-checkbox-hover-bg !default;
+$kendo-radio-hover-bg: $kendo-radio-bg !default;
 /// Color of hovered radio button.
 /// @group radio
-$kendo-radio-hover-text: $kendo-checkbox-hover-text !default;
+$kendo-radio-hover-text: get-theme-color( neutral, 130 ) !default;
 /// Border color of hovered radio button.
 /// @group radio
 $kendo-radio-hover-border: $kendo-radio-border !default;
-/// Border color of hovered radio button.
-/// @group radio
-$kendo-radio-hover-color: get-theme-color-var( neutral-130 )!default;
 
-/// Border of hovered and checked radio.
-/// @group checkbox
-$kendo-radio-checked-hover-border: get-theme-color-var( primary-110 ) !default;
-
-/// Top position of checked radio button.
-/// @group checked
-$kendo-radio-checked-top: map-get( $kendo-spacing, 1 ) !default;
-/// Left position of checked radio button.
-/// @group checked
-$kendo-radio-checked-left: map-get( $kendo-spacing, 1 ) !default;
-/// Border width of checked radio button.
-/// @group radio
-$kendo-radio-checked-border-width: ( map-get( $kendo-spacing, 1) + map-get( $kendo-spacing, hair) ) !default;
-/// Width of checked radio button.
-/// @group radio
-$kendo-radio-checked-width: math.div( $kendo-radio-width, 2 ) !default;
-/// Height of checked radio button.
-/// @group radio
-$kendo-radio-checked-height: math.div( $kendo-radio-height, 2 ) !default;
 /// Background color of checked radio button.
 /// @group radio
-$kendo-radio-checked-bg: var( --kendo-component-bg, initial ) !default;
+$kendo-radio-checked-bg: $kendo-radio-bg !default;
 /// Color of checked radio button.
 /// @group radio
 $kendo-radio-checked-text: get-theme-color-var( primary-100 ) !default;
 /// Border color of checked radio button.
 /// @group radio
-$kendo-radio-checked-border: $kendo-checkbox-checked-border !default;
+$kendo-radio-checked-border: get-theme-color-var( primary-100 ) !default;
+
+/// Background color of checked and hovered radio button.
+/// @group radio
+$kendo-radio-hover-checked-bg: $kendo-radio-bg !default;
+/// Color of checked and hovered radio button.
+/// @group radio
+$kendo-radio-hover-checked-text: get-theme-color-var( primary-110 ) !default;
+/// Border color of checked and hovered radio button.
+/// @group radio
+$kendo-radio-hover-checked-border: get-theme-color-var( primary-110 ) !default;
 
 /// Border color of focused radio button.
 /// @group radio
-$kendo-radio-focus-border: $kendo-checkbox-focus-border !default;
+$kendo-radio-focus-border: null !default;
 /// Box shadow of focused radio button.
 /// @group radio
-$kendo-radio-focus-shadow: $kendo-checkbox-focus-shadow !default;
-/// Border color of focused and checked radio button.
-/// @group radio
-$kendo-radio-focus-checked-border: get-theme-color-var( neutral-130 ) !default;
-/// Box shadow of focused and checked radio button.
+$kendo-radio-focus-shadow: null !default;
+/// The outline of a focused radio button.
 /// @group radio
-$kendo-radio-focus-checked-shadow: $kendo-checkbox-focus-checked-shadow !default;
+$kendo-radio-focus-outline: 1px solid get-theme-color-var( neutral-130 ) !default;
+$kendo-radio-focus-outline-offset: 2px !default;
 
 /// Background color of disabled radio button.
 /// @group radio
-$kendo-radio-disabled-bg: $kendo-checkbox-disabled-bg !default;
+$kendo-radio-disabled-bg: $kendo-radio-bg !default;
 /// Color of disabled radio button.
 /// @group radio
-$kendo-radio-disabled-text: $kendo-checkbox-disabled-text !default;
+$kendo-radio-disabled-text: get-theme-color-var( neutral-60 ) !default;
 /// Border color of disabled radio button.
 /// @group radio
 $kendo-radio-disabled-border: get-theme-color-var( neutral-60 ) !default;
 
 /// Background color of disabled and checked radio button.
 /// @group radio
-$kendo-radio-disabled-checked-bg: $kendo-radio-checked-bg !default;
+$kendo-radio-disabled-checked-bg: $kendo-radio-disabled-bg !default;
 /// Color of disabled and checked radio button.
 /// @group radio
-$kendo-radio-disabled-checked-text: $kendo-checkbox-disabled-checked-text !default;
+$kendo-radio-disabled-checked-text: $kendo-radio-disabled-text !default;
 /// Border color of disabled and checked radio button.
 /// @group radio
-$kendo-radio-disabled-checked-border: $kendo-checkbox-disabled-checked-border !default;
+$kendo-radio-disabled-checked-border: $kendo-radio-disabled-border !default;
 
 /// Background color of invalid radio button.
 /// @group radio
-$kendo-radio-invalid-bg: $kendo-checkbox-invalid-bg !default;
+$kendo-radio-invalid-bg: $kendo-radio-bg !default;
 /// Color of invalid radio button.
 /// @group radio
-$kendo-radio-invalid-text: $kendo-checkbox-invalid-text !default;
+$kendo-radio-invalid-text: $kendo-invalid-text !default;
 /// Border color of invalid radio button.
 /// @group radio
-$kendo-radio-invalid-border: $kendo-checkbox-invalid-border !default;
+$kendo-radio-invalid-border: $kendo-invalid-border !default;
 
 
 // Radio indicator
 
 /// Type of radio button indicator.
 /// @group radio
-$kendo-radio-indicator-type: image !default;
+$kendo-radio-indicator-type: pseudo !default;
+
+/// Border radius radio button indicator.
+/// @group radio
+$kendo-radio-indicator-border-radius: 50% !default;
 
 /// Glyph font family of radio button indicator.
 /// @group radio
@@ -176,14 +146,14 @@ $kendo-radio-disabled-checked-image: null !default;
 
 /// The horizontal margin of the radio button inside of a label.
 /// @group radio
-$kendo-radio-label-spacing: map-get( $kendo-spacing, 2 ) !default;
+$kendo-radio-label-spacing: map.get( $kendo-spacing, 2 ) !default;
 
 
 // Radio list
 
 /// The horizontal list item margin of radio button.
 /// @group radio
-$kendo-radio-list-spacing: map-get( $kendo-spacing, 4 ) !default;
+$kendo-radio-list-spacing: map.get( $kendo-spacing, 4 ) !default;
 /// The horizontal list item padding of radio button.
 /// @group radio
 $kendo-radio-list-item-padding-x: 0px !default;
@@ -192,13 +162,13 @@ $kendo-radio-list-item-padding-x: 0px !default;
 $kendo-radio-list-item-padding-y: $kendo-list-item-padding-y-md !default;
 ///
 /// @group radio
-$kendo-radio-list-item-gap: map-get( $kendo-spacing, 2 ) !default;
+$kendo-radio-list-item-gap: map.get( $kendo-spacing, 2 ) !default;
 
 // Radio ripple
 
 /// Background color of radio button ripple.
 /// @group radio
-$kendo-radio-ripple-bg: $kendo-radio-checked-bg !default;
+$kendo-radio-ripple-bg: get-theme-color-var( primary-100 ) !default;
 /// Opacity of radio button ripple.
 /// @group radio
 $kendo-radio-ripple-opacity: .25 !default;

package/scss/radio/index.scss

@@ -9,12 +9,12 @@ $_kendo-module-meta: (
 
 
 // Component
-@forward "_variables.scss";
-@use "_layout.scss" as *;
-@use "_theme.scss" as *;
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Register
-@use "../core/module-system" as module;
+@use "../core/module-system/" as module;
 @include module.register( $_kendo-module-meta... );
 
 // Expose

package/scss/rating/_layout.scss

@@ -1,5 +1,5 @@
-@use "../core" as *;
-@use "_variables.scss" as *;
+@use "../core/" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-rating--layout() {
 
@@ -17,7 +17,7 @@
         gap: var( --kendo-rating-spacing, #{$kendo-rating-spacing} );
         background: none;
         -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
+        -webkit-tap-highlight-color: $kendo-color-rgba-transparent;
 
         *,
         *::before,

package/scss/rating/_theme.scss

@@ -1,5 +1,5 @@
-@use "../core/mixins" as *;
-@use "_variables.scss" as *;
+@use "../core/" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-rating--theme() {
 

package/scss/rating/_variables.scss

@@ -1,4 +1,5 @@
-@use "../core/index.scss" as *;
+@use "sass:map";
+@use "../core/" as *;
 
 /// Font family of the rating.
 /// @group rating
@@ -12,14 +13,14 @@ $kendo-rating-line-height: var( --kendo-line-height, normal ) !default;
 
 /// Content spacing of the rating.
 /// @group rating
-$kendo-rating-spacing: map-get( $kendo-spacing, 1 ) !default;
+$kendo-rating-spacing: map.get( $kendo-spacing, 1 ) !default;
 
 /// Horizontal padding of the rating item.
 /// @group rating
-$kendo-rating-item-padding-x: map-get( $kendo-spacing, thin ) !default;
+$kendo-rating-item-padding-x: map.get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
 /// Vertical padding of the rating item.
 /// @group rating
-$kendo-rating-item-padding-y: map-get( $kendo-spacing, 2 ) !default;
+$kendo-rating-item-padding-y: map.get( $kendo-spacing, 2 ) !default;
 /// Normal color of the rating item.
 /// @group rating
 $kendo-rating-item-text: get-theme-color-var( neutral-130 ) !default;
@@ -31,7 +32,7 @@ $kendo-rating-item-hover-text: get-theme-color-var( primary-100 ) !default;
 $kendo-rating-item-focus-text: $kendo-rating-item-text !default;
 /// Outline width of the focused rating item.
 /// @group rating
-$kendo-rating-item-focus-outline-width: map-get( $kendo-spacing, hair ) !default;
+$kendo-rating-item-focus-outline-width: 1px !default;
 /// Outline style of the focused rating item.
 /// @group rating
 $kendo-rating-item-focus-outline-style: solid !default;

package/scss/rating/index.scss

@@ -8,9 +8,9 @@ $_kendo-module-meta: (
 
 
 // Component
-@forward "_variables.scss";
-@use "_layout.scss" as *;
-@use "_theme.scss" as *;
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Register
 @use "../core/module-system/" as module;

package/scss/responsivepanel/_layout.scss

@@ -1,4 +1,4 @@
-@use "_variables.scss" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-responsivepanel--layout() {
 

package/scss/responsivepanel/index.scss

@@ -8,9 +8,9 @@ $_kendo-module-meta: (
 
 
 // Component
-@forward "_variables.scss";
-@use "_layout.scss" as *;
-@use "_theme.scss" as *;
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Register
 @use "../core/module-system/" as module;

package/scss/ripple/_layout.scss

@@ -1,4 +1,4 @@
-@use "_variables.scss" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-ripple--layout() {
 

package/scss/ripple/_theme.scss

@@ -1,4 +1,4 @@
-@use "_variables.scss" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-ripple--theme() {
     .k-ripple { }

package/scss/ripple/index.scss

@@ -6,9 +6,9 @@ $_kendo-module-meta: (
 
 
 // Component
-@forward "_variables.scss";
-@use "_layout.scss" as *;
-@use "_theme.scss" as *;
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Register
 @use "../core/module-system/" as module;

package/scss/scheduler/_layout.scss

@@ -1,5 +1,6 @@
-@use "_variables.scss" as *;
-@use "../core" as *;
+@use "sass:map";
+@use "./_variables.scss" as *;
+@use "../core/" as *;
 @use "../toolbar/_variables.scss" as *;
 
 @mixin kendo-scheduler--layout() {
@@ -15,7 +16,7 @@
         display: flex;
         flex-direction: column;
         -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
+        -webkit-tap-highlight-color: $kendo-color-rgba-transparent;
 
         table,
         thead,
@@ -226,14 +227,6 @@
             flex-flow: row nowrap;
             align-items: center;
             cursor: pointer;
-
-            .k-sm-date-format,
-            .k-lg-date-format {
-                white-space: nowrap;
-                overflow: hidden;
-                text-overflow: ellipsis;
-            }
-            .k-sm-date-format { display: none; }
         }
 
         // Scheduler search
@@ -241,16 +234,6 @@
             display: inline-flex;
             flex-flow: row nowrap;
         }
-
-        // Responsive scheduler toolbar
-        @media (max-width: 1400px) {
-            .k-nav-current .k-lg-date-format { max-width: 200px; }
-        }
-
-        @media (max-width: 1024px) {
-            .k-nav-current .k-lg-date-format { display: none; }
-            .k-nav-current .k-sm-date-format { display: inline-block; }
-        }
     }
 
 
@@ -730,7 +713,7 @@
             display: flex;
             flex: 1 1 100%;
             align-items: center;
-            gap: map-get( $kendo-spacing, thin );
+            gap: map.get( $kendo-spacing, 0.5 ); // sass-lint:disable-line leading-zero
         }
 
         .k-scheduler-mark {
@@ -953,7 +936,7 @@
         .k-scheduler-datetime-picker {
             display: flex;
             flex-flow: row nowrap;
-            gap: map-get( $kendo-spacing, 1 );
+            gap: map.get( $kendo-spacing, 1 );
         }
 
     }

package/scss/scheduler/_theme.scss

@@ -1,6 +1,5 @@
-@use "_variables.scss" as *;
-@use "../core/mixins" as *;
-@use "../core/color-system" as *;
+@use "../core/" as *;
+@use "./_variables.scss" as *;
 
 @mixin kendo-scheduler--theme() {
 
@@ -132,7 +131,7 @@
     }
 
    // .k-event-inverse {
-   //     color: contrast-wcag( $kendo-scheduler-event-text );
+   //     color: k-contrast-legacy( $kendo-scheduler-event-text );
    // }
 
     .k-event-ongoing {
@@ -153,7 +152,7 @@
 
     // Edit dialog
     .k-scheduler-edit-dialog {
-        .k-dialog-buttongroup {
+        .k-dialog-actions {
             border-color: var( --kendo-scheduler-border, #{$kendo-scheduler-border} );
         }
     }