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

package/dist/all.css

@@ -13731,20 +13731,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: 0.25rem 0.25rem 0px 0px !important;
 }
 
-.k-input-outline,
-.k-picker-outline {
+.k-input-flat:focus-within,
+.k-picker-flat:focus-within {
+    border-radius: 0.25rem 0.25rem 0px 0px !important;
+}
+
+.k-input-outline {
     background: none !important;
 }
 
+.k-picker.k-picker-flat {
+    border-radius: 0.25rem 0.25rem 0px 0px !important;
+}
+
 .k-input-sm,
 .k-picker-sm {
     font-size: 1rem;
@@ -14016,10 +14024,14 @@ textarea.k-input-inner {
 }
 
 .k-picker:focus, .k-picker.k-focus {
+    border-color: #bfc6d0;
+    background-color: #c7cdd5;
     box-shadow: 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
 }
 
 .k-picker:focus-within {
+    border-color: #bfc6d0;
+    background-color: #c7cdd5;
     box-shadow: 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
 }
 
@@ -14039,6 +14051,139 @@ textarea.k-input-inner {
     box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
 }
 
+.k-input-outline {
+    border-color: rgba(33, 37, 41, 0.5);
+    color: #212529;
+}
+
+.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.k-invalid, .k-input-outline.ng-invalid.ng-touched, .k-input-outline.ng-invalid.ng-dirty {
+    border-color: #dc3545;
+}
+
+.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: #dc3545;
+}
+
+.k-input-outline.k-invalid:focus, .k-input-outline.k-invalid.k-focus, .k-input-outline.ng-invalid.ng-touched:focus, .k-input-outline.ng-invalid.ng-touched.k-focus, .k-input-outline.ng-invalid.ng-dirty:focus, .k-input-outline.ng-invalid.ng-dirty.k-focus {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-input-outline.k-invalid:focus-within, .k-input-outline.ng-invalid.ng-touched:focus-within, .k-input-outline.ng-invalid.ng-dirty:focus-within {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-picker-outline {
+    border-color: #212529;
+    color: #212529;
+    background-color: transparent;
+}
+
+.k-picker-outline:hover, .k-picker-outline.k-hover {
+    border-color: #212529;
+    color: #ffffff;
+    background-color: #212529;
+}
+
+.k-picker-outline:focus, .k-picker-outline.k-focus {
+    border-color: #212529;
+    color: #212529;
+    background-color: transparent;
+    box-shadow: 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
+}
+
+.k-picker-outline:focus:hover, .k-picker-outline:focus.k-hover, .k-picker-outline.k-focus:hover, .k-picker-outline.k-focus.k-hover {
+    border-color: #212529;
+    color: #ffffff;
+    background-color: #212529;
+}
+
+.k-picker-outline.k-invalid, .k-picker-outline.ng-invalid.ng-touched, .k-picker-outline.ng-invalid.ng-dirty {
+    border-color: #dc3545;
+}
+
+.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: #dc3545;
+}
+
+.k-picker-outline.k-invalid:focus, .k-picker-outline.k-invalid.k-focus, .k-picker-outline.ng-invalid.ng-touched:focus, .k-picker-outline.ng-invalid.ng-touched.k-focus, .k-picker-outline.ng-invalid.ng-dirty:focus, .k-picker-outline.ng-invalid.ng-dirty.k-focus {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-picker-outline.k-invalid:focus-within, .k-picker-outline.ng-invalid.ng-touched:focus-within, .k-picker-outline.ng-invalid.ng-dirty:focus-within {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-input-flat {
+    background-color: transparent;
+}
+
+.k-input-flat:focus, .k-input-flat.k-focus {
+    border-color: #0d6efd;
+}
+
+.k-input-flat.k-invalid, .k-input-flat.ng-invalid.ng-touched, .k-input-flat.ng-invalid.ng-dirty {
+    border-color: #dc3545;
+}
+
+.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: #dc3545;
+}
+
+.k-input-flat.k-invalid:focus, .k-input-flat.k-invalid.k-focus, .k-input-flat.ng-invalid.ng-touched:focus, .k-input-flat.ng-invalid.ng-touched.k-focus, .k-input-flat.ng-invalid.ng-dirty:focus, .k-input-flat.ng-invalid.ng-dirty.k-focus {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-input-flat.k-invalid:focus-within, .k-input-flat.ng-invalid.ng-touched:focus-within, .k-input-flat.ng-invalid.ng-dirty:focus-within {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-picker-flat {
+    background-color: transparent;
+}
+
+.k-picker-flat:hover, .k-picker-flat.k-hover {
+    background-color: rgba(33, 37, 41, 0.08);
+}
+
+.k-picker-flat:focus, .k-picker-flat.k-focus {
+    border-color: #bfc6d0;
+    background-color: transparent;
+    box-shadow: 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
+}
+
+.k-picker-flat:focus:hover, .k-picker-flat:focus.k-hover, .k-picker-flat.k-focus:hover, .k-picker-flat.k-focus.k-hover {
+    background-color: rgba(33, 37, 41, 0.08);
+}
+
+.k-picker-flat.k-invalid, .k-picker-flat.ng-invalid.ng-touched, .k-picker-flat.ng-invalid.ng-dirty {
+    border-color: #dc3545;
+}
+
+.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: #dc3545;
+}
+
+.k-picker-flat.k-invalid:focus, .k-picker-flat.k-invalid.k-focus, .k-picker-flat.ng-invalid.ng-touched:focus, .k-picker-flat.ng-invalid.ng-touched.k-focus, .k-picker-flat.ng-invalid.ng-dirty:focus, .k-picker-flat.ng-invalid.ng-dirty.k-focus {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.k-picker-flat.k-invalid:focus-within, .k-picker-flat.ng-invalid.ng-touched:focus-within, .k-picker-flat.ng-invalid.ng-dirty:focus-within {
+    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
 .k-floating-label-container {
     padding-top: 1.5rem;
     box-sizing: border-box;
@@ -16033,9 +16178,10 @@ textarea.k-input-inner {
     background-color: #0d6efd;
 }
 
-.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 0 3px rgba(33, 37, 41, 0.15);
 }
 
@@ -18613,7 +18759,7 @@ kendo-label > .k-label {
     color: #0d6efd;
 }
 
-.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: #0a58ca;
 }
 
@@ -18628,7 +18774,8 @@ kendo-label > .k-label {
     box-shadow: inset 0 0 0 1px #0d6efd;
 }
 
-.k-calendar .k-calendar-view .k-today.k-state-focused .k-link {
+.k-calendar .k-calendar-view .k-today.k-state-focused .k-link,
+.k-calendar .k-calendar-view .k-today.k-focus .k-link {
     box-shadow: inset 0 0 0 1px #0d6efd, inset 0 0 0 0.25rem rgba(228, 231, 235, 0.5);
 }
 
@@ -18647,32 +18794,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: #d6d9dc;
     color: #212529;
     background-color: #e9ecef;
 }
 
-.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: #0c65e9;
     color: white;
     background-color: #0d6efd;
 }
 
 .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: #e4e5e6;
     color: white;
     background-color: #0c6af3;
 }
 
 .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 0.25rem rgba(228, 231, 235, 0.5);
 }
 
 .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(2, 82, 201, 0.5);
 }
 
@@ -18683,7 +18837,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: #0a58ca;
 }
 
@@ -18731,7 +18886,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);
 }
 
@@ -22626,7 +22782,11 @@ 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 {
+    box-shadow: 0 0 0 3px rgba(222, 226, 230, 0.5);
+}
+
+.k-card.k-selected, .k-card.k-state-selected {
     box-shadow: 0 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
@@ -22755,7 +22915,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 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
@@ -22765,21 +22925,25 @@ kendo-card-footer {
 }
 
 .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: 0 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
 .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: 0 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
 .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: 3px -3px 0 0 rgba(222, 226, 230, 0.5);
 }
 
 .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: 0 0 0 3px rgba(222, 226, 230, 0.5);
 }
@@ -25217,6 +25381,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 0 0 3px rgba(222, 226, 230, 0.5);
@@ -26984,6 +27149,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;
@@ -30244,7 +30410,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;
 }
 
@@ -30316,29 +30482,29 @@ kendo-grid tr.k-state-hover .k-grid-content-sticky.k-state-selected {
     color: #0d6efd;
 }
 
-.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: #0b5cd5;
 }
 
-.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: #0b5cd5;
 }
 
-.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: #b6b9bd;
     box-shadow: 0 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
-.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: #c8cbcf;
 }
 
-.k-taskboard-card.k-state-selected {
+.k-taskboard-card.k-selected, .k-taskboard-card.k-state-selected {
     border-color: #b6d3fe;
     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.65;
@@ -31976,15 +32142,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;
 }
@@ -33353,6 +33524,11 @@ kendo-scheduler .k-event .k-event-actions,
     font-size: 0.875rem;
 }
 
+kendo-scheduler .k-event .k-event-actions:first-child,
+.k-event .k-event-actions:first-child {
+    margin: 0.1ex 0.4ex 0 0.5rem;
+}
+
 .k-scheduler {
     border-color: #dee2e6;
     color: #212529;
@@ -36134,7 +36310,7 @@ kendo-scrollview.k-scrollview-wrap.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 0 0 3px rgba(222, 226, 230, 0.5);
 }
 
@@ -36145,6 +36321,7 @@ kendo-scrollview.k-scrollview-wrap.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 0 0 3px rgba(222, 226, 230, 0.5);