@progress/kendo-theme-bootstrap 5.1.2-dev.5 → 5.1.2-dev.6

package/dist/all.css

@@ -13308,7 +13308,9 @@ textarea.k-input-inner {
 
 .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;
@@ -13473,10 +13475,14 @@ textarea.k-input-inner {
 .k-input-sm .k-input-validation-icon,
 .k-input-sm .k-input-loading-icon,
 .k-input-sm .k-clear-value,
+.k-input-sm .k-input-prefix > .k-icon,
+.k-input-sm .k-input-suffix > .k-icon,
 .k-picker-sm .k-input-icon,
 .k-picker-sm .k-input-validation-icon,
 .k-picker-sm .k-input-loading-icon,
-.k-picker-sm .k-clear-value {
+.k-picker-sm .k-clear-value,
+.k-picker-sm .k-input-prefix > .k-icon,
+.k-picker-sm .k-input-suffix > .k-icon {
     width: calc(16px + 0.5rem);
     height: calc(16px + 0.5rem);
 }
@@ -13532,10 +13538,14 @@ textarea.k-input-inner {
 .k-input-md .k-input-validation-icon,
 .k-input-md .k-input-loading-icon,
 .k-input-md .k-clear-value,
+.k-input-md .k-input-prefix > .k-icon,
+.k-input-md .k-input-suffix > .k-icon,
 .k-picker-md .k-input-icon,
 .k-picker-md .k-input-validation-icon,
 .k-picker-md .k-input-loading-icon,
-.k-picker-md .k-clear-value {
+.k-picker-md .k-clear-value,
+.k-picker-md .k-input-prefix > .k-icon,
+.k-picker-md .k-input-suffix > .k-icon {
     width: calc(16px + 0.75rem);
     height: calc(16px + 0.75rem);
 }
@@ -13591,10 +13601,14 @@ textarea.k-input-inner {
 .k-input-lg .k-input-validation-icon,
 .k-input-lg .k-input-loading-icon,
 .k-input-lg .k-clear-value,
+.k-input-lg .k-input-prefix > .k-icon,
+.k-input-lg .k-input-suffix > .k-icon,
 .k-picker-lg .k-input-icon,
 .k-picker-lg .k-input-validation-icon,
 .k-picker-lg .k-input-loading-icon,
-.k-picker-lg .k-clear-value {
+.k-picker-lg .k-clear-value,
+.k-picker-lg .k-input-prefix > .k-icon,
+.k-picker-lg .k-input-suffix > .k-icon {
     width: calc(16px + 1rem);
     height: calc(16px + 1rem);
 }
@@ -16622,10 +16636,6 @@ kendo-label > .k-label {
     max-width: 300px;
 }
 
-.k-textarea {
-    display: flex;
-}
-
 .k-listbox {
     width: 10em;
     height: 200px;
@@ -22109,34 +22119,28 @@ kendo-drawer .k-drawer-wrapper {
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.03), 0 4px 5px 0 rgba(0, 0, 0, 0.04);
 }
 
-.k-notification-primary {
-    border-color: #cfe2ff;
-    color: #073984;
-    background-color: #bbd6fe;
-}
-
-.k-notification-secondary {
-    border-color: #e2e3e5;
-    color: #383d41;
-    background-color: #d6d8db;
+.k-notification-inverse {
+    border-color: #d3d3d4;
+    color: #111315;
+    background-color: #c1c2c3;
 }
 
-.k-notification-tertiary {
-    border-color: #e2d9f3;
-    color: #3a2264;
-    background-color: #d7caee;
+.k-notification-light {
+    border-color: #fefefe;
+    color: #818182;
+    background-color: #fdfdfe;
 }
 
-.k-notification-info {
-    border-color: #cff4fc;
-    color: #07697d;
-    background-color: #bbf0fb;
+.k-notification-dark {
+    border-color: #d3d3d4;
+    color: #111315;
+    background-color: #c1c2c3;
 }
 
-.k-notification-success {
-    border-color: #d1e7dd;
-    color: #0d462c;
-    background-color: #bfddcf;
+.k-notification-error {
+    border-color: #f8d7da;
+    color: #721c24;
+    background-color: #f5c6cb;
 }
 
 .k-notification-warning {
@@ -22145,28 +22149,34 @@ kendo-drawer .k-drawer-wrapper {
     background-color: #ffeeba;
 }
 
-.k-notification-error {
-    border-color: #f8d7da;
-    color: #721c24;
-    background-color: #f5c6cb;
+.k-notification-success {
+    border-color: #d1e7dd;
+    color: #0d462c;
+    background-color: #bfddcf;
 }
 
-.k-notification-dark {
-    border-color: #d3d3d4;
-    color: #111315;
-    background-color: #c1c2c3;
+.k-notification-info {
+    border-color: #cff4fc;
+    color: #07697d;
+    background-color: #bbf0fb;
 }
 
-.k-notification-light {
-    border-color: #fefefe;
-    color: #818182;
-    background-color: #fdfdfe;
+.k-notification-tertiary {
+    border-color: #e2d9f3;
+    color: #3a2264;
+    background-color: #d7caee;
 }
 
-.k-notification-inverse {
-    border-color: #d3d3d4;
-    color: #111315;
-    background-color: #c1c2c3;
+.k-notification-secondary {
+    border-color: #e2e3e5;
+    color: #383d41;
+    background-color: #d6d8db;
+}
+
+.k-notification-primary {
+    border-color: #cfe2ff;
+    color: #073984;
+    background-color: #bbd6fe;
 }
 
 kendo-card,

package/dist/all.scss

@@ -11255,7 +11255,9 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
     // 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;
@@ -11429,7 +11431,9 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
             .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;
             }
@@ -16408,9 +16412,7 @@ $fieldset-legend-border: null !default;
 @include exports( "textarea/layout" ) {
 
     // Textarea
-    .k-textarea {
-        display: flex;
-    }
+    .k-textarea {}
 
 }
 
@@ -25091,22 +25093,23 @@ $notification-bg: $component-bg !default;
 $notification-text: $component-text !default;
 $notification-border: $component-border !default;
 
-$notification-themes: () !default;
+@function notification-theme( $colors ) {
+    $_theme: ();
 
-@function notification-theme($name: null, $color: null) {
-    // sass-lint:disable indentation
-    @return (
-        border: tint( $color, 10 ),
-        color: shade( $color, 6 ),
-        bg: tint( $color, 9 )
-    );
-    // sass-lint:enable indentation
-}
+    @each $name, $color in $colors {
+        $_theme: map-merge(( $name: (
+            color: shade( $color, 6 ),
+            background-color: tint( $color, 9 ),
+            border: tint( $color, 10 ),
+        )), $_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;
+
 // #endregion
 // #region @import "_layout.scss"; -> packages/bootstrap/scss/notification/_layout.scss
 // #region @import "~@progress/kendo-theme-default/scss/notification/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/notification/_layout.scss
@@ -25219,11 +25222,13 @@ $notification-themes: () !default;
         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/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-bootstrap",
   "description": "Bootstrap theme for Kendo UI",
-  "version": "5.1.2-dev.5",
+  "version": "5.1.2-dev.6",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -49,8 +49,8 @@
     "postpublish": "echo 'no postpublish for bootstrap theme'"
   },
   "dependencies": {
-    "@progress/kendo-theme-default": "^5.1.2-dev.5",
+    "@progress/kendo-theme-default": "^5.1.2-dev.6",
     "bootstrap": "^5.1.0"
   },
-  "gitHead": "b4a2644f36f4dd8559aadb2ce2eb3d08ef1e4c55"
+  "gitHead": "64d87da064a0cfce86ebb8ebe986ac30977f7fb7"
 }

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: tint( $color, 10 ),
-        color: shade( $color, 6 ),
-        bg: tint( $color, 9 )
-    );
-    // sass-lint:enable indentation
-}
+@function notification-theme( $colors ) {
+    $_theme: ();
+
+    @each $name, $color in $colors {
+        $_theme: map-merge(( $name: (
+            color: shade( $color, 6 ),
+            background-color: tint( $color, 9 ),
+            border: tint( $color, 10 ),
+        )), $_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;