@progress/kendo-theme-material 11.0.0-dev.0 → 11.0.0-dev.1

package/scss/toolbar/_variables.scss

@@ -36,7 +36,7 @@ $kendo-toolbar-lg-padding-y: k-spacing(2.5) !default;
 $kendo-toolbar-spacing: k-spacing(2) !default;
 /// The spacing between the tools of the small Toolbar.
 /// @group toolbar
-$kendo-toolbar-sm-spacing: k-spacing(1.5) !default;
+$kendo-toolbar-sm-spacing: k-spacing(1) !default;
 /// The spacing between the tools of the medium Toolbar.
 /// @group toolbar
 $kendo-toolbar-md-spacing: $kendo-toolbar-spacing !default;
@@ -59,7 +59,7 @@ $kendo-toolbar-lg-separator-height: $kendo-button-lg-calc-size !default;
 
 /// The width of the border around the Toolbar.
 /// @group toolbar
-$kendo-toolbar-border-width: 0 !default;
+$kendo-toolbar-border-width: 1px !default;
 /// The border radius of the Toolbar.
 /// @group toolbar
 $kendo-toolbar-border-radius: null !default;
@@ -72,23 +72,23 @@ $kendo-toolbar-font-family: var( --kendo-font-family, inherit ) !default;
 $kendo-toolbar-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-line-height: math.div( 20, 14 ) !default;
+$kendo-toolbar-line-height: var( --kendo-line-height, normal ) !default;
 
 /// The background color of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-bg: k-color(surface-alt) !default;
+$kendo-toolbar-bg: k-color(surface) !default;
 /// The text color of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-text: k-color(on-app-surface) !default;
+$kendo-toolbar-text: k-color(base-on-subtle) !default;
 /// The color of the border around the Toolbar.
 /// @group toolbar
-$kendo-toolbar-border: k-color(border) !default;
+$kendo-toolbar-border: $kendo-toolbar-bg !default;
 /// The gradient of the Toolbar.
 /// @group toolbar
 $kendo-toolbar-gradient: null !default;
 /// The box shadow of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-shadow: k-elevation(4) !default;
+$kendo-toolbar-shadow: null !default;
 /// The left and right scroll overlay of the Toolbar.
 /// @group toolbar
 $kendo-toolbar-scroll-overlay: $kendo-toolbar-bg, color-mix(in srgb, k-color(app-surface) 0%, transparent) !default;
@@ -96,10 +96,10 @@ $kendo-toolbar-scroll-overlay: $kendo-toolbar-bg, color-mix(in srgb, k-color(app
 
 /// The text color of the outline Toolbar.
 /// @group toolbar
-$kendo-toolbar-outline-text: unset !default;
+$kendo-toolbar-outline-text: k-color(base-on-subtle) !default;
 /// The color of the border around the outline Toolbar.
 /// @group toolbar
-$kendo-toolbar-outline-border: currentColor !default;
+$kendo-toolbar-outline-border: color-mix(in srgb, k-color(on-app-surface) 44%, transparent) !default;
 /// The gradient of the outline Toolbar.
 /// @group toolbar
 $kendo-toolbar-outline-gradient: null !default;
@@ -116,16 +116,16 @@ $kendo-toolbar-outline-scroll-overlay: k-color(app-surface), color-mix(in srgb,
 
 /// The text color of the flat Toolbar.
 /// @group toolbar
-$kendo-toolbar-flat-text: null !default;
+$kendo-toolbar-flat-text: k-color(base-on-subtle) !default;
 /// The color of the border around the flat Toolbar.
 /// @group toolbar
-$kendo-toolbar-flat-border: $kendo-toolbar-border !default;
+$kendo-toolbar-flat-border: k-color(border) !default;
 /// The gradient of the flat Toolbar.
 /// @group toolbar
 $kendo-toolbar-flat-gradient: null !default;
 /// The box shadow of the flat Toolbar.
 /// @group toolbar
-$kendo-toolbar-flat-shadow: 0 2px 0 -1px k-color(border) !default;
+$kendo-toolbar-flat-shadow: null !default;
 /// Border width of the flat Toolbar.
 /// @group toolbar
 $kendo-toolbar-flat-border-width: 1px !default;
@@ -136,7 +136,7 @@ $kendo-toolbar-flat-scroll-overlay: k-color(app-surface), color-mix(in srgb, k-c
 
 /// The color of the separator border of the Toolbar.
 /// @group toolbar
-$kendo-toolbar-separator-border: inherit !default;
+$kendo-toolbar-separator-border: k-color(border) !default;
 
 /// The width of the input in the Toolbar.
 /// @group toolbar
@@ -144,7 +144,7 @@ $kendo-toolbar-input-width: 10em !default;
 
 /// The box shadow of the focused Toolbar item.
 /// @group toolbar
-$kendo-toolbar-item-shadow: 0 2px 4px -1px rgba(0, 0, 0, .2), 0 4px 5px rgba(0, 0, 0, .14), 0 1px 10px rgba(0, 0, 0, .12) !default;
+$kendo-toolbar-item-shadow: null !default;
 
 /// The font size of the Toolbar overflow container.
 /// @group toolbar

package/scss/tooltip/_variables.scss

@@ -7,10 +7,10 @@
 
 /// The vertical padding of the Tooltip.
 /// @group tooltip
-$kendo-tooltip-padding-y: k-spacing(.5) !default;
+$kendo-tooltip-padding-y: k-spacing(1) !default;
 /// The horizontal padding of the Tooltip.
 /// @group tooltip
-$kendo-tooltip-padding-x: calc( #{k-spacing(4)} / 2 ) !default;
+$kendo-tooltip-padding-x: k-spacing(2) !default;
 /// The width of the border around the Tooltip.
 /// @group tooltip
 $kendo-tooltip-border-width: 0px !default;
@@ -26,11 +26,11 @@ $kendo-tooltip-font-family: var( --kendo-font-family, inherit ) !default;
 $kendo-tooltip-font-size: var( --kendo-font-size-sm, inherit ) !default;
 /// The line height of the Tooltip.
 /// @group tooltip
-$kendo-tooltip-line-height: math.div( 20, 14 ) !default;
+$kendo-tooltip-line-height: var( --kendo-line-height, normal ) !default;
 
 /// The font size of the Tooltip title.
 /// @group tooltip
-$kendo-tooltip-title-font-size: calc( var( --kendo-font-size-sm, .75rem ) * 1.25 ) !default;
+$kendo-tooltip-title-font-size: var( --kendo-font-size-sm, inherit ) !default;
 /// The line height of the Tooltip title.
 /// @group tooltip
 $kendo-tooltip-title-line-height: var( --kendo-line-height-xs, normal ) !default;
@@ -41,10 +41,10 @@ $kendo-tooltip-callout-size: 6px !default;
 
 /// The default background of the Tooltip.
 /// @group tooltip
-$kendo-tooltip-bg: color-mix(in srgb, k-color(on-app-surface) 70%, transparent 30%) !default;
+$kendo-tooltip-bg: k-color(inverse-on-surface) !default;
 /// The default text color of the Tooltip.
 /// @group tooltip
-$kendo-tooltip-text: k-color(app-surface) !default;
+$kendo-tooltip-text: k-color(on-inverse) !default;
 /// The default border color of the Tooltip.
 /// @group tooltip
 $kendo-tooltip-border: $kendo-tooltip-bg !default;

package/scss/treelist/_layout.scss

@@ -1,26 +1,7 @@
-@use "./_variables.scss" as *;
 @use "@progress/kendo-theme-core/scss/components/treelist/_layout.scss" as *;
 
 
 @mixin kendo-treelist--layout() {
 
     @include kendo-treelist--layout-base();
-
-    .k-treelist {
-        tr.k-footer-template td {
-            border-width: $kendo-treelist-footer-row-border-width 0;
-        }
-
-        tr.k-footer td,
-        tr.k-footer-template + tr.k-footer-template td {
-            border-width: 0 0 $kendo-treelist-footer-row-border-width;
-        }
-    }
-
-    .k-treelist-scrollable {
-        tr.k-group-footer td {
-            border-bottom-width: $kendo-treelist-footer-row-border-width;
-        }
-    }
-
 }

package/scss/treelist/_theme.scss

@@ -5,28 +5,23 @@
 
     @include kendo-treelist--theme-base();
 
-    .k-treelist {
-        tr.k-footer,
-        tr.k-footer-template {
-            &:hover {
-                background-color: $kendo-treelist-footer-row-bg;
-            }
-        }
-    }
-
     // Sticky headers
     .k-treelist-scrollable {
-        .k-grid-toolbar,
-        .k-grid-header,
-        .k-grid-header tr:hover {
-            background-color: inherit;
-        }
-
         .k-group-footer td,
         .k-grouping-row td,
         tbody .k-group-cell {
             background-color: $kendo-treelist-footer-row-bg;
         }
+
+        .k-group-footer.k-table-row {
+            &:hover,
+            &.k-hover {
+                td,
+                .k-table-td {
+                   background-color: transparent
+                }
+            }
+        }
     }
 
 }

package/scss/treelist/_variables.scss

@@ -4,7 +4,7 @@
 
 /// The background color of the TreeList footer row.
 /// @group treelist
-$kendo-treelist-footer-row-bg: $kendo-grid-selected-bg !default;
+$kendo-treelist-footer-row-bg: $kendo-grid-header-bg !default;
 /// The border width of the TreeList footer row.
 /// @group treelist
 $kendo-treelist-footer-row-border-width: 1px !default;

package/scss/treeview/_theme.scss

@@ -1,5 +1,3 @@
-@use "./_variables.scss" as *;
-@use "../core/_index.scss" as *;
 @use "@progress/kendo-theme-core/scss/components/treeview/_theme.scss" as *;
 
 
@@ -7,37 +5,10 @@
 
     @include kendo-treeview--theme-base();
 
-    // Treeview
-    .k-treeview {}
-
-
-    // Treeview item
-    .k-treeview-item {}
-
-
     // Treeview leaf
     .k-treeview-leaf {
-
-        // Focus state
-        &:focus,
-        &.k-focus {
-            @include fill(
-                $kendo-treeview-item-hover-text,
-                $kendo-treeview-item-hover-bg,
-                $kendo-treeview-item-hover-border,
-                $kendo-treeview-item-hover-gradient
-            );
-        }
-
-        // Selected Focus state
-        &.k-selected:focus,
-        &.k-selected.k-focus {
-            @include fill(
-                $kendo-treeview-item-selected-focus-text,
-                $kendo-treeview-item-selected-focus-bg,
-                $kendo-treeview-item-selected-focus-border,
-                $kendo-treeview-item-selected-focus-gradient
-            );
+        &.k-selected {
+            font-weight: var( --kendo-font-weight-semibold, 600 );
         }
     }
 

package/scss/treeview/_variables.scss

@@ -8,7 +8,7 @@
 $kendo-treeview-font-family: var( --kendo-font-family, inherit ) !default;
 /// The font size of the TreeView.
 /// @group treeview
-$kendo-treeview-font-size: var( --kendo-font-size-lg, inherit ) !default;
+$kendo-treeview-font-size: var( --kendo-font-size, inherit ) !default;
 /// The font size of the small TreeView.
 /// @group treeview
 $kendo-treeview-sm-font-size: var( --kendo-font-size, inherit ) !default;
@@ -17,19 +17,19 @@ $kendo-treeview-sm-font-size: var( --kendo-font-size, inherit ) !default;
 $kendo-treeview-md-font-size: var( --kendo-font-size, inherit ) !default;
 /// The font size of the large TreeView.
 /// @group treeview
-$kendo-treeview-lg-font-size: var( --kendo-font-size-lg, inherit ) !default;
+$kendo-treeview-lg-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the TreeView.
 /// @group treeview
-$kendo-treeview-line-height: 1.25 !default;
+$kendo-treeview-line-height: var( --kendo-line-height, normal ) !default;
 /// The line height of the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-line-height: math.div( 20, 14 ) !default;
+$kendo-treeview-sm-line-height: var( --kendo-line-height, normal ) !default;
 /// The line height of the medium TreeView.
 /// @group treeview
-$kendo-treeview-md-line-height: math.div( 20, 14 ) !default;
+$kendo-treeview-md-line-height: var( --kendo-line-height, normal ) !default;
 /// The line height of the large TreeView.
 /// @group treeview
-$kendo-treeview-lg-line-height: 1.5 !default;
+$kendo-treeview-lg-line-height: var( --kendo-line-height, normal ) !default;
 /// The indentation of child groups in the TreeView.
 /// @group treeview
 $kendo-treeview-indent: 24px !default;
@@ -48,41 +48,41 @@ $kendo-treeview-md-item-padding-x: k-spacing(4) !default;
 $kendo-treeview-lg-item-padding-x: k-spacing(4) !default;
 /// The vertical padding of the TreeView items.
 /// @group treeview
-$kendo-treeview-item-padding-y: k-spacing(2) !default;
+$kendo-treeview-item-padding-y: k-spacing(2.5) !default;
 /// The vertical padding of the small TreeView items.
 /// @group treeview
-$kendo-treeview-sm-item-padding-y: k-spacing(1.5) !default;
+$kendo-treeview-sm-item-padding-y: k-spacing(2) !default;
 /// The vertical padding of the medium TreeView items.
 /// @group treeview
-$kendo-treeview-md-item-padding-y: k-spacing(2) !default;
+$kendo-treeview-md-item-padding-y: k-spacing(2.5) !default;
 /// The vertical padding of the large TreeView items.
 /// @group treeview
-$kendo-treeview-lg-item-padding-y: k-spacing(2) !default;
+$kendo-treeview-lg-item-padding-y: k-spacing(3) !default;
 /// The border width of the TreeView items.
 /// @group treeview
 $kendo-treeview-item-border-width: 0px !default;
 /// The border radius of the TreeView items.
 /// @group treeview
-$kendo-treeview-item-border-radius: unset !default;
+$kendo-treeview-item-border-radius: k-border-radius(md) !default;
 
 /// The horizontal padding of the checkbox in the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-checkbox-padding-x: k-spacing(1) !default;
+$kendo-treeview-sm-checkbox-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the checkbox in the medium TreeView.
 /// @group treeview
-$kendo-treeview-md-checkbox-padding-x: $kendo-treeview-sm-checkbox-padding-x !default;
+$kendo-treeview-md-checkbox-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the checkbox in the large TreeView.
 /// @group treeview
-$kendo-treeview-lg-checkbox-padding-x: $kendo-treeview-sm-checkbox-padding-x !default;
+$kendo-treeview-lg-checkbox-padding-x: k-spacing(2) !default;
 /// The vertical padding of the checkbox in the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-checkbox-padding-y: k-spacing(0.5) !default;
+$kendo-treeview-sm-checkbox-padding-y: k-spacing(1) !default;
 /// The vertical padding of the checkbox in the medium TreeView.
 /// @group treeview
-$kendo-treeview-md-checkbox-padding-y: $kendo-treeview-sm-checkbox-padding-y !default;
+$kendo-treeview-md-checkbox-padding-y: k-spacing(1.5) !default;
 /// The vertical padding of the checkbox in the large TreeView.
 /// @group treeview
-$kendo-treeview-lg-checkbox-padding-y: null !default;
+$kendo-treeview-lg-checkbox-padding-y: k-spacing(2) !default;
 
 
 /// The sizes map of the TreeView.
@@ -127,10 +127,10 @@ $kendo-treeview-border: null !default;
 
 /// The background color of hovered TreeView.
 /// @group treeview
-$kendo-treeview-item-hover-bg: color-mix(in srgb, k-color(on-app-surface) 7%, transparent) !default;
+$kendo-treeview-item-hover-bg: color-mix(in srgb, currentColor 8%, transparent) !default;
 /// The text color of hovered TreeView items.
 /// @group treeview
-$kendo-treeview-item-hover-text: unset !default;
+$kendo-treeview-item-hover-text: inherit !default;
 /// The border color of hovered TreeView items.
 /// @group treeview
 $kendo-treeview-item-hover-border: null !default;
@@ -140,10 +140,10 @@ $kendo-treeview-item-hover-gradient: null !default;
 
 /// The background color of selected TreeView items.
 /// @group treeview
-$kendo-treeview-item-selected-bg: unset !default;
+$kendo-treeview-item-selected-bg: null !default;
 /// The text color of selected TreeView items.
 /// @group treeview
-$kendo-treeview-item-selected-text: k-color(secondary) !default;
+$kendo-treeview-item-selected-text: k-color(primary) !default;
 /// The border color of selected TreeView items.
 /// @group treeview
 $kendo-treeview-item-selected-border: null !default;
@@ -153,10 +153,10 @@ $kendo-treeview-item-selected-gradient: null !default;
 
 /// The background color of selected and focused TreeView items.
 /// /// @group treeview
-$kendo-treeview-item-selected-focus-text: k-color(secondary) !default;
+$kendo-treeview-item-selected-focus-text: inherit !default;
 /// The text color of selected and focused TreeView items.
 /// /// @group treeview
-$kendo-treeview-item-selected-focus-bg: color-mix(in srgb, k-color(on-app-surface) 7%, transparent) !default;
+$kendo-treeview-item-selected-focus-bg: null !default;
 /// The border color of selected and focused TreeView items.
 /// /// @group treeview
 $kendo-treeview-item-selected-focus-border: null !default;
@@ -166,7 +166,7 @@ $kendo-treeview-item-selected-focus-gradient: null !default;
 
 /// The box shadow of focused TreeView items.
 /// @group treeview
-$kendo-treeview-item-focus-shadow: unset !default;
+$kendo-treeview-item-focus-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 20%, transparent) !default;
 
 /// The background color of the Load More button in the TreeView
 /// @group treeview

package/scss/typography/_variables.scss

@@ -5,22 +5,22 @@
 
 /// The font size of the highest level heading.
 /// @group typography
-$kendo-h1-font-size: 96px !default;
+$kendo-h1-font-size: 57px !default;
 /// The font size of the second highest level heading.
 /// @group typography
-$kendo-h2-font-size: 60px !default;
+$kendo-h2-font-size: 45px !default;
 /// The font size of the third highest level heading.
 /// @group typography
-$kendo-h3-font-size: 48px !default;
+$kendo-h3-font-size: 36px !default;
 /// The font size of the fourth highest level heading.
 /// @group typography
-$kendo-h4-font-size: 34px !default;
+$kendo-h4-font-size: 32px !default;
 /// The font size of the fifth highest level heading.
 /// @group typography
-$kendo-h5-font-size: 24px !default;
+$kendo-h5-font-size: 28px !default;
 /// The font size of the sixth highest level heading.
 /// @group typography
-$kendo-h6-font-size: 20px !default;
+$kendo-h6-font-size: 24px !default;
 
 /// The font family of the highest level heading.
 /// @group typography
@@ -43,22 +43,22 @@ $kendo-h6-font-family: var( --kendo-font-family, inherit ) !default;
 
 /// The line height of the highest level heading.
 /// @group typography
-$kendo-h1-line-height: 112px !default;
+$kendo-h1-line-height: 64px !default;
 /// The line height of the second highest level heading.
 /// @group typography
-$kendo-h2-line-height: 72px !default;
+$kendo-h2-line-height: 52px !default;
 /// The line height of the third highest level heading.
 /// @group typography
-$kendo-h3-line-height: 56px !default;
+$kendo-h3-line-height: 44px !default;
 /// The line height of the fourth highest level heading.
 /// @group typography
-$kendo-h4-line-height: 36px !default;
+$kendo-h4-line-height: 40px !default;
 /// The line height of the fifth highest level heading.
 /// @group typography
-$kendo-h5-line-height: 24px !default;
+$kendo-h5-line-height: 36px !default;
 /// The line height of the sixth highest level heading.
 /// @group typography
-$kendo-h6-line-height: 24px !default;
+$kendo-h6-line-height: 32px !default;
 
 /// The font weight of the highest level heading.
 /// @group typography
@@ -84,19 +84,19 @@ $kendo-h6-font-weight: var( --kendo-font-weight-medium, normal ) !default;
 $kendo-h1-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
 /// The letter spacing of the second highest level heading.
 /// @group typography
-$kendo-h2-letter-spacing: var( --kendo-letter-spacing-tight, normal ) !default;
+$kendo-h2-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
 /// The letter spacing of the third highest level heading.
 /// @group typography
 $kendo-h3-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
 /// The letter spacing of the fourth highest level heading.
 /// @group typography
-$kendo-h4-letter-spacing: var( --kendo-letter-spacing-wider, normal ) !default;
+$kendo-h4-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
 /// The letter spacing of the fifth highest level heading.
 /// @group typography
 $kendo-h5-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
 /// The letter spacing of the sixth highest level heading.
 /// @group typography
-$kendo-h6-letter-spacing: var( --kendo-letter-spacing-wide, normal ) !default;
+$kendo-h6-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
 
 
 /// The margin of the highest level heading.
@@ -201,7 +201,7 @@ $kendo-paragraph-letter-spacing: .0313em !default;
 $kendo-code-font-size: var( --kendo-font-size, inherit ) !default;
 /// The font family of the code tag.
 /// @group typography
-$kendo-code-font-family: var( --kendo-font-family-monospace, normal ) !default;
+$kendo-code-font-family: var( --kendo-font-family, normal ) !default;
 /// The line height of the code tag.
 /// @group typography
 $kendo-code-line-height: var( --kendo-line-height, normal ) !default;
@@ -210,7 +210,7 @@ $kendo-code-line-height: var( --kendo-line-height, normal ) !default;
 $kendo-code-font-weight: var( --kendo-font-weight-normal, normal ) !default;
 /// The letter spacing of the code tag.
 /// @group typography
-$kendo-code-letter-spacing: null !default;
+$kendo-code-letter-spacing: var( --kendo-letter-spacing-wider, normal ) !default;
 
 /// The horizontal padding of the code tag.
 /// @group typography
@@ -242,16 +242,16 @@ $kendo-code-border: k-color(border) !default;
 
 /// The font size of the largest display text.
 /// @group typography
-$kendo-display1-font-size: calc( var( --kendo-font-size, .875rem ) * 9.5 ) !default;
+$kendo-display1-font-size: 140px !default;
 /// The font size of the second largest display text.
 /// @group typography
-$kendo-display2-font-size: calc( var( --kendo-font-size, .875rem ) * 8.75 ) !default;
+$kendo-display2-font-size: 112px !default;
 /// The font size of the third largest display text.
 /// @group typography
-$kendo-display3-font-size: calc( var( --kendo-font-size, .875rem ) * 8 ) !default;
+$kendo-display3-font-size: 90px !default;
 /// The font size of the fourth largest display text.
 /// @group typography
-$kendo-display4-font-size: calc( var( --kendo-font-size, .875rem ) * 7.25 ) !default;
+$kendo-display4-font-size: 72px !default;
 
 /// The font family of the largest display text.
 /// @group typography

package/scss/upload/_variables.scss

@@ -15,7 +15,7 @@ $kendo-upload-font-family: var( --kendo-font-family, inherit ) !default;
 $kendo-upload-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Upload.
 /// @group upload
-$kendo-upload-line-height: math.div( 20, 14 ) !default;
+$kendo-upload-line-height: var( --kendo-line-height, normal ) !default;
 /// The maximum height of the list with uploaded items.
 /// @group upload
 $kendo-upload-max-height: 300px !default;
@@ -25,7 +25,7 @@ $kendo-upload-max-height: 300px !default;
 $kendo-upload-text: k-color(on-app-surface) !default;
 /// The background color of the Upload.
 /// @group upload
-$kendo-upload-bg: k-color(surface-alt) !default;
+$kendo-upload-bg: k-color(surface) !default;
 /// The border color of the Upload.
 /// @group upload
 $kendo-upload-border: k-color(border) !default;
@@ -41,7 +41,7 @@ $kendo-upload-dropzone-padding-y: k-spacing(2) !default;
 $kendo-upload-dropzone-text: k-color(on-app-surface) !default;
 /// The background color of the Upload dropzone.
 /// @group upload
-$kendo-upload-dropzone-bg: k-color(app-surface) !default;
+$kendo-upload-dropzone-bg: k-color(surface) !default;
 /// The border color of the Upload dropzone.
 /// @group upload
 $kendo-upload-dropzone-border: $kendo-upload-border !default;

package/scss/window/_layout.scss

@@ -3,4 +3,18 @@
 
 @mixin kendo-window--layout() {
     @include kendo-window--layout-base();
+
+    .k-window-minimized {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+
+    .k-window-title,
+    .k-window-titlebar-actions {
+        margin-block: 0;
+    }
+
+    .k-window-title {
+        padding-block: 0;
+    }
 }

package/scss/window/_variables.scss

@@ -10,7 +10,7 @@
 $kendo-window-border-width: 0px !default;
 /// The border radius of the Window.
 /// @group window
-$kendo-window-border-radius: 4px !default;
+$kendo-window-border-radius: k-border-radius(xxxl) !default;
 /// The font family of the Window.
 /// @group window
 $kendo-window-font-family: var( --kendo-font-family, inherit ) !default;
@@ -19,14 +19,14 @@ $kendo-window-font-family: var( --kendo-font-family, inherit ) !default;
 $kendo-window-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Window.
 /// @group window
-$kendo-window-line-height: math.div( 20, 14 )  !default;
+$kendo-window-line-height: var( --kendo-line-height, normal )  !default;
 
 /// The horizontal padding of the Window titlebar.
 /// @group window
 $kendo-window-titlebar-padding-x: k-spacing(6) !default;
 /// The vertical padding of the Window titlebar.
 /// @group window
-$kendo-window-titlebar-padding-y: k-spacing(4) !default;
+$kendo-window-titlebar-padding-y: k-spacing(5) !default;
 /// The width of the border of the Window titlebar.
 /// @group window
 $kendo-window-titlebar-border-width: 0px !default;
@@ -36,7 +36,7 @@ $kendo-window-titlebar-border-style: solid !default;
 
 /// The font size of the title of the Window.
 /// @group window
-$kendo-window-title-font-size: var( --kendo-font-size-lg, inherit ) !default;
+$kendo-window-title-font-size: var( --kendo-font-size-xl, inherit ) !default;
 /// The line height of the title of the Window.
 /// @group window
 $kendo-window-title-line-height: var( --kendo-line-height-lg, normal ) !default;
@@ -56,7 +56,7 @@ $kendo-window-action-hover-opacity: null !default;
 $kendo-window-inner-padding-x: k-spacing(6) !default;
 /// The vertical padding of the content of the Window.
 /// @group window
-$kendo-window-inner-padding-y: k-spacing(2) !default;
+$kendo-window-inner-padding-y: k-spacing(4) !default;
 
 /// The horizontal padding of the Window action buttons.
 /// @group window
@@ -79,14 +79,14 @@ $kendo-window-text: k-color(on-app-surface) !default;
 $kendo-window-border: k-color(border) !default;
 /// The box shadow of the Window.
 /// @group window
-$kendo-window-shadow: k-elevation(8) !default;
+$kendo-window-shadow: k-elevation(3) !default;
 /// The box shadow of the focused Window.
 /// @group window
-$kendo-window-focus-shadow: k-elevation(9) !default;
+$kendo-window-focus-shadow: k-elevation(4) !default;
 
 /// The background color of the Window titlebar.
 /// @group window
-$kendo-window-titlebar-bg: unset !default;
+$kendo-window-titlebar-bg: k-color(surface) !default;
 /// The text color of the Window titlebar.
 /// @group window
 $kendo-window-titlebar-text: unset !default;

package/scss/wizard/_variables.scss

@@ -4,16 +4,16 @@
 
 /// The horizontal padding of the Wizard.
 /// @group wizard
-$kendo-wizard-padding-x: calc( #{k-spacing(4)} * 1.25 ) !default;
+$kendo-wizard-padding-x: k-spacing(5) !default;
 /// The vertical padding of the Wizard.
 /// @group wizard
 $kendo-wizard-padding-y: $kendo-wizard-padding-x !default;
 /// The horizontal padding of the Wizard content.
 /// @group wizard
-$kendo-wizard-content-padding-x: calc( #{k-spacing(4)} * 2 ) !default;
+$kendo-wizard-content-padding-x: k-spacing(8) !default;
 /// The vertical padding of the Wizard content.
 /// @group wizard
-$kendo-wizard-content-padding-y: calc( #{k-spacing(1)} * 8 ) !default;
+$kendo-wizard-content-padding-y: k-spacing(8) !default;
 /// The horizontal margin of the Wizard's Button container.
 /// @group wizard
 $kendo-wizard-buttons-margin-x: k-spacing(2.5) !default;