@progress/kendo-theme-default 5.1.2-dev.2 → 5.1.2-dev.6

package/scss/input/_layout.scss

@@ -185,7 +185,9 @@
     // Input with icon styles
     .k-input-icon,
     .k-input-validation-icon,
-    .k-input-loading-icon {
+    .k-input-loading-icon,
+    .k-input-prefix > .k-icon,
+    .k-input-suffix > .k-icon {
         flex: none;
         align-self: center;
         display: inline-flex;
@@ -359,7 +361,9 @@
             .k-input-icon,
             .k-input-validation-icon,
             .k-input-loading-icon,
-            .k-clear-value {
+            .k-clear-value,
+            .k-input-prefix > .k-icon,
+            .k-input-suffix > .k-icon {
                 width: $_icon-size;
                 height: $_icon-size;
             }

package/scss/menu/_theme.scss

@@ -80,14 +80,11 @@
                     $kendo-menu-popup-item-expanded-gradient
                 );
             }
-
-            &.k-focus {
-                @include box-shadow( $kendo-menu-popup-item-focus-shadow );
-            }
         }
 
         .k-item {
-            &:focus {
+            &:focus,
+            &.k-focus {
                 @include box-shadow( $kendo-menu-popup-item-focus-shadow );
             }
         }

package/scss/notification/_theme.scss

@@ -17,11 +17,13 @@
         box-shadow: $notification-shadow;
     }
 
-    @each $theme, $props in $notification-themes {
-        .k-notification-#{$theme} {
-            border-color: map-get( $props, border );
-            color: map-get( $props, color );
-            background-color: map-get( $props, bg );
+    @each $name, $props in $kendo-notification-theme {
+        .k-notification-#{$name} {
+            @include fill(
+                map-get( $props, color ),
+                map-get( $props, background-color ),
+                map-get( $props, border )
+            );
         }
     }
 

package/scss/notification/_variables.scss

@@ -17,18 +17,19 @@ $notification-bg: $component-bg !default;
 $notification-text: $component-text !default;
 $notification-border: $component-border !default;
 
-$notification-themes: () !default;
-
-@function notification-theme($name: null, $color: null) {
-    // sass-lint:disable indentation
-    @return (
-        border: $color,
-        color: contrast-wcag( $color ),
-        bg: $color
-    );
-    // sass-lint:enable indentation
-}
+@function notification-theme( $colors ) {
+    $_theme: ();
+
+    @each $name, $color in $colors {
+        $_theme: map-merge(( $name: (
+            color: contrast-wcag( $color ),
+            background-color: $color,
+            border: $color,
+        )), $_theme );
+    }
 
-@each $theme, $props in $kendo-theme-colors {
-    $notification-themes: map-merge($notification-themes, ($theme: notification-theme($theme, $props)) );
+    @return $_theme;
 }
+
+$kendo-notification-theme-colors: $kendo-theme-colors !default;
+$kendo-notification-theme: notification-theme( $kendo-notification-theme-colors ) !default;

package/scss/pivotgrid/_layout.scss

@@ -134,6 +134,7 @@
 
     .k-pivotgrid-cell .k-icon {
         cursor: pointer;
+        padding-inline-end: $pivotgrid-icon-spacing;
     }
 
     .k-pivotgrid-total {

package/scss/pivotgrid/_variables.scss

@@ -6,6 +6,7 @@ $pivotgrid-font-family: $font-family !default;
 $pivotgrid-font-size: $font-size !default;
 $pivotgrid-line-height: $line-height !default;
 $pivotgrid-border-width: 1px !default;
+$pivotgrid-icon-spacing: 8px !default;
 
 $pivotgrid-row-header-width: 300px !default;
 $pivotgrid-column-header-height: 75px !default;

package/scss/textarea/_layout.scss

@@ -1,8 +1,6 @@
 @include exports( "textarea/layout" ) {
 
     // Textarea
-    .k-textarea {
-        display: flex;
-    }
+    .k-textarea {}
 
 }

package/scss/utils/_overflow.scss

@@ -46,16 +46,22 @@
     // sass-lint:disable no-important
     @if $utils-overflow {
         @each $overflow in $utils-overflow {
-            .k-overflow-#{$overflow} { overflow: $overflow !important; }
-            .k-overflow-x-#{$overflow} { overflow-x: $overflow !important; }
-            .k-overflow-y-#{$overflow} { overflow-y: $overflow !important; }
+            .k-overflow-#{$overflow} { overflow: $overflow; }
+            .k-overflow-x-#{$overflow} { overflow-x: $overflow; }
+            .k-overflow-y-#{$overflow} { overflow-y: $overflow; }
+
+            .\!k-overflow-#{$overflow}   { overflow: $overflow !important; }
+            .\!k-overflow-x-#{$overflow} { overflow-x: $overflow !important; }
+            .\!k-overflow-y-#{$overflow} { overflow-y: $overflow !important; }
         }
 
 
         @each $overflow-x in $utils-overflow {
             @each $overflow-y in $utils-overflow {
                 @if $overflow-x != $overflow-y {
-                    .k-overflow-#{$overflow-x}-#{$overflow-y} { overflow: $overflow-x $overflow-y !important; }
+                    .k-overflow-#{$overflow-x}-#{$overflow-y} { overflow: $overflow-x $overflow-y; }
+
+                    .\!k-overflow-#{$overflow-x}-#{$overflow-y} { overflow: $overflow-x $overflow-y !important; }
                 }
             }
         }

package/scss/utils/_resize.scss

@@ -27,8 +27,10 @@
 
     @if $utils-resize {
         @each $resize in $utils-resize {
+            .k-resize-#{$resize} { resize: $resize; }
+
             // sass-lint:disable-block no-important
-            .k-resize-#{$resize} { resize: $resize !important; }
+            .\!k-resize-#{$resize} { resize: $resize !important; }
         }
     }