@progress/kendo-theme-classic 5.3.2-dev.1 → 5.3.2-dev.4

package/dist/all.css

@@ -11160,7 +11160,7 @@ kendo-sortable {
 }
 
 .k-checkbox.k-invalid {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .k-checkbox.k-invalid + .k-checkbox-label {
@@ -13653,7 +13653,7 @@ textarea.k-input-inner {
 .k-input-button {
     width: auto;
     border-width: 0;
-    border-inline-start-width: 0px;
+    border-inline-start-width: 1px;
     flex: none;
     aspect-ratio: auto;
     box-shadow: none;
@@ -13683,7 +13683,7 @@ textarea.k-input-inner {
 .k-input-spinner .k-spinner-increase,
 .k-input-spinner .k-spinner-decrease {
     border-width: 0;
-    border-inline-start-width: 0px;
+    border-inline-start-width: 1px;
     flex: 1 1 50%;
     box-shadow: none;
     position: relative;
@@ -13732,20 +13732,28 @@ textarea.k-input-inner {
     border-radius: 0 !important;
     border-width: 1px 0;
     border-top-color: transparent !important;
-    background: none !important;
+    background-image: none !important;
 }
 
-.k-input-flat .k-input-inner,
-.k-picker-flat .k-input-inner {
-    padding-left: 0 !important;
-    padding-right: 0 !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-outline,
-.k-picker-outline {
+.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;
@@ -13986,7 +13994,7 @@ textarea.k-input-inner {
 }
 
 .k-input.k-invalid, .k-input.ng-invalid.ng-touched, .k-input.ng-invalid.ng-dirty {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .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 {
@@ -14014,13 +14022,104 @@ textarea.k-input-inner {
 }
 
 .k-picker.k-invalid, .k-picker.ng-invalid.ng-touched, .k-picker.ng-invalid.ng-dirty {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .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 {
     color: #d92800;
 }
 
+.k-input-outline {
+    border-color: rgba(39, 39, 39, 0.5);
+}
+
+.k-input-outline > .k-input-button {
+    border-color: inherit;
+}
+
+.k-input-outline > .k-input-spinner {
+    border-color: inherit;
+}
+
+.k-input-outline > .k-input-spinner > .k-spinner-increase,
+.k-input-outline > .k-input-spinner > .k-spinner-decrease {
+    border-color: inherit;
+}
+
+.k-input-outline:hover, .k-input-outline.k-hover {
+    border-color: rgba(39, 39, 39, 0.8);
+}
+
+.k-input-outline.k-invalid, .k-input-outline.ng-invalid.ng-touched, .k-input-outline.ng-invalid.ng-dirty {
+    border-color: #d92800;
+}
+
+.k-input-outline.k-invalid .k-input-validation-icon, .k-input-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-input-outline.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #d92800;
+}
+
+.k-picker-outline {
+    border-color: #272727;
+    background-color: transparent;
+}
+
+.k-picker-outline:hover, .k-picker-outline.k-hover {
+    color: #ffffff;
+    background-color: #272727;
+}
+
+.k-picker-outline:focus, .k-picker-outline.k-focus {
+    border-color: #272727;
+    background-color: transparent;
+    box-shadow: 0 0 4px 0 rgba(202, 202, 202, 0.75);
+}
+
+.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: #272727;
+}
+
+.k-picker-outline.k-invalid, .k-picker-outline.ng-invalid.ng-touched, .k-picker-outline.ng-invalid.ng-dirty {
+    border-color: #d92800;
+}
+
+.k-picker-outline.k-invalid .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-outline.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #d92800;
+}
+
+.k-input-flat {
+    border-color: #cacaca;
+    color: #272727;
+    background-color: transparent;
+}
+
+.k-input-flat.k-invalid, .k-input-flat.ng-invalid.ng-touched, .k-input-flat.ng-invalid.ng-dirty {
+    border-color: #d92800;
+}
+
+.k-input-flat.k-invalid .k-input-validation-icon, .k-input-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-input-flat.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #d92800;
+}
+
+.k-picker-flat {
+    border-color: #cacaca;
+    color: #272727;
+    background-color: transparent;
+}
+
+.k-picker-flat:hover, .k-picker-flat.k-hover {
+    border-color: rgba(202, 202, 202, 0.16);
+    background-color: rgba(39, 39, 39, 0.04);
+}
+
+.k-picker-flat.k-invalid, .k-picker-flat.ng-invalid.ng-touched, .k-picker-flat.ng-invalid.ng-dirty {
+    border-color: #d92800;
+}
+
+.k-picker-flat.k-invalid .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-touched .k-input-validation-icon, .k-picker-flat.ng-invalid.ng-dirty .k-input-validation-icon {
+    color: #d92800;
+}
+
 .k-floating-label-container {
     padding-top: 20.0000000004px;
     box-sizing: border-box;
@@ -15982,9 +16081,10 @@ textarea.k-input-inner {
     background-color: #f35800;
 }
 
-.k-menu-group .k-item:focus, .k-menu-group .k-item.k-focus,
-.k-menu.k-context-menu .k-item:focus,
-.k-menu.k-context-menu .k-item.k-focus {
+.k-menu-group .k-item:focus > .k-link,
+.k-menu-group .k-item.k-focus > .k-link,
+.k-menu.k-context-menu .k-item:focus > .k-link,
+.k-menu.k-context-menu .k-item.k-focus > .k-link {
     box-shadow: inset 0 0 3px 1px rgba(39, 39, 39, 0.25);
 }
 
@@ -17505,7 +17605,7 @@ kendo-label > .k-label {
 .k-radio.k-state-invalid,
 .k-radio.ng-invalid.ng-touched,
 .k-radio.ng-invalid.ng-dirty {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .k-radio.k-invalid + .k-radio-label,
@@ -18532,7 +18632,7 @@ kendo-label > .k-label {
     color: #f35800;
 }
 
-.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-state-focus {
+.k-calendar .k-nav-today:hover, .k-calendar .k-nav-today.k-hover, .k-calendar .k-nav-today.k-state-hover, .k-calendar .k-nav-today:focus, .k-calendar .k-nav-today.k-state-focus, .k-calendar .k-nav-today.k-focus {
     color: #cc4a00;
 }
 
@@ -18558,32 +18658,39 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-calendar-td:hover .k-link,
-.k-calendar .k-calendar-td.k-state-hover .k-link {
+.k-calendar .k-calendar-td.k-state-hover .k-link,
+.k-calendar .k-calendar-td.k-hover .k-link {
     border-color: #bababa;
     color: #272727;
     background-color: #dddddd;
 }
 
-.k-calendar .k-calendar-td.k-state-selected .k-link {
+.k-calendar .k-calendar-td.k-state-selected .k-link,
+.k-calendar .k-calendar-td.k-selected .k-link {
     border-color: #cc4a00;
     color: white;
     background-color: #f35800;
 }
 
 .k-calendar .k-calendar-td.k-state-selected:hover .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-hover .k-link {
+.k-calendar .k-calendar-td.k-state-selected.k-state-hover .k-link,
+.k-calendar .k-calendar-td.k-selected:hover .k-link,
+.k-calendar .k-calendar-td.k-selected.k-hover .k-link {
     border-color: #cc4a00;
     color: white;
     background-color: #e05100;
 }
 
 .k-calendar .k-calendar-td.k-state-focused .k-link,
-.k-calendar .k-calendar-td.k-state-focus .k-link {
+.k-calendar .k-calendar-td.k-state-focus .k-link,
+.k-calendar .k-calendar-td.k-focus .k-link {
     box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
 .k-calendar .k-calendar-td.k-state-selected.k-state-focused .k-link,
-.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link {
+.k-calendar .k-calendar-td.k-state-selected.k-state-focus .k-link,
+.k-calendar .k-calendar-td.k-selected:focus .k-link,
+.k-calendar .k-calendar-td.k-selected.k-focus .k-link {
     box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.08);
 }
 
@@ -18594,7 +18701,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-calendar-navigation li:hover,
-.k-calendar .k-calendar-navigation li.k-state-hover {
+.k-calendar .k-calendar-navigation li.k-state-hover,
+.k-calendar .k-calendar-navigation li.k-hover {
     color: #cc4a00;
 }
 
@@ -18610,7 +18718,7 @@ kendo-label > .k-label {
 }
 
 .k-calendar.k-invalid, .k-calendar.k-invalid:hover, .k-calendar.k-state-invalid, .k-calendar.ng-invalid.ng-touched, .k-calendar.ng-invalid.ng-dirty {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .k-scheduler .k-calendar .k-other-month {
@@ -18642,7 +18750,8 @@ kendo-label > .k-label {
 }
 
 .k-calendar .k-range-start.k-state-active .k-link,
-.k-calendar .k-range-end.k-state-active .k-link {
+.k-calendar .k-range-end.k-state-active .k-link,
+.k-calendar .k-range-end.k-active .k-link {
     box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.2);
 }
 
@@ -20658,7 +20767,7 @@ kendo-label > .k-label {
 }
 
 .k-upload.k-state-invalid, .k-upload.ng-invalid.ng-touched, .k-upload.ng-invalid.ng-dirty {
-    border-color: rgba(217, 40, 0, 0.5);
+    border-color: #d92800;
 }
 
 .k-appbar {
@@ -22527,11 +22636,15 @@ kendo-card-footer {
     background-color: #ffffff;
 }
 
-.k-card:focus, .k-card.k-state-focus {
+.k-card:focus, .k-card.k-focus, .k-card.k-state-focus {
     border-color: rgba(0, 0, 0, 0.15);
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
+.k-card.k-selected, .k-card.k-state-selected {
+    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
+}
+
 .k-card-actions {
     border-color: #cacaca;
 }
@@ -22655,7 +22768,7 @@ kendo-card-footer {
     color: inherit;
 }
 
-.k-card-wrap.k-state-focused > .k-card, .k-card-wrap.k-state-selected > .k-card {
+.k-card-wrap.k-state-focused > .k-card, .k-card-wrap.k-focus > .k-card, .k-card-wrap:focus > .k-card, .k-card-wrap.k-state-selected > .k-card, .k-card-wrap.k-selected > .k-card {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
@@ -22665,26 +22778,31 @@ kendo-card-footer {
 }
 
 .k-card:focus .k-card-callout,
+.k-card.k-focus .k-card-callout,
 .k-card.k-state-focus .k-card-callout {
     border-color: rgba(0, 0, 0, 0.15);
 }
 
 .k-card:focus .k-card-callout.k-callout-n,
+.k-card.k-focus .k-card-callout.k-callout-n,
 .k-card.k-state-focus .k-card-callout.k-callout-n {
     box-shadow: 1px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-e,
+.k-card.k-focus .k-card-callout.k-callout-e,
 .k-card.k-state-focus .k-card-callout.k-callout-e {
     box-shadow: 2px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-s,
+.k-card.k-focus .k-card-callout.k-callout-s,
 .k-card.k-state-focus .k-card-callout.k-callout-s {
     box-shadow: 2px -2px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
 .k-card:focus .k-card-callout.k-callout-w,
+.k-card.k-focus .k-card-callout.k-callout-w,
 .k-card.k-state-focus .k-card-callout.k-callout-w {
     box-shadow: 2px -1px 4px 0 rgba(0, 0, 0, 0.06);
 }
@@ -25016,6 +25134,7 @@ kendo-card-footer {
 }
 
 .k-tilelayout-item:focus,
+.k-tilelayout-item.k-focus,
 .k-tilelayout-item.k-state-focus,
 .k-tilelayout-item.k-state-focused {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
@@ -26783,6 +26902,7 @@ div.k-grid-norecords {
 .k-filter-menu-container kendo-numeric-filter-menu,
 .k-filter-menu-container kendo-grid-string-filter-menu,
 .k-filter-menu-container kendo-grid-date-filter-menu,
+.k-filter-menu-container kendo-grid-numeric-filter-menu,
 .k-filter-menu-container kendo-grid-filter-menu-input-wrapper {
     display: flex;
     flex-flow: column nowrap;
@@ -30019,7 +30139,7 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
     overflow-wrap: anywhere;
 }
 
-.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-state-focus, .k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-state-hover {
+.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-focus, .k-taskboard-card .k-card-title.k-state-focus, .k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-hover, .k-taskboard-card .k-card-title.k-state-hover {
     text-decoration: underline;
 }
 
@@ -30091,29 +30211,29 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
     color: #f35800;
 }
 
-.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-state-focus {
+.k-taskboard-card .k-card-title:focus, .k-taskboard-card .k-card-title.k-focus, .k-taskboard-card .k-card-title.k-state-focus {
     color: #cc4a00;
 }
 
-.k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-state-hover {
+.k-taskboard-card .k-card-title:hover, .k-taskboard-card .k-card-title.k-hover, .k-taskboard-card .k-card-title.k-state-hover {
     color: #cc4a00;
 }
 
-.k-taskboard-card:focus, .k-taskboard-card.k-state-focus {
+.k-taskboard-card:focus, .k-taskboard-card.k-focus, .k-taskboard-card.k-state-focus {
     border-color: #a6a6a6;
     box-shadow: none;
 }
 
-.k-taskboard-card:hover, .k-taskboard-card.k-state-hover {
+.k-taskboard-card:hover, .k-taskboard-card.k-hover, .k-taskboard-card.k-state-hover {
     border-color: #b6b6b6;
 }
 
-.k-taskboard-card.k-state-selected {
+.k-taskboard-card.k-selected, .k-taskboard-card.k-state-selected {
     border-color: #f9ab7f;
     box-shadow: none;
 }
 
-.k-taskboard-card.k-state-disabled {
+.k-taskboard-card.k-disabled, .k-taskboard-card.k-state-disabled {
     outline: none;
     cursor: default;
     opacity: 0.6;
@@ -31752,15 +31872,20 @@ kendo-editor.k-readonly .k-editor-content.k-state-focused {
 
 .k-gantt-tooltip-validation-label {
     display: inline-flex;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+    min-width: 50px;
 }
 
 .k-gantt-tooltip-validation-value {
     font-weight: 700;
 }
 
+.k-gantt-tooltip-validation-label,
+.k-gantt-tooltip-validation-value {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
 .k-pdf-export-shadow .k-gantt {
     float: left;
 }
@@ -35897,7 +36022,7 @@ div.k-scrollview.k-scrollview-light .k-scrollview-nav-wrap {
     border-color: transparent;
 }
 
-.k-orgchart-card:focus, .k-orgchart-card.k-state-focus {
+.k-orgchart-card:focus, .k-orgchart-card.k-focus, .k-orgchart-card.k-state-focus {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);
 }
 
@@ -35908,6 +36033,7 @@ div.k-scrollview.k-scrollview-light .k-scrollview-nav-wrap {
 }
 
 .k-orgchart-node-group-container:focus,
+.k-orgchart-node-group-container.k-focus,
 .k-orgchart-node-group-container.k-state-focus,
 .k-orgchart-node-group-container.k-state-focused {
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06);