@progress/kendo-theme-material 5.2.1-dev.2 → 5.2.1-dev.5

package/dist/all.css

@@ -13725,10 +13725,35 @@ kendo-badge-container {
     margin: 0;
 }
 
-.k-input:disabled, .k-input[disabled], .k-input.k-disabled,
-.k-picker:disabled,
-.k-picker[disabled],
-.k-picker.k-disabled {
+.k-input:-ms-input-placeholder, .k-picker:-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.54);
+    opacity: 1;
+    -ms-user-select: none;
+        user-select: none;
+}
+
+.k-input::placeholder,
+.k-picker::placeholder {
+    color: rgba(0, 0, 0, 0.54);
+    opacity: 1;
+    -webkit-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+}
+
+.k-input:-ms-input-placeholder,
+.k-picker:-ms-input-placeholder {
+    color: rgba(0, 0, 0, 0.54);
+}
+
+input.k-input,
+textarea.k-textarea {
+    padding: 8px 16px;
+}
+
+input.k-input:disabled, input.k-input[disabled],
+textarea.k-textarea:disabled,
+textarea.k-textarea[disabled] {
     outline: none;
     cursor: default;
     opacity: 0.6;
@@ -13737,30 +13762,25 @@ kendo-badge-container {
     box-shadow: none;
 }
 
-.k-input:disabled [disabled],
-.k-input:disabled .k-disabled,
-.k-input:disabled .k-state-disabled, .k-input[disabled] [disabled],
-.k-input[disabled] .k-disabled,
-.k-input[disabled] .k-state-disabled, .k-input.k-disabled [disabled],
-.k-input.k-disabled .k-disabled,
-.k-input.k-disabled .k-state-disabled,
-.k-picker:disabled [disabled],
-.k-picker:disabled .k-disabled,
-.k-picker:disabled .k-state-disabled,
-.k-picker[disabled] [disabled],
-.k-picker[disabled] .k-disabled,
-.k-picker[disabled] .k-state-disabled,
-.k-picker.k-disabled [disabled],
-.k-picker.k-disabled .k-disabled,
-.k-picker.k-disabled .k-state-disabled {
+[disabled] input.k-input:disabled,
+.k-disabled input.k-input:disabled,
+.k-state-disabled input.k-input:disabled, [disabled] input.k-input[disabled],
+.k-disabled input.k-input[disabled],
+.k-state-disabled input.k-input[disabled], [disabled]
+textarea.k-textarea:disabled,
+.k-disabled
+textarea.k-textarea:disabled,
+.k-state-disabled
+textarea.k-textarea:disabled, [disabled]
+textarea.k-textarea[disabled],
+.k-disabled
+textarea.k-textarea[disabled],
+.k-state-disabled
+textarea.k-textarea[disabled] {
     opacity: 1;
     filter: grayscale(0);
 }
 
-input.k-input {
-    padding: 8px 16px;
-}
-
 .k-picker {
     cursor: pointer;
 }
@@ -13771,6 +13791,24 @@ select.k-picker {
             appearance: auto;
 }
 
+select.k-picker:disabled, select.k-picker[disabled] {
+    outline: none;
+    cursor: default;
+    opacity: 0.6;
+    filter: grayscale(0.1);
+    pointer-events: none;
+    box-shadow: none;
+}
+
+[disabled] select.k-picker:disabled,
+.k-disabled select.k-picker:disabled,
+.k-state-disabled select.k-picker:disabled, [disabled] select.k-picker[disabled],
+.k-disabled select.k-picker[disabled],
+.k-state-disabled select.k-picker[disabled] {
+    opacity: 1;
+    filter: grayscale(0);
+}
+
 .k-input-inner {
     padding: 8px 16px;
     width: 100%;
@@ -14396,11 +14434,11 @@ textarea.k-input-inner {
     text-overflow: ellipsis;
     position: absolute;
     top: 29px;
+    left: 17px;
     overflow: hidden;
     cursor: text;
     transform-origin: left center;
     transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), color 0.15s cubic-bezier(0.4, 0, 0.2, 1), top 0.15s cubic-bezier(0.4, 0, 0.2, 1), left 0.15s cubic-bezier(0.4, 0, 0.2, 1);
-    pointer-events: none;
 }
 
 .k-floating-label-container > .k-widget {
@@ -14408,19 +14446,24 @@ textarea.k-input-inner {
     width: auto;
 }
 
-.k-floating-label-container.k-state-empty > .k-label {
+.k-floating-label-container.k-state-empty > .k-label, .k-floating-label-container.k-empty > .k-label {
     top: 29px;
+    left: 17px;
     transform: scale(1);
+    pointer-events: none;
 }
 
 .k-floating-label-container > .k-label,
-.k-floating-label-container.k-state-focused > .k-label {
+.k-floating-label-container.k-state-focused > .k-label,
+.k-floating-label-container.k-focus > .k-label {
     top: 0px;
+    left: 0px;
     transform: scale(0.75);
 }
 
 .k-floating-label-container:focus-within > .k-label {
     top: 0px;
+    left: 0px;
     transform: scale(0.75);
 }
 
@@ -14435,24 +14478,32 @@ textarea.k-input-inner {
 [dir="rtl"] .k-floating-label-container > .k-label,
 .k-rtl .k-floating-label-container > .k-label, .k-floating-label-container[dir="rtl"] > .k-label {
     transform-origin: right center;
+    transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), color 0.15s cubic-bezier(0.4, 0, 0.2, 1), top 0.15s cubic-bezier(0.4, 0, 0.2, 1), right 0.15s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-[dir="rtl"] .k-floating-label-container.k-state-empty > .k-label,
-.k-rtl .k-floating-label-container.k-state-empty > .k-label, .k-floating-label-container[dir="rtl"].k-state-empty > .k-label {
+[dir="rtl"] .k-floating-label-container.k-state-empty > .k-label, [dir="rtl"] .k-floating-label-container.k-empty > .k-label,
+.k-rtl .k-floating-label-container.k-state-empty > .k-label,
+.k-rtl .k-floating-label-container.k-empty > .k-label, .k-floating-label-container[dir="rtl"].k-state-empty > .k-label, .k-floating-label-container[dir="rtl"].k-empty > .k-label {
     left: auto;
+    right: 17px;
 }
 
 [dir="rtl"] .k-floating-label-container > .k-label,
 [dir="rtl"] .k-floating-label-container.k-state-focused > .k-label,
+[dir="rtl"] .k-floating-label-container.k-focus > .k-label,
 .k-rtl .k-floating-label-container > .k-label,
-.k-rtl .k-floating-label-container.k-state-focused > .k-label, .k-floating-label-container[dir="rtl"] > .k-label,
-.k-floating-label-container[dir="rtl"].k-state-focused > .k-label {
+.k-rtl .k-floating-label-container.k-state-focused > .k-label,
+.k-rtl .k-floating-label-container.k-focus > .k-label, .k-floating-label-container[dir="rtl"] > .k-label,
+.k-floating-label-container[dir="rtl"].k-state-focused > .k-label,
+.k-floating-label-container[dir="rtl"].k-focus > .k-label {
     left: auto;
+    right: 0px;
 }
 
-[dir="rtl"] .k-floating-label-container:focus-within,
-.k-rtl .k-floating-label-container:focus-within, .k-floating-label-container[dir="rtl"]:focus-within {
+[dir="rtl"] .k-floating-label-container:focus-within > .k-label,
+.k-rtl .k-floating-label-container:focus-within > .k-label, .k-floating-label-container[dir="rtl"]:focus-within > .k-label {
     left: auto;
+    right: 0px;
 }
 
 .k-floating-label-container > .k-label {
@@ -17041,6 +17092,7 @@ kendo-label > .k-label {
 .k-form-buttons {
     margin-top: 2em;
     padding: 0;
+    overflow: visible;
 }
 
 .k-form-hint,
@@ -20038,7 +20090,7 @@ kendo-label > .k-label {
 }
 
 .k-colorgradient-input-label {
-    color: rgba(0, 0, 0, 0.38);
+    color: rgba(0, 0, 0, 0.54);
 }
 
 .k-rtl .k-colorgradient .k-hue-slider.k-slider-horizontal .k-slider-track,
@@ -20204,283 +20256,8 @@ kendo-label > .k-label {
     overflow: hidden;
 }
 
-.k-dropdowngrid-popup .k-virtual-wrap {
-    margin: 0;
-}
-
-.k-dropdowngrid-popup .k-list-scroller {
-    overflow-x: hidden;
-}
-
-.k-grid-list {
-    margin: 0;
-    padding: 0;
-    width: 100%;
-    max-width: none;
+.k-dropdowngrid-popup > .k-data-table {
     border-width: 0;
-    border-collapse: collapse;
-    border-spacing: 0;
-    table-layout: fixed;
-    empty-cells: show;
-    outline: none;
-    display: table;
-    list-style: none;
-}
-
-.k-dropdowngrid-popup .k-grid-header {
-    border-width: 0 0 1px;
-    border-style: solid;
-    border-color: inherit;
-    font-size: 12px;
-    display: block;
-}
-
-.k-dropdowngrid-popup .k-grid-header-wrap {
-    border-width: 0 1px 0 0;
-    border-style: solid;
-    border-color: inherit;
-    vertical-align: top;
-    display: inline-block;
-    overflow: hidden;
-}
-
-.k-dropdowngrid-popup .k-grid-header table {
-    margin-bottom: -1px;
-    width: 100%;
-    max-width: none;
-    border-width: 0;
-    border-collapse: collapse;
-    border-spacing: 0;
-    table-layout: fixed;
-    empty-cells: show;
-    outline: none;
-}
-
-.k-dropdowngrid-popup .k-grid-header .k-header {
-    padding: 16px 24px;
-    border-width: 0 0 0 1px;
-    border-style: solid;
-    font-weight: normal;
-    text-align: left;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}
-
-.k-dropdowngrid-popup .k-grid-header .k-header:first-child {
-    border-left: 0;
-}
-
-.k-grid-list > .k-item {
-    box-sizing: border-box;
-    display: table-row;
-    position: relative;
-    cursor: pointer;
-}
-
-.k-grid-list > .k-item > .k-cell,
-.k-grid-list > .k-item > .k-group,
-.k-grid-list > .k-item > .k-spacer-group {
-    box-sizing: border-box;
-    display: table-cell;
-    vertical-align: middle;
-}
-
-.k-grid-list.k-virtual-list > .k-item > .k-cell,
-.k-grid-list.k-virtual-list > .k-item > .k-group,
-.k-grid-list.k-virtual-list > .k-item > .k-spacer-group {
-    display: inline-block;
-}
-
-.k-grid-list > .k-item:last-child > .k-cell,
-.k-grid-list > .k-item:last-child > .k-group-cell,
-.k-grid-list > .k-item:last-child > .k-spacer-cell {
-    border-bottom-width: 0;
-}
-
-.k-grid-list > .k-item > .k-cell {
-    padding: 10px 24px;
-    border-width: 0 0 1px 1px;
-    border-style: solid;
-    text-align: left;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}
-
-.k-grid-list > .k-item > .k-cell:first-child {
-    border-left: 0;
-}
-
-.k-dropdowngrid-popup .k-group-header,
-.k-dropdowngrid-popup .k-outer-group-header {
-    margin: 0;
-    padding: 16px 24px;
-    min-height: auto;
-    font-size: inherit;
-    text-align: left;
-    font-weight: bold;
-}
-
-.k-grid-list > .k-item.k-first {
-    border-top: 1px solid currentColor;
-}
-
-.k-grid-list > .k-item > .k-group-cell,
-.k-grid-list > .k-item > .k-spacer-cell {
-    padding: 0;
-    width: 0;
-    border-left-width: 0;
-    border-right-width: 0;
-    overflow: visible;
-    position: relative;
-}
-
-.k-grid-list > .k-item > .k-group-cell > span {
-    padding: 0 12px;
-    font-size: .75em;
-    position: absolute;
-    top: 0;
-    right: 0;
-}
-
-.k-grid-list > .k-outer-group-header {
-    height: 60px;
-    display: table-row;
-    position: relative;
-}
-
-.k-grid-list > .k-outer-group-header > strong {
-    padding: 16px 24px;
-    width: 100%;
-    box-sizing: border-box;
-    position: absolute;
-    left: 0;
-}
-
-.k-dropdowngrid-popup .k-footer {
-    padding: 16px 24px;
-    border-width: 1px 0 0;
-    border-style: solid;
-    text-align: left;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    position: relative;
-    flex-shrink: 0;
-}
-
-.k-rtl.k-dropdowngrid-popup .k-grid-header-wrap,
-.k-rtl .k-dropdowngrid-popup .k-grid-header-wrap,
-[dir="rtl"].k-dropdowngrid-popup .k-grid-header-wrap,
-[dir="rtl"] .k-dropdowngrid-popup .k-grid-header-wrap {
-    border-right-width: 0;
-    border-left-width: 1px;
-}
-
-.k-rtl.k-dropdowngrid-popup .k-grid-header .k-header,
-.k-rtl .k-dropdowngrid-popup .k-grid-header .k-header,
-.k-rtl .k-grid-list > .k-item > .k-cell,
-[dir="rtl"].k-dropdowngrid-popup .k-grid-header .k-header,
-[dir="rtl"] .k-dropdowngrid-popup .k-grid-header .k-header,
-[dir="rtl"] .k-grid-list > .k-item > .k-cell {
-    border-left-width: 0;
-    border-right-width: 1px;
-    text-align: right;
-}
-
-.k-rtl.k-dropdowngrid-popup .k-grid-header .k-header:first-child,
-.k-rtl .k-dropdowngrid-popup .k-grid-header .k-header:first-child,
-.k-rtl .k-grid-list > .k-item > .k-cell:first-child,
-[dir="rtl"].k-dropdowngrid-popup .k-grid-header .k-header:first-child,
-[dir="rtl"] .k-dropdowngrid-popup .k-grid-header .k-header:first-child,
-[dir="rtl"] .k-grid-list > .k-item > .k-cell:first-child {
-    border-right-width: 0;
-}
-
-.k-rtl div.k-dropdowngrid-popup .k-group-header,
-.k-rtl div.k-dropdowngrid-popup .k-outer-group-header,
-[dir="rtl"] div.k-dropdowngrid-popup .k-group-header,
-[dir="rtl"] div.k-dropdowngrid-popup .k-outer-group-header {
-    text-align: right;
-}
-
-.k-rtl .k-grid-list > .k-item > .k-group-cell > span,
-[dir="rtl"] .k-grid-list > .k-item > .k-group-cell > span {
-    right: auto;
-    left: 0;
-}
-
-.k-rtl .k-grid-list > .k-outer-group-header > strong,
-[dir="rtl"] .k-grid-list > .k-outer-group-header > strong {
-    left: auto;
-    right: 0;
-}
-
-.k-dropdowngrid-popup {
-    border-color: rgba(0, 0, 0, 0.12);
-    color: rgba(0, 0, 0, 0.87);
-    background-color: white;
-}
-
-.k-dropdowngrid-popup .k-header,
-.k-dropdowngrid-popup .k-grid-header {
-    border-color: rgba(0, 0, 0, 0.12);
-    color: rgba(0, 0, 0, 0.54);
-    background-color: white;
-}
-
-.k-dropdowngrid-popup .k-footer {
-    border-color: rgba(0, 0, 0, 0.12);
-    color: rgba(0, 0, 0, 0.54);
-    background-color: white;
-}
-
-.k-dropdowngrid-popup .k-group-header,
-.k-dropdowngrid-popup .k-outer-group-header {
-    border-color: rgba(0, 0, 0, 0.12);
-    color: rgba(0, 0, 0, 0.54);
-    background-color: white;
-}
-
-.k-grid-list > .k-group-header,
-.k-grid-list > .k-outer-group-header {
-    background: none;
-    box-shadow: none;
-}
-
-.k-grid-list > .k-item:nth-child(2n) {
-    background-color: transparent;
-}
-
-.k-grid-list > .k-outer-group-header:nth-child(2n) > strong {
-    background-color: transparent;
-}
-
-.k-dropdowngrid-popup .k-cell {
-    border-color: rgba(0, 0, 0, 0.12);
-}
-
-.k-dropdowngrid-popup .k-item.k-state-hover,
-.k-dropdowngrid-popup .k-item:hover {
-    border-color: rgba(0, 0, 0, 0.12);
-    background-color: rgba(0, 0, 0, 0.07);
-}
-
-.k-dropdowngrid-popup .k-item.k-state-selected {
-    border-color: rgba(0, 0, 0, 0.12);
-    background-color: rgba(0, 0, 0, 0.04);
-}
-
-.k-dropdowngrid-popup .k-group-cell span {
-    background-color: rgba(0, 0, 0, 0.87);
-    color: white;
-}
-
-.k-grid-list > .k-item.k-last > .k-cell,
-.k-grid-list > .k-item.k-last > .k-group-cell,
-.k-grid-list > .k-item.k-last > .k-spacer-cell {
-    border-bottom-color: rgba(0, 0, 0, 0.87);
 }
 
 .k-dropdown-operator {
@@ -21194,7 +20971,7 @@ kendo-label > .k-label {
 }
 
 .k-dropzone-inner .k-dropzone-note {
-    color: rgba(97, 97, 97, 0.9116);
+    color: rgba(0, 0, 0, 0.54);
 }
 
 .k-external-dropzone-hover .k-icon,
@@ -22514,7 +22291,6 @@ kendo-label > .k-label {
 
 .k-actionsheet-item-description {
     font-size: 0.875em;
-    opacity: 0.75;
 }
 
 .k-actionsheet > .k-hr {
@@ -22577,6 +22353,10 @@ kendo-label > .k-label {
     box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
 }
 
+.k-actionsheet-item-description {
+    color: rgba(0, 0, 0, 0.54);
+}
+
 .k-actionsheet-action:hover, .k-actionsheet-action.k-state-hover {
     background-color: rgba(0, 0, 0, 0.04);
 }
@@ -25627,7 +25407,7 @@ kendo-card-footer {
 }
 
 .k-expander-sub-title {
-    opacity: 0.62;
+    color: rgba(0, 0, 0, 0.54);
 }
 
 .k-panelbar {
@@ -27451,7 +27231,7 @@ div.k-grid-footer {
     cursor: pointer;
 }
 
-.k-grid-header .k-header > .k-link > .k-icon.k-i-sort-desc-sm, .k-grid-header .k-header > .k-link > .k-icon.k-i-sort-asc-sm {
+.k-grid-header .k-cell-inner > .k-link > .k-icon.k-i-sort-desc-sm, .k-grid-header .k-cell-inner > .k-link > .k-icon.k-i-sort-asc-sm {
     vertical-align: text-top;
     margin-left: 4px;
 }
@@ -27876,6 +27656,7 @@ div.k-grid-norecords {
     display: flex;
     flex-flow: row nowrap;
     align-items: center;
+    justify-content: inherit;
     overflow: hidden;
 }
 
@@ -27885,6 +27666,7 @@ div.k-grid-norecords {
     display: flex;
     flex-flow: row nowrap;
     align-items: center;
+    justify-content: inherit;
     flex: 1;
     overflow: hidden;
 }
@@ -31756,7 +31538,7 @@ thead.k-grid-header > tr:not(:only-child) > th {
 }
 
 .k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-state-hover {
-    color: #37458e;
+    color: #303f9f;
 }
 
 .k-taskboard-card:focus, .k-taskboard-card.k-state-focus {