@progress/kendo-theme-default 5.4.2-dev.2 → 5.4.2-dev.5

package/dist/all.css

@@ -13728,31 +13728,17 @@ textarea.k-input-inner {
 
 .k-input-flat,
 .k-picker-flat {
-    border-radius: 0 !important;
+    border-bottom-right-radius: 0 !important;
+    border-bottom-left-radius: 0 !important;
     border-width: 1px 0;
     border-top-color: transparent !important;
     background-image: none !important;
 }
 
-.k-input-flat:focus, .k-input-flat.k-focus,
-.k-picker-flat:focus,
-.k-picker-flat.k-focus {
-    border-radius: 4px 4px 0px 0px !important;
-}
-
-.k-input-flat:focus-within,
-.k-picker-flat:focus-within {
-    border-radius: 4px 4px 0px 0px !important;
-}
-
 .k-input-outline {
     background: none !important;
 }
 
-.k-picker.k-picker-flat {
-    border-radius: 4px 4px 0px 0px !important;
-}
-
 .k-input-sm,
 .k-picker-sm {
     font-size: 14px;
@@ -13977,63 +13963,64 @@ textarea.k-input-inner {
     animation-name: autoFillEnd;
 }
 
-.k-input {
+.k-input-solid {
     border-color: rgba(0, 0, 0, 0.08);
     color: #424242;
     background-color: #ffffff;
 }
 
-.k-input:hover, .k-input.k-hover {
+.k-input-solid:hover, .k-input-solid.k-hover {
     border-color: rgba(0, 0, 0, 0.16);
 }
 
-.k-input:focus, .k-input.k-focus {
+.k-input-solid:focus, .k-input-solid.k-focus {
     border-color: rgba(0, 0, 0, 0.16);
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
-.k-input:focus-within {
+.k-input-solid:focus-within {
     border-color: rgba(0, 0, 0, 0.16);
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
-.k-input.k-invalid, .k-input.ng-invalid.ng-touched, .k-input.ng-invalid.ng-dirty {
+.k-input-solid.k-invalid, .k-input-solid.ng-invalid.ng-touched, .k-input-solid.ng-invalid.ng-dirty {
     border-color: #f31700;
 }
 
-.k-input.k-invalid .k-input-validation-icon, .k-input.ng-invalid.ng-touched .k-input-validation-icon, .k-input.ng-invalid.ng-dirty .k-input-validation-icon {
+.k-input-solid.k-invalid .k-input-validation-icon, .k-input-solid.ng-invalid.ng-touched .k-input-validation-icon, .k-input-solid.ng-invalid.ng-dirty .k-input-validation-icon {
     color: #f31700;
 }
 
-.k-picker {
+.k-picker-solid {
     border-color: rgba(0, 0, 0, 0.08);
     color: #424242;
     background-color: #f5f5f5;
     background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
 }
 
-.k-picker:hover, .k-picker.k-hover {
+.k-picker-solid:hover, .k-picker-solid.k-hover {
     background-color: #ebebeb;
 }
 
-.k-picker:focus, .k-picker.k-focus {
+.k-picker-solid:focus, .k-picker-solid.k-focus {
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
-.k-picker:focus-within {
+.k-picker-solid:focus-within {
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
-.k-picker.k-invalid, .k-picker.ng-invalid.ng-touched, .k-picker.ng-invalid.ng-dirty {
+.k-picker-solid.k-invalid, .k-picker-solid.ng-invalid.ng-touched, .k-picker-solid.ng-invalid.ng-dirty {
     border-color: #f31700;
 }
 
-.k-picker.k-invalid .k-input-validation-icon, .k-picker.ng-invalid.ng-touched .k-input-validation-icon, .k-picker.ng-invalid.ng-dirty .k-input-validation-icon {
+.k-picker-solid.k-invalid .k-input-validation-icon, .k-picker-solid.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-solid.ng-invalid.ng-dirty .k-input-validation-icon {
     color: #f31700;
 }
 
 .k-input-outline {
     border-color: rgba(66, 66, 66, 0.5);
+    color: #424242;
 }
 
 .k-input-outline > .k-input-button {
@@ -14054,7 +14041,10 @@ textarea.k-input-inner {
 }
 
 .k-input-outline:focus, .k-input-outline.k-focus {
-    border-color: rgba(66, 66, 66, 0.5);
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
+.k-input-outline:focus-within {
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
@@ -14067,24 +14057,22 @@ textarea.k-input-inner {
 }
 
 .k-picker-outline {
-    border-color: #424242;
-    background-color: transparent;
+    border-color: rgba(66, 66, 66, 0.5);
+    color: #424242;
 }
 
 .k-picker-outline:hover, .k-picker-outline.k-hover {
-    color: #ffffff;
+    border-color: #424242;
+    color: white;
     background-color: #424242;
 }
 
 .k-picker-outline:focus, .k-picker-outline.k-focus {
-    border-color: #424242;
-    background-color: transparent;
     box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
-.k-picker-outline:focus:hover, .k-picker-outline:focus.k-hover, .k-picker-outline.k-focus:hover, .k-picker-outline.k-focus.k-hover {
-    color: #ffffff;
-    background-color: #424242;
+.k-picker-outline:focus-within {
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
 .k-picker-outline.k-invalid, .k-picker-outline.ng-invalid.ng-touched, .k-picker-outline.ng-invalid.ng-dirty {
@@ -14098,7 +14086,18 @@ textarea.k-input-inner {
 .k-input-flat {
     border-color: rgba(0, 0, 0, 0.08);
     color: #424242;
-    background-color: transparent;
+}
+
+.k-input-flat:hover, .k-input-flat.k-hover {
+    border-color: rgba(0, 0, 0, 0.16);
+}
+
+.k-input-flat:focus, .k-input-flat.k-focus {
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
+.k-input-flat:focus-within {
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
 .k-input-flat.k-invalid, .k-input-flat.ng-invalid.ng-touched, .k-input-flat.ng-invalid.ng-dirty {
@@ -14112,7 +14111,6 @@ textarea.k-input-inner {
 .k-picker-flat {
     border-color: rgba(0, 0, 0, 0.08);
     color: #424242;
-    background-color: transparent;
 }
 
 .k-picker-flat:hover, .k-picker-flat.k-hover {
@@ -14120,6 +14118,14 @@ textarea.k-input-inner {
     background-color: rgba(66, 66, 66, 0.04);
 }
 
+.k-picker-flat:focus, .k-picker-flat.k-focus {
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
+.k-picker-flat:focus-within {
+    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
+}
+
 .k-picker-flat.k-invalid, .k-picker-flat.ng-invalid.ng-touched, .k-picker-flat.ng-invalid.ng-dirty {
     border-color: #f31700;
 }
@@ -14650,6 +14656,7 @@ textarea.k-input-inner {
     width: 100%;
     height: 100%;
     object-fit: cover;
+    vertical-align: top;
 }
 
 .k-avatar-sm {
@@ -17765,6 +17772,16 @@ kendo-label > .k-label {
     flex: 0 0 1px;
 }
 
+.k-slider .k-slider-track-wrap .k-tick-horizontal {
+    width: 1px;
+    min-height: 100%;
+}
+
+.k-slider .k-slider-track-wrap .k-tick-vertical {
+    width: 100%;
+    min-height: 1px;
+}
+
 .k-slider .k-slider-track-wrap .k-draghandle {
     position: absolute;
 }
@@ -19318,6 +19335,9 @@ kendo-label > .k-label {
 }
 
 .k-colorgradient-inputs .k-input-inner {
+    padding-inline-start: 2px;
+    padding-inline-end: 2px;
+    text-align: center;
     text-overflow: clip;
 }
 
@@ -20183,6 +20203,7 @@ kendo-label > .k-label {
 
 .k-switch[dir="rtl"] .k-switch-thumb,
 [dir="rtl"] .k-switch .k-switch-thumb,
+.k-switch.k-rtl .k-switch-thumb,
 .k-rtl .k-switch .k-switch-thumb {
     transform: translate(50%, -50%);
 }
@@ -21931,6 +21952,7 @@ kendo-drawer .k-drawer-wrapper {
 
 .k-drawer {
     height: 100%;
+    max-width: 100%;
     border-width: 0;
     border-style: solid;
     box-sizing: border-box;
@@ -22075,6 +22097,33 @@ kendo-drawer .k-drawer-wrapper {
     padding: 0 8px;
     display: inline-block;
     white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.k-drawer-item .k-drawer-toggle {
+    margin-inline-start: auto;
+    cursor: pointer;
+}
+
+.k-drawer-item.k-level-1 {
+    padding-inline-start: 16px;
+}
+
+.k-drawer-item.k-level-2 {
+    padding-inline-start: 32px;
+}
+
+.k-drawer-item.k-level-3 {
+    padding-inline-start: 48px;
+}
+
+.k-drawer-item.k-level-4 {
+    padding-inline-start: 64px;
+}
+
+.k-drawer-item.k-level-5 {
+    padding-inline-start: 80px;
 }
 
 .k-drawer-separator {