@progress/kendo-theme-material 5.1.1 → 5.1.2-dev.0

package/dist/all.css

@@ -13854,6 +13854,23 @@ textarea.k-input-inner {
     border-bottom-style: dashed;
 }
 
+.k-input:disabled, .k-input[disabled], .k-input.k-disabled,
+.k-picker:disabled,
+.k-picker[disabled],
+.k-picker.k-disabled {
+    opacity: 1;
+    filter: none;
+}
+
+.k-input .k-input-button,
+.k-input .k-input-spinner .k-spinner-increase,
+.k-input .k-input-spinner .k-spinner-decrease,
+.k-picker .k-input-button,
+.k-picker .k-input-spinner .k-spinner-increase,
+.k-picker .k-input-spinner .k-spinner-decrease {
+    color: inherit;
+}
+
 .k-floating-label-container::after {
     display: block;
     z-index: 2;
@@ -13898,6 +13915,12 @@ textarea.k-input-inner {
     border-color: #3f51b5;
 }
 
+.k-input:disabled, .k-input[disabled], .k-input.k-disabled {
+    border-color: rgba(0, 0, 0, 0.06);
+    color: rgba(0, 0, 0, 0.38);
+    background-color: #fafafa;
+}
+
 .k-input.k-invalid, .k-input.ng-invalid.ng-touched, .k-input.ng-invalid.ng-dirty {
     border-color: #f31700;
 }
@@ -13924,6 +13947,12 @@ textarea.k-input-inner {
     border-color: #3f51b5;
 }
 
+.k-picker:disabled, .k-picker[disabled], .k-picker.k-disabled {
+    border-color: rgba(0, 0, 0, 0.06);
+    color: rgba(0, 0, 0, 0.38);
+    background-color: #fafafa;
+}
+
 .k-picker.k-invalid, .k-picker.ng-invalid.ng-touched, .k-picker.ng-invalid.ng-dirty {
     border-color: #f31700;
 }

package/dist/all.scss

@@ -10011,6 +10011,12 @@ $kendo-input-focus-text: null !default;
 $kendo-input-focus-border: $primary !default;
 $kendo-input-focus-shadow: null !default;
 
+$kendo-input-disabled-bg: try-shade( $component-bg, .25 ) !default;
+$kendo-input-disabled-text: $disabled-text !default;
+$kendo-input-disabled-border: rgba( $component-border, (alpha( $component-border ) / 2) ) !default;
+$kendo-input-disabled-gradient: null !default;
+$kendo-input-disabled-shadow: null !default;
+
 $kendo-picker-bg: $kendo-input-bg !default;
 $kendo-picker-text: $kendo-input-text !default;
 $kendo-picker-border: $kendo-input-border !default;
@@ -10029,7 +10035,11 @@ $kendo-picker-focus-border: $kendo-input-focus-border !default;
 $kendo-picker-focus-gradient: null !default;
 $kendo-picker-focus-shadow: $kendo-input-focus-shadow !default;
 
-$kendo-input-disabled-bg: rgb(189, 189, 189) !default;
+$kendo-picker-disabled-bg: $kendo-input-disabled-bg !default;
+$kendo-picker-disabled-text: $kendo-input-disabled-text !default;
+$kendo-picker-disabled-border: $kendo-input-disabled-border !default;
+$kendo-picker-disabled-gradient: null !default;
+$kendo-picker-disabled-shadow: null !default;
 
 $kendo-input-placeholder-text: $subtle-text !default;
 $kendo-input-placeholder-opacity: 1 !default;
@@ -10514,6 +10524,24 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
     }
 
 
+    // Disabled
+    .k-input,
+    .k-picker {
+        &:disabled,
+        &[disabled],
+        &.k-disabled {
+            opacity: 1;
+            filter: none;
+        }
+
+        .k-input-button,
+        .k-input-spinner .k-spinner-increase,
+        .k-input-spinner .k-spinner-decrease {
+            color: inherit;
+        }
+    }
+
+
     // Input ripple
     .k-floating-label-container {
         @include input-ripple();
@@ -10563,6 +10591,19 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
             @include box-shadow( $kendo-input-focus-shadow );
         }
 
+        //Disabled
+        &:disabled,
+        &[disabled],
+        &.k-disabled {
+            @include fill(
+                $kendo-input-disabled-text,
+                $kendo-input-disabled-bg,
+                $kendo-input-disabled-border,
+                $kendo-input-disabled-gradient
+            );
+            @include box-shadow( $kendo-input-disabled-shadow );
+        }
+
         // Invalid
         &.k-invalid,
         &.ng-invalid.ng-touched,
@@ -10626,6 +10667,19 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
             @include box-shadow( $kendo-picker-focus-shadow );
         }
 
+        //Disabled
+        &:disabled,
+        &[disabled],
+        &.k-disabled {
+            @include fill(
+                $kendo-picker-disabled-text,
+                $kendo-picker-disabled-bg,
+                $kendo-picker-disabled-border,
+                $kendo-picker-disabled-gradient
+            );
+            @include box-shadow( $kendo-picker-disabled-shadow );
+        }
+
         // Invalid
         &.k-invalid,
         &.ng-invalid.ng-touched,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-material",
   "description": "Material theme for Kendo UI",
-  "version": "5.1.1",
+  "version": "5.1.2-dev.0",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -50,7 +50,7 @@
     "postpublish": "echo 'no postpublish for material theme'"
   },
   "dependencies": {
-    "@progress/kendo-theme-default": "^5.1.1"
+    "@progress/kendo-theme-default": "^5.1.2-dev.0"
   },
-  "gitHead": "798d6d06021f47b42f71b16530f96ab23d2b9c04"
+  "gitHead": "c492bbaeca2d104534c4b4329c41afd762bb563b"
 }

package/scss/input/_layout.scss

@@ -32,6 +32,24 @@
     }
 
 
+    // Disabled
+    .k-input,
+    .k-picker {
+        &:disabled,
+        &[disabled],
+        &.k-disabled {
+            opacity: 1;
+            filter: none;
+        }
+
+        .k-input-button,
+        .k-input-spinner .k-spinner-increase,
+        .k-input-spinner .k-spinner-decrease {
+            color: inherit;
+        }
+    }
+
+
     // Input ripple
     .k-floating-label-container {
         @include input-ripple();

package/scss/input/_variables.scss

@@ -71,6 +71,12 @@ $kendo-input-focus-text: null !default;
 $kendo-input-focus-border: $primary !default;
 $kendo-input-focus-shadow: null !default;
 
+$kendo-input-disabled-bg: try-shade( $component-bg, .25 ) !default;
+$kendo-input-disabled-text: $disabled-text !default;
+$kendo-input-disabled-border: rgba( $component-border, (alpha( $component-border ) / 2) ) !default;
+$kendo-input-disabled-gradient: null !default;
+$kendo-input-disabled-shadow: null !default;
+
 $kendo-picker-bg: $kendo-input-bg !default;
 $kendo-picker-text: $kendo-input-text !default;
 $kendo-picker-border: $kendo-input-border !default;
@@ -89,7 +95,11 @@ $kendo-picker-focus-border: $kendo-input-focus-border !default;
 $kendo-picker-focus-gradient: null !default;
 $kendo-picker-focus-shadow: $kendo-input-focus-shadow !default;
 
-$kendo-input-disabled-bg: rgb(189, 189, 189) !default;
+$kendo-picker-disabled-bg: $kendo-input-disabled-bg !default;
+$kendo-picker-disabled-text: $kendo-input-disabled-text !default;
+$kendo-picker-disabled-border: $kendo-input-disabled-border !default;
+$kendo-picker-disabled-gradient: null !default;
+$kendo-picker-disabled-shadow: null !default;
 
 $kendo-input-placeholder-text: $subtle-text !default;
 $kendo-input-placeholder-opacity: 1 !default;