@progress/kendo-theme-fluent 10.1.0-dev.3 → 10.1.0-dev.4

package/dist/meta/{variables.scss → _variables.scss}

@@ -1,10 +1,11 @@
 @use "sass:meta";
+@use "sass:string";
 @use "../all.scss";
 
 $_vars: meta.module-variables("all");
 
 body {
     @each $key, $val in $_vars {
-        var: k-resolve-var( unquote($key), meta.type-of( $val ), $val ); // stylelint-disable-line
+        var: k-resolve-var( string.unquote($key), meta.type-of( $val ), $val ); // stylelint-disable-line
     }
 }

package/dist/meta/sassdoc-data.json

@@ -31696,7 +31696,7 @@
             "context": {
                 "type": "variable",
                 "name": "kendo-form-spacer",
-                "value": "calc( #{k-spacing(2)} * 2 )",
+                "value": "k-spacing(4)",
                 "scope": "default",
                 "line": {
                     "start": 7,
@@ -31711,8 +31711,8 @@
                 "path": "fluent/scss/forms/_variables.scss",
                 "name": "_variables.scss"
             },
-            "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2)",
-            "resolvedType": "Calculation"
+            "resolvedValue": "var(--kendo-spacing-4, 1rem)",
+            "resolvedType": "String"
         },
         {
             "description": "The font size of the Form.\n",
@@ -39726,7 +39726,7 @@
             "context": {
                 "type": "variable",
                 "name": "kendo-image-editor-action-pane-width",
-                "value": "if( $kendo-image-editor-content-border-width == 0, 240px, calc( 240px + #{$kendo-image-editor-content-border-width}) )",
+                "value": "if( $kendo-image-editor-content-border-width == 0, 270px, calc( 270px + #{$kendo-image-editor-content-border-width}) )",
                 "scope": "default",
                 "line": {
                     "start": 70,
@@ -39741,7 +39741,7 @@
                 "path": "fluent/scss/imageeditor/_variables.scss",
                 "name": "_variables.scss"
             },
-            "resolvedValue": "240px",
+            "resolvedValue": "270px",
             "resolvedType": "Number"
         },
         {
@@ -54388,7 +54388,7 @@
             "context": {
                 "type": "variable",
                 "name": "kendo-panelbar-header-padding-x-start",
-                "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+                "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
                 "scope": "default",
                 "line": {
                     "start": 40,
@@ -54403,7 +54403,7 @@
                 "path": "fluent/scss/panelbar/_variables.scss",
                 "name": "_variables.scss"
             },
-            "resolvedValue": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))",
+            "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))",
             "resolvedType": "Calculation"
         },
         {
@@ -54469,7 +54469,7 @@
             "context": {
                 "type": "variable",
                 "name": "kendo-panelbar-item-padding-x-start",
-                "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+                "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
                 "scope": "default",
                 "line": {
                     "start": 51,
@@ -54484,7 +54484,7 @@
                 "path": "fluent/scss/panelbar/_variables.scss",
                 "name": "_variables.scss"
             },
-            "resolvedValue": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))",
+            "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))",
             "resolvedType": "Calculation"
         },
         {
@@ -124302,7 +124302,7 @@
                     "context": {
                         "type": "variable",
                         "name": "kendo-form-spacer",
-                        "value": "calc( #{k-spacing(2)} * 2 )",
+                        "value": "k-spacing(4)",
                         "scope": "default",
                         "line": {
                             "start": 7,
@@ -124317,8 +124317,8 @@
                         "path": "fluent/scss/forms/_variables.scss",
                         "name": "_variables.scss"
                     },
-                    "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2)",
-                    "resolvedType": "Calculation"
+                    "resolvedValue": "var(--kendo-spacing-4, 1rem)",
+                    "resolvedType": "String"
                 },
                 {
                     "description": "The font size of the Form.\n",
@@ -132356,7 +132356,7 @@
                     "context": {
                         "type": "variable",
                         "name": "kendo-image-editor-action-pane-width",
-                        "value": "if( $kendo-image-editor-content-border-width == 0, 240px, calc( 240px + #{$kendo-image-editor-content-border-width}) )",
+                        "value": "if( $kendo-image-editor-content-border-width == 0, 270px, calc( 270px + #{$kendo-image-editor-content-border-width}) )",
                         "scope": "default",
                         "line": {
                             "start": 70,
@@ -132371,7 +132371,7 @@
                         "path": "fluent/scss/imageeditor/_variables.scss",
                         "name": "_variables.scss"
                     },
-                    "resolvedValue": "240px",
+                    "resolvedValue": "270px",
                     "resolvedType": "Number"
                 },
                 {
@@ -148621,7 +148621,7 @@
                     "context": {
                         "type": "variable",
                         "name": "kendo-panelbar-header-padding-x-start",
-                        "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+                        "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
                         "scope": "default",
                         "line": {
                             "start": 40,
@@ -148636,7 +148636,7 @@
                         "path": "fluent/scss/panelbar/_variables.scss",
                         "name": "_variables.scss"
                     },
-                    "resolvedValue": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))",
+                    "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))",
                     "resolvedType": "Calculation"
                 },
                 {
@@ -148702,7 +148702,7 @@
                     "context": {
                         "type": "variable",
                         "name": "kendo-panelbar-item-padding-x-start",
-                        "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+                        "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
                         "scope": "default",
                         "line": {
                             "start": 51,
@@ -148717,7 +148717,7 @@
                         "path": "fluent/scss/panelbar/_variables.scss",
                         "name": "_variables.scss"
                     },
-                    "resolvedValue": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))",
+                    "resolvedValue": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))",
                     "resolvedType": "Calculation"
                 },
                 {

package/dist/meta/sassdoc-raw-data.json

@@ -27277,7 +27277,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-form-spacer",
-            "value": "calc( #{k-spacing(2)} * 2 )",
+            "value": "k-spacing(4)",
             "scope": "default",
             "line": {
                 "start": 7,
@@ -34702,7 +34702,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-image-editor-action-pane-width",
-            "value": "if( $kendo-image-editor-content-border-width == 0, 240px, calc( 240px + #{$kendo-image-editor-content-border-width}) )",
+            "value": "if( $kendo-image-editor-content-border-width == 0, 270px, calc( 270px + #{$kendo-image-editor-content-border-width}) )",
             "scope": "default",
             "line": {
                 "start": 70,
@@ -47952,7 +47952,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-panelbar-header-padding-x-start",
-            "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+            "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
             "scope": "default",
             "line": {
                 "start": 40,
@@ -48027,7 +48027,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-panelbar-item-padding-x-start",
-            "value": "calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) )",
+            "value": "calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) )",
             "scope": "default",
             "line": {
                 "start": 51,

package/dist/meta/variables.json

@@ -7389,8 +7389,8 @@
         }
     },
     "kendo-form-spacer": {
-        "type": "Calculation",
-        "value": "calc(var(--kendo-spacing-2, 0.5rem) * 2)"
+        "type": "String",
+        "value": "var(--kendo-spacing-4, 1rem)"
     },
     "kendo-form-font-size": {
         "type": "String",
@@ -12570,7 +12570,7 @@
     },
     "kendo-panelbar-header-padding-x-start": {
         "type": "Calculation",
-        "value": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))"
+        "value": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))"
     },
     "kendo-panelbar-header-padding-x-end": {
         "type": "String",
@@ -12582,7 +12582,7 @@
     },
     "kendo-panelbar-item-padding-x-start": {
         "type": "Calculation",
-        "value": "calc(var(--kendo-panelbar-icon-spacing, var(--kendo-spacing-2, 0.5rem)) * 2 + var(--kendo-icon-size, 1rem))"
+        "value": "calc(var(--kendo-spacing-2, 0.5rem) * 2 + var(--kendo-icon-size, 1rem))"
     },
     "kendo-panelbar-item-padding-x-end": {
         "type": "String",
@@ -15410,7 +15410,7 @@
     },
     "kendo-image-editor-action-pane-width": {
         "type": "Number",
-        "value": "240px"
+        "value": "270px"
     },
     "kendo-image-editor-crop-bg": {
         "type": "String",

package/lib/swatches/all.json

@@ -3,7 +3,7 @@
     "name": "All",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "10.1.0-dev.3",
+    "version": "10.1.0-dev.4",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/lib/swatches/fluent-main-dark.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "10.1.0-dev.3",
+    "version": "10.1.0-dev.4",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/lib/swatches/fluent-main.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "10.1.0-dev.3",
+    "version": "10.1.0-dev.4",
     "api": "modern",
     "previewColors": [
         "#ffffff",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-fluent",
   "description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
-  "version": "10.1.0-dev.3",
+  "version": "10.1.0-dev.4",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -38,11 +38,12 @@
     }
   },
   "scripts": {
-    "build": "sass-build",
-    "watch": "npx sass --load-path=../../node_modules --watch ./scss/all.scss ./dist/all.css",
-    "sass": "sass-build",
-    "sass:standalone": "sass-build -c sass-standalone.config.js",
-    "sass:swatches": "gulp dist:swatches && sass-build -c sass-swatches.config.js",
+    "sass": "npm run sass:compile:all && npm run css:prefix",
+    "sass:dist": "gulp sass:dist --theme packages/fluent && npm run sass:compile:dist && npm run css:prefix",
+    "sass:compile:all": "npx sass --no-source-map --load-path=../../node_modules ./scss/all.scss ./dist/all.css",
+    "sass:compile:dist": "npx sass --style=compressed --no-source-map --load-path=../../node_modules ./dist:dist",
+    "sass:watch": "npx sass --no-source-map --load-path=../../node_modules --watch ./scss/all.scss ./dist/all.css",
+    "css:prefix": "npx postcss --replace ./dist/**/*.css",
     "docs": "node ../../scripts/sassdoc.js",
     "predocs": "npm run resolve-variables",
     "resolve-variables": "node ../../scripts/resolve-variables.js",
@@ -53,12 +54,12 @@
   },
   "dependencies": {
     "@progress/kendo-svg-icons": "^4.0.0",
-    "@progress/kendo-theme-core": "10.1.0-dev.3",
-    "@progress/kendo-theme-utils": "10.1.0-dev.3"
+    "@progress/kendo-theme-core": "10.1.0-dev.4",
+    "@progress/kendo-theme-utils": "10.1.0-dev.4"
   },
   "directories": {
     "doc": "docs",
     "lib": "lib"
   },
-  "gitHead": "a33add5dbf946b4fbaa83b9b2016ed1836a9fa0e"
+  "gitHead": "4089693fbd3a10aebc8155f11e7b7b7f814be2be"
 }

package/scss/chat/_layout.scss

@@ -342,7 +342,6 @@
 
     .k-chat .k-card-deck {
         max-width: calc( 100% + calc( #{ $kendo-chat-message-list-padding-y} * 2 ) ); // prevent overflowing in the parent element
-        max-width: calc( 100% + var( --kendo-chat-message-list-padding-y, calc( #{ $kendo-chat-message-list-padding-y} * 2 ) ) );
         box-sizing: border-box;
         margin-inline: calc( var( --kendo-chat-message-list-padding-x, #{ $kendo-chat-message-list-padding-x } ) * -1 );
         padding-block-start: var( --kendo-chat-message-list-padding-y, #{ $kendo-chat-message-list-padding-y } );

package/scss/colorgradient/_layout.scss

@@ -165,9 +165,10 @@
         }
 
         .k-contrast-validation {
+            --INTERNAL--kendo-color-gradient-contrast-spacing: var( --kendo-color-gradient-contrast-spacing,  #{$kendo-color-gradient-contrast-spacing} );
             display: inline-flex;
             align-items: center;
-            gap: calc( var( --kendo-color-gradient-contrast-spacing,  #{$kendo-color-gradient-contrast-spacing} ) / 2 );
+            gap: calc( var( --INTERNAL--kendo-color-gradient-contrast-spacing ) / 2 );
 
             .k-icon {
                 vertical-align: middle;

package/scss/core/_index.scss

@@ -19,7 +19,7 @@
 // Variables
 @forward "./_variables.scss";
 
-@forward "@progress/kendo-theme-core/scss/index.import.scss" with (
+@forward "@progress/kendo-theme-core/scss/index.scss" with (
     $kendo-enable-color-system: $kendo-enable-color-system !default,
     $kendo-nested-disabled: false !default,
     // Color System
@@ -40,7 +40,7 @@
     $kendo-line-height: $kendo-line-height !default,
 
     $kendo-letter-spacing: $kendo-letter-spacing !default,
-    
+
     $kendo-font-family: $kendo-font-family !default,
     // Spacing
     $_default-spacing: $kendo-spacing,

package/scss/core/color-system/_swatch-legacy.scss

@@ -1,6 +1,6 @@
 @use "sass:meta";
 @use "sass:map";
-@use "@progress/kendo-theme-core/scss/index.import.scss" as *;
+@use "@progress/kendo-theme-core/scss/index.scss" as *;
 
 // Legacy
 

package/scss/forms/_variables.scss

@@ -4,7 +4,7 @@
 
 /// The padding of the inline Form.
 /// @group form
-$kendo-form-spacer: calc( #{k-spacing(2)} * 2 ) !default;
+$kendo-form-spacer: k-spacing(4) !default;
 
 /// The font size of the Form.
 /// @group form

package/scss/gantt/_index.scss

@@ -9,6 +9,7 @@
 @use "../window/_index.scss" as *;
 @use "../splitter/_index.scss" as *;
 @use "../treelist/_index.scss" as *;
+@use "../time-marker/_index.scss" as *;
 
 // Component
 @forward "./_variables.scss";
@@ -27,6 +28,7 @@
         @include kendo-window--styles();
         @include kendo-splitter--styles();
         @include kendo-treelist--styles();
+        @include kendo-time-marker--styles();
         @include kendo-gantt--layout();
         @include kendo-gantt--theme();
         @include kendo-utils--typography--white-space();

package/scss/gantt/_layout.scss

@@ -455,6 +455,7 @@
     }
     .k-task-start { inset-inline-start: 0; }
     .k-task-end { inset-inline-end: 0; }
+
     .k-task-draghandle {
         margin-inline-start: 16px;
         width: 0;
@@ -465,9 +466,10 @@
         position: absolute;
         bottom: 0;
         // display: none;
-        cursor: e-resize;
+        cursor: ew-resize;
         visibility: hidden;
     }
+
     .k-task-wrap:hover .k-task-draghandle {
         visibility: visible;
     }
@@ -543,18 +545,28 @@
             opacity: .5;
             z-index: 2;
             visibility: hidden;
+            cursor: ew-resize;
         }
+
         .k-resize-handle::before {
             position: absolute;
             top: 2px;
             bottom: 2px;
         }
-        .k-resize-w { left: 0; }
+
+        .k-resize-w {
+            left: 0;
+        }
+
         .k-resize-w::before {
             left: 2px;
             border-left-width: 1px;
         }
-        .k-resize-e { right: 0; }
+
+        .k-resize-e {
+            right: 0;
+        }
+
         .k-resize-e::before {
             right: 2px;
             border-left-width: 1px;

package/scss/grid/_layout.scss

@@ -845,9 +845,9 @@
         }
 
         .k-grid-row-sticky td.k-grid-content-sticky,
-        .k-grid-row-sticky.k-alt td.k-grid-content-sticky,
+        .k-grid-row-sticky.k-table-alt-row td.k-grid-content-sticky,
         .k-grid-row-sticky .k-table-td.k-grid-content-sticky,
-        .k-grid-row-sticky.k-alt .k-table-td.k-grid-content-sticky {
+        .k-grid-row-sticky.k-table-alt-row .k-table-td.k-grid-content-sticky {
             z-index: 3;
         }
 

package/scss/imageeditor/_layout.scss

@@ -112,14 +112,16 @@
 
         .k-resize-n,
         .k-resize-s {
-            left: calc( 50% - var( --kendo-image-editor-resize-left-offset, #{$kendo-image-editor-resize-left-offset} ) );
+            --INTERNAL--kendo-image-editor-resize-left-offset: var( --kendo-image-editor-resize-left-offset, #{$kendo-image-editor-resize-left-offset} );
+            left: calc( 50% - var( --INTERNAL--kendo-image-editor-resize-left-offset ) );
             width: var( --kendo-image-editor-resize-handle-size, #{$kendo-image-editor-resize-handle-size} );
             height: 0;
         }
 
         .k-resize-w,
         .k-resize-e {
-            top: calc( 50% - var( --kendo-image-editor-resize-top-offset, #{$kendo-image-editor-resize-top-offset} ) );
+            --INTERNAL--kendo-image-editor-resize-top-offset: var( --kendo-image-editor-resize-top-offset, #{$kendo-image-editor-resize-top-offset} );
+            top: calc( 50% - var( --INTERNAL--kendo-image-editor-resize-top-offset ) );
             width: 0;
             height: var( --kendo-image-editor-resize-handle-size, #{$kendo-image-editor-resize-handle-size} );
         }

package/scss/imageeditor/_variables.scss

@@ -67,7 +67,7 @@ $kendo-image-editor-action-pane-padding-y: k-spacing(3) !default;
 $kendo-image-editor-action-pane-padding-x: k-spacing(3) !default;
 /// Imageeditor action pane width.
 /// @group imageeditor
-$kendo-image-editor-action-pane-width: if( $kendo-image-editor-content-border-width == 0, 240px, calc( 240px + #{$kendo-image-editor-content-border-width}) ) !default;
+$kendo-image-editor-action-pane-width: if( $kendo-image-editor-content-border-width == 0, 270px, calc( 270px + #{$kendo-image-editor-content-border-width}) ) !default;
 
 /// Crop background color of the imageeditor.
 /// @group imageeditor

package/scss/loader/_layout.scss

@@ -170,25 +170,34 @@
 
         &.k-loader-sm {
             .k-loader-canvas {
+                --INTERNAL--kendo-loader-canvas-width: var( --kendo-loader-sm-spinner-3-width, #{$kendo-loader-sm-spinner-3-width} );
+                --INTERNAL--kendo-loader-canvas-height: var( --kendo-loader-sm-spinner-3-height, #{$kendo-loader-sm-spinner-3-height} );
+                --INTERNAL--kendo-loader-canvas-size:  var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} );
                 margin: calc( var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) / 2 );
-                width: calc( var( --kendo-loader-sm-spinner-3-width, #{$kendo-loader-sm-spinner-3-width} ) - var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) );
-                height: calc( var( --kendo-loader-sm-spinner-3-height, #{$kendo-loader-sm-spinner-3-height} ) - var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) );
+                width: calc( var( --INTERNAL--kendo-loader-canvas-width ) - var( --INTERNAL--kendo-loader-canvas-size ) );
+                height: calc( var( --INTERNAL--kendo-loader-canvas-height ) - var( --INTERNAL--kendo-loader-canvas-size ) );
             }
         }
 
         &.k-loader-md {
             .k-loader-canvas {
+                --INTERNAL--kendo-loader-canvas-width: var( --kendo-loader-md-spinner-3-width, #{$kendo-loader-md-spinner-3-width} );
+                --INTERNAL--kendo-loader-canvas-height: var( --kendo-loader-md-spinner-3-height, #{$kendo-loader-md-spinner-3-height} );
+                --INTERNAL--kendo-loader-canvas-size:  var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} );
                 margin: calc( var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) / 2 );
-                width: calc( var( --kendo-loader-md-spinner-3-width, #{$kendo-loader-md-spinner-3-width} ) - var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) );
-                height: calc( var( --kendo-loader-md-spinner-3-height, #{$kendo-loader-md-spinner-3-height} ) - var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) );
+                width: calc( var( --INTERNAL--kendo-loader-canvas-width ) - var( --INTERNAL--kendo-loader-canvas-size ) );
+                height: calc( var( --INTERNAL--kendo-loader-canvas-height ) - var( --INTERNAL--kendo-loader-canvas-size ) );
             }
         }
 
         &.k-loader-lg {
             .k-loader-canvas {
+                --INTERNAL--kendo-loader-canvas-width: var( --kendo-loader-lg-spinner-3-width, #{$kendo-loader-lg-spinner-3-width} );
+                --INTERNAL--kendo-loader-canvas-height: var( --kendo-loader-lg-spinner-3-height, #{$kendo-loader-lg-spinner-3-height} );
+                --INTERNAL--kendo-loader-canvas-size:  var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} );
                 margin: calc( var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) / 2 );
-                width: calc( var( --kendo-loader-lg-spinner-3-width, #{$kendo-loader-lg-spinner-3-width} ) - var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) );
-                height: calc( var( --kendo-loader-lg-spinner-3-height, #{$kendo-loader-lg-spinner-3-height} ) - var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) );
+                width: calc( var( --INTERNAL--kendo-loader-canvas-width ) - var( --INTERNAL--kendo-loader-canvas-size ) );
+                height: calc( var( --INTERNAL--kendo-loader-canvas-height ) - var( --INTERNAL--kendo-loader-canvas-size ) );
             }
         }
     }

package/scss/panelbar/_layout.scss

@@ -123,12 +123,14 @@
             // Hierarchy items
             @for $i from 1 through $kendo-panelbar-item-level-count {
                 &.k-level-#{$i} {
+                    --INTERNAL--kendo-panelbar-link-spacing: calc( #{k-spacing(3)} * #{$i} );
+                    --INTERNAL--kendo-panelbar-item-padding: var( --kendo-panelbar-item-padding-x-start, #{$kendo-panelbar-item-padding-x-start} );
                     .k-link {
-                        padding-inline-start: calc( var( --kendo-panelbar-item-padding-x-start, #{$kendo-panelbar-item-padding-x-start} ) + ( #{k-spacing(3)} * #{$i} ));
+                        padding-inline-start: calc( var( --INTERNAL--kendo-panelbar-item-padding ) + var( --INTERNAL--kendo-panelbar-link-spacing ) );
                     }
 
                     .k-panelbar-item-icon:first-child {
-                        inset-inline-start: calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) + ( #{k-spacing(3)} * #{$i} ));
+                        inset-inline-start: calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) + var( --INTERNAL--kendo-panelbar-link-spacing ) );
                     }
                 }
             }

package/scss/panelbar/_variables.scss

@@ -37,7 +37,7 @@ $kendo-panelbar-icon-spacing: k-spacing(2) !default;
 
 /// The horizontal start padding of the PanelBar header.
 /// @group panelbar
-$kendo-panelbar-header-padding-x-start: calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) ) !default;
+$kendo-panelbar-header-padding-x-start: calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) ) !default;
 
 /// The horizontal end padding of the PanelBar header.
 /// @group panelbar
@@ -48,7 +48,7 @@ $kendo-panelbar-header-padding-y: k-spacing(3) !default;
 
 /// The horizontal padding of the PanelBar items.
 /// @group panelbar
-$kendo-panelbar-item-padding-x-start: calc( var( --kendo-panelbar-icon-spacing, #{$kendo-panelbar-icon-spacing} ) * 2 + var( --kendo-icon-size, 1rem ) ) !default;
+$kendo-panelbar-item-padding-x-start: calc( #{$kendo-panelbar-icon-spacing} * 2 + var( --kendo-icon-size, 1rem ) ) !default;
 
 /// The horizontal end padding of the PanelBar items.
 /// @group panelbar

package/scss/pivotgrid/_layout.scss

@@ -500,7 +500,7 @@
         table-layout: auto;
 
         .k-grid-footer,
-        .k-grid .k-alt {
+        .k-grid .k-table-alt-row {
             font-weight: bold;
         }
     }

package/scss/scheduler/_index.scss

@@ -8,6 +8,7 @@
 @use "../dropdownlist/_index.scss" as *;
 @use "../dialog/_index.scss" as *;
 @use "../tooltip/_index.scss" as *;
+@use "../time-marker/_index.scss" as *;
 
 // Component
 @forward "./_variables.scss";
@@ -25,6 +26,7 @@
         @include kendo-dropdown-list--styles();
         @include kendo-dialog--styles();
         @include kendo-tooltip--styles();
+        @include kendo-time-marker--styles();
         @include kendo-scheduler--layout();
         @include kendo-scheduler--theme();
         @include kendo-utils--typography--text-overflow();

package/scss/splitter/_layout.scss

@@ -46,6 +46,7 @@
         outline: 0;
         position: absolute;
         user-select: none;
+        touch-action: none;
         display: flex;
         align-items: center;
         justify-content: center;

package/scss/tabstrip/_layout.scss

@@ -89,10 +89,6 @@
             flex-direction: row;
         }
 
-        .k-tab-on-top {
-            z-index: 1;
-        }
-
         .k-link {
             padding-inline: var( --kendo-tabstrip-item-padding-x, #{$kendo-tabstrip-item-padding-x} );
             padding-block: var( --kendo-tabstrip-item-padding-y, #{$kendo-tabstrip-item-padding-y} );