@progress/kendo-theme-classic 8.0.0-dev.9 → 8.0.1-dev.0

package/dist/all.scss

@@ -14112,7 +14112,7 @@ $kendo-utils: (
 /// @contextType css
 
 // stylelint-disable scss/at-function-pattern
-@function __rotate( $val ) {
+@function _rotate( $val ) {
     @return rotate( $val );
 }
 // stylelint-enable scss/at-function-pattern
@@ -14121,7 +14121,7 @@ $kendo-utils: (
 
     // Rotate utility classes
     $kendo-utils-rotate: k-map-get( $kendo-utils, "rotate" ) !default;
-    @include generate-utils( rotate, transform, $kendo-utils-rotate, __rotate );
+    @include generate-utils( rotate, transform, $kendo-utils-rotate, _rotate );
 
 }
 
@@ -14146,13 +14146,13 @@ $kendo-utils: (
 /// @contextType css
 
 // stylelint-disable scss/at-function-pattern
-@function __scale( $val ) {
+@function _scale( $val ) {
     @return scale( $val );
 }
-@function __scale-x( $val ) {
+@function _scale-x( $val ) {
     @return scaleX( $val );
 }
-@function __scale-y( $val ) {
+@function _scale-y( $val ) {
     @return scaleY( $val );
 }
 // stylelint-enable scss/at-function-pattern
@@ -14161,9 +14161,9 @@ $kendo-utils: (
 
     // Scale utility classes
     $kendo-utils-scale: k-map-get( $kendo-utils, "scale" ) !default;
-    @include generate-utils( scale, transform, $kendo-utils-scale, __scale );
-    @include generate-utils( scale-x, transform, $kendo-utils-scale, __scale-x );
-    @include generate-utils( scale-y, transform, $kendo-utils-scale, __scale-y );
+    @include generate-utils( scale, transform, $kendo-utils-scale, _scale );
+    @include generate-utils( scale-x, transform, $kendo-utils-scale, _scale-x );
+    @include generate-utils( scale-y, transform, $kendo-utils-scale, _scale-y );
 
 }
 
@@ -14194,10 +14194,10 @@ $kendo-utils: (
 /// @contextType css
 
 // stylelint-disable scss/at-function-pattern
-@function __skew-x( $val ) {
+@function _skew-x( $val ) {
     @return skewX( $val );
 }
-@function __skew-y( $val ) {
+@function _skew-y( $val ) {
     @return skewY( $val );
 }
 // stylelint-enable scss/at-function-pattern
@@ -14206,8 +14206,8 @@ $kendo-utils: (
 
     // Transform skew utility classes
     $kendo-utils-skew: k-map-get( $kendo-utils, "skew" ) !default;
-    @include generate-utils( skew-x, transform, $kendo-utils-skew, __skew-x );
-    @include generate-utils( skew-y, transform, $kendo-utils-skew, __skew-y );
+    @include generate-utils( skew-x, transform, $kendo-utils-skew, _skew-x );
+    @include generate-utils( skew-y, transform, $kendo-utils-skew, _skew-y );
 
 }
 
@@ -14268,13 +14268,13 @@ $kendo-utils: (
 /// @contextType css
 
 // stylelint-disable scss/at-function-pattern
-@function __translate( $val ) {
+@function _translate( $val ) {
     @return translate( $val );
 }
-@function __translate-x( $val ) {
+@function _translate-x( $val ) {
     @return translateX( $val );
 }
-@function __translate-y( $val ) {
+@function _translate-y( $val ) {
     @return translateY( $val );
 }
 // stylelint-enable scss/at-function-pattern
@@ -14294,9 +14294,9 @@ $kendo-utils: (
         "100-50": ( 100%, 50% ),
         "100-100": ( 100%, 100% )
     ) !default;
-    @include generate-utils( translate, transform, $kendo-utils-translate-xy, __translate );
-    @include generate-utils( translate-x, transform, $kendo-utils-translate, __translate-x );
-    @include generate-utils( translate-y, transform, $kendo-utils-translate, __translate-y );
+    @include generate-utils( translate, transform, $kendo-utils-translate-xy, _translate );
+    @include generate-utils( translate-x, transform, $kendo-utils-translate, _translate-x );
+    @include generate-utils( translate-y, transform, $kendo-utils-translate, _translate-y );
 
 }
 
@@ -19596,7 +19596,7 @@ $kendo-badge-sizes: (
     // Outline badges
     .k-badge-outline {
         border-color: currentColor;
-        background-color: $kendo-component-bg;
+        background-color: transparent;
     }
 
     @each $name, $color in $kendo-theme-colors {
@@ -20076,7 +20076,7 @@ $kendo-chip-solid-selected-text: null !default;
 $kendo-chip-outline-bg: $kendo-component-bg !default;
 /// The base text color of the outline Chip.
 /// @group chip
-$kendo-chip-outline-text: $kendo-chip-solid-text !default;
+$kendo-chip-outline-text: if($kendo-enable-color-system, k-color( base-on-surface ), $kendo-chip-solid-text) !default;
 /// The base border color of the outline Chip.
 /// @group chip
 $kendo-chip-outline-border: $kendo-chip-outline-text !default;
@@ -20348,7 +20348,7 @@ $kendo-chip-list-sizes: (
             @if ($name == "base") {
                 @include fill(
                     $kendo-chip-outline-text,
-                    $kendo-chip-outline-bg,
+                    transparent,
                     $kendo-chip-outline-border
                 );
 
@@ -20373,8 +20373,8 @@ $kendo-chip-list-sizes: (
                 }
             } @else if ($name == "warning") {
                 @include fill(
-                    if($kendo-enable-color-system, $kendo-chip-outline-text, if( $kendo-is-dark-theme, k-color-tint($color, 25%), $kendo-chip-outline-text)),
-                    if($kendo-enable-color-system, k-color( app-surface ), if( $kendo-is-dark-theme, $kendo-color-black, $kendo-color-white )),
+                    if($kendo-enable-color-system, k-color( on-app-surface ), if( $kendo-is-dark-theme, k-color-tint($color, 25%), $kendo-chip-outline-text)),
+                    if($kendo-enable-color-system, transparent, if( $kendo-is-dark-theme, $kendo-color-black, $kendo-color-white )),
                     if($kendo-enable-color-system, $color, if( $kendo-is-dark-theme, k-color-tint($color, 25%), $color))
                 );
 
@@ -20400,7 +20400,7 @@ $kendo-chip-list-sizes: (
             } @else {
                 @include fill(
                     if($kendo-enable-color-system, k-color( #{$name}-on-surface ), k-try-shade( $color, 25% )),
-                    if($kendo-enable-color-system, k-color( app-surface ), if( $kendo-is-dark-theme, $kendo-color-black, $kendo-color-white )),
+                    if($kendo-enable-color-system, transparent, if( $kendo-is-dark-theme, $kendo-color-black, $kendo-color-white )),
                     if($kendo-enable-color-system, k-color( #{$name}-on-surface ), k-try-shade( $color, 25% ))
                 );
 
@@ -22204,9 +22204,9 @@ $_kendo-module-meta: (
             &.k-hover {
                 @if $name == "base" {
                     @include fill(
-                        if($kendo-enable-color-system, $kendo-base-bg, k-contrast-legacy( $color )),
-                        $color,
-                        $color
+                        if($kendo-enable-color-system, k-color( base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color ))
                     );
                 } @else {
                     @include fill(
@@ -22234,9 +22234,9 @@ $_kendo-module-meta: (
             &.k-active {
                 @if $name == "base" {
                     @include fill(
-                        if($kendo-enable-color-system, $kendo-base-bg, k-contrast-legacy( $color )),
-                        $color,
-                        $color
+                        if($kendo-enable-color-system, k-color( base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color ))
                     );
                 } @else {
                     @include fill(
@@ -22251,9 +22251,9 @@ $_kendo-module-meta: (
             &.k-selected {
                 @if $name == "base" {
                     @include fill(
-                        if($kendo-enable-color-system, $kendo-base-bg, k-contrast-legacy( $color )),
-                        $color,
-                        $color
+                        if($kendo-enable-color-system, k-color( base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color )),
+                        if($kendo-enable-color-system, k-color( on-base ), k-contrast-legacy( $color ))
                     );
                 } @else {
                     @include fill(
@@ -22276,7 +22276,11 @@ $_kendo-module-meta: (
     // Flat button
     @each $name, $color in k-map-merge( $kendo-button-theme-colors, ( "base": inherit ) ) {
         .k-button-flat-#{$name} {
-            color: $color;
+            @if $name == "base" {
+                color: inherit;
+            } @else {
+                color: if($kendo-enable-color-system, k-color( #{$name}-on-surface ), $color);
+            }
 
             // Disabled state
             &:disabled,
@@ -22345,7 +22349,7 @@ $_kendo-module-meta: (
     // Clear button
     @each $name, $color in k-map-merge( $kendo-button-theme-colors, ( "base": $kendo-base-text ) ) {
         .k-button-clear-#{$name} {
-            color: $color;
+            color: if($kendo-enable-color-system, k-color( #{$name}-on-surface ), $color);
 
             &:focus,
             &.k-focus,
@@ -29322,8 +29326,15 @@ $_kendo-module-meta: (
 /// The width of the border around the Calendar.
 /// @group calendar
 $kendo-calendar-border-width: 1px !default;
+
+/// The font family of the Calendar.
+/// @group calendar
 $kendo-calendar-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font size of the Calendar.
+/// @group calendar
 $kendo-calendar-font-size: var( --kendo-font-size, inherit ) !default;
+/// The line height of the Calendar.
+/// @group calendar
 $kendo-calendar-line-height: var( --kendo-line-height, normal ) !default;
 
 /// The size of the cells in the Calendar.
@@ -29405,7 +29416,11 @@ $kendo-calendar-header-cell-width: $kendo-calendar-cell-size !default;
 /// The height of the header cells in the Calendar.
 /// @group calendar
 $kendo-calendar-header-cell-height: $kendo-calendar-cell-size !default;
+/// The font size of the header cells in the Calendar.
+/// @group calendar
 $kendo-calendar-header-cell-font-size: var( --kendo-font-size-sm, inherit ) !default;
+/// The line height of the header cells in the Calendar.
+/// @group calendar
 $kendo-calendar-header-cell-line-height: 2 !default;
 
 /// The background color of the header cells in the Calendar.
@@ -30117,9 +30132,6 @@ $kendo-calendar-sizes: (
         // }
     }
 
-
-
-
     // Multiview calendar
     .k-calendar-range {
         width: auto;
@@ -30136,25 +30148,34 @@ $kendo-calendar-sizes: (
                 outline: 0;
             }
         }
+    }
 
-        .k-range-start .k-calendar-cell-inner,
-        .k-range-start .k-link {
-            border-color: inherit;
-            border-radius: $kendo-calendar-range-cell-border-radius 0 0 $kendo-calendar-range-cell-border-radius;
-        }
-        .k-range-end .k-calendar-cell-inner,
-        .k-range-end .k-link {
+    // Range Selection
+    .k-range-start {
+        border-radius: $kendo-calendar-range-cell-border-radius 0 0 $kendo-calendar-range-cell-border-radius;
+
+        .k-calendar-cell-inner,
+        .k-link {
             border-color: inherit;
-            border-radius: 0 $kendo-calendar-range-cell-border-radius $kendo-calendar-range-cell-border-radius 0;
+            border-radius: inherit;
         }
-        .k-range-mid {
+    }
+    .k-range-end {
+        border-radius: 0 $kendo-calendar-range-cell-border-radius $kendo-calendar-range-cell-border-radius 0;
+
+        .k-calendar-cell-inner,
+        .k-link {
             border-color: inherit;
-            border-radius: 0;
+            border-radius: inherit;
         }
     }
-
-
-
+    .k-range-mid {
+        border-color: inherit;
+        border-radius: 0;
+    }
+    .k-range-start.k-range-end {
+        border-radius: $kendo-calendar-range-cell-border-radius;
+    }
 
     // RTL
     .k-rtl .k-calendar,
@@ -30167,21 +30188,14 @@ $kendo-calendar-sizes: (
             @include hide-scrollbar("left");
         }
 
-    }
-
-    .k-rtl .k-calendar-range,
-    [dir="rtl"] .k-calendar-range,
-    .k-calendar-range.k-rtl,
-    .k-calendar-range[dir="rtl"] {
-
-        .k-range-start .k-calendar-cell-inner,
-        .k-range-start .k-link {
+        // Range Selection RTL
+        .k-range-start {
             border-radius: 0 $kendo-calendar-range-cell-border-radius $kendo-calendar-range-cell-border-radius 0;
         }
-        .k-range-end .k-calendar-cell-inner,
-        .k-range-end .k-link {
+        .k-range-end {
             border-radius: $kendo-calendar-range-cell-border-radius 0 0 $kendo-calendar-range-cell-border-radius;
         }
+
     }
 
 }
@@ -30368,11 +30382,6 @@ $kendo-calendar-sizes: (
             background-color: $kendo-calendar-range-bg;
         }
 
-        .k-range-start.k-range-end {
-            background-image: none;
-            background-color: transparent;
-        }
-
         .k-range-start,
         .k-range-end {
             .k-calendar-cell-inner {
@@ -37475,7 +37484,7 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-spacing(4) !default;
         }
 
         .k-actionsheet-filter {
-            width: calc( min(100%, calc( 360px - calc( #{$kendo-adaptive-actionsheet-titlebar-padding-x} * 2 )) ) );
+            width: calc( 360px - #{$kendo-adaptive-actionsheet-titlebar-padding-x} * 2 );
         }
         .k-actionsheet-content,
         .k-actionsheet-footer {
@@ -38299,13 +38308,23 @@ $kendo-drawer-border: $kendo-component-border !default;
 /// The border width of the Drawer.
 /// @group drawer
 $kendo-drawer-border-width: 1px !default;
+
+/// The font family of the Drawer.
+/// @group drawer
 $kendo-drawer-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font size of the Drawer.
+/// @group drawer
 $kendo-drawer-font-size: var( --kendo-font-size, inherit ) !default;
+/// The line height of the Drawer.
+/// @group drawer
 $kendo-drawer-line-height: var( --kendo-line-height, normal ) !default;
-$kendo-drawer-content-padding-x: $kendo-padding-md-x !default;
+
+/// The horizontal padding of the Drawer content.
+/// @group drawer
+$kendo-drawer-content-padding-x: null !default;
 /// The vertical padding of the Drawer content.
 /// @group drawer
-$kendo-drawer-content-padding-y: $kendo-padding-md-y !default;
+$kendo-drawer-content-padding-y: null !default;
 
 /// The width of the Drawer scrollbar.
 /// @group drawer
@@ -38453,6 +38472,8 @@ $kendo-drawer-selected-hover-text: $kendo-selected-hover-text !default;
     .k-drawer-content {
         flex: 1 1 auto;
         overflow: auto;
+        padding-block: $kendo-drawer-content-padding-y;
+        padding-inline: $kendo-drawer-content-padding-x;
     }
 
 
@@ -48495,6 +48516,7 @@ $kendo-listview-item-focus-shadow: inset 0 0 0 2px rgba( black, .13 ) !default;
         font-family: $kendo-listview-font-family;
         font-size: $kendo-listview-font-size;
         line-height: $kendo-listview-line-height;
+        display: flex;
         flex-flow: column nowrap;
         position: relative;
         -webkit-touch-callout: none;
@@ -61136,7 +61158,10 @@ $kendo-treemap-line-height: var( --kendo-line-height, normal ) !default;
     }
 
 
-
+    // Sankey labels
+    .k-sankey text {
+        pointer-events: none;
+    }
 
     // Treemap
     .k-treemap {
@@ -61321,7 +61346,7 @@ $kendo-treemap-line-height: var( --kendo-line-height, normal ) !default;
         series-30: $kendo-series-30,
 
         gauge-pointer: $kendo-color-primary,
-        gauge-track: if($kendo-enable-color-system, k-color( base ), k-try-shade( $kendo-chart-bg ))
+        gauge-track: if($kendo-enable-color-system, k-color( base-emphasis ), k-try-shade( $kendo-chart-bg ))
     );
 
     @each $name, $value in $exported {