@progress/kendo-theme-default 5.12.1-dev.3 → 5.12.1-dev.4

package/scss/colorgradient/_layout.scss

@@ -169,8 +169,9 @@
             }
 
             // Needed for the double check icons
-            .k-icon + .k-icon {
-                margin-left: -13px;
+            .k-icon + .k-icon,
+            .k-icon-wrapper-host + .k-icon-wrapper-host .k-icon {
+                margin-inline-start: -13px;
             }
         }
     }
@@ -184,16 +185,3 @@
 
 }
 
-@include exports( "colorgradient/layout/rtl" ) {
-
-    .k-rtl,
-    [dir="rtl"] {
-
-        .k-colorgradient-color-contrast .k-i-check + .k-i-check {
-            margin-left: 0;
-            margin-right: -13px;
-        }
-
-    }
-
-}

package/scss/grid/_layout.scss

@@ -66,6 +66,7 @@
         }
 
         .k-table-th,
+        td,
         .k-table-td {
             border-width: 0;
             border-inline-start-width: $kendo-grid-cell-vertical-border-width;
@@ -104,6 +105,7 @@
             white-space: nowrap;
         }
 
+        td,
         .k-table-td {
             border-block-end-width: $kendo-grid-cell-horizontal-border-width;
             white-space: unset;
@@ -260,12 +262,17 @@
             align-items: center;
             align-content: center;
         }
+
+        .k-grouping-row td,
         .k-grouping-row .k-table-td {
             overflow: visible;
         }
+
+        .k-grouping-row + .k-table-row td,
         .k-grouping-row + .k-table-row .k-table-td {
             border-top-width: $kendo-grid-grouping-row-border-top;
         }
+
         .k-grouping-row .k-group-cell,
         .k-grouping-row + .k-table-row .k-group-cell {
             border-top-width: 0;
@@ -278,11 +285,13 @@
             text-decoration: none;
         }
 
+        .k-table .k-group-footer td,
         .k-table .k-group-footer .k-table-td {
             border-style: solid;
             border-width: $kendo-grid-group-footer-border-y 0;
         }
 
+        .k-group-footer .k-group-cell + td,
         .k-group-footer .k-group-cell + .k-table-td {
             border-inline-start-width: $kendo-grid-cell-vertical-border-width;
         }
@@ -487,11 +496,15 @@
     .k-grid-footer {
         border-top-width: 1px;
 
+        td,
         .k-table-td {
             height: $kendo-line-height-em;
         }
     }
 
+    .k-grid-footer td,
+    .k-group-footer td,
+    .k-grouping-row td,
     .k-grid-footer .k-table-td,
     .k-group-footer .k-table-td,
     .k-grouping-row .k-table-td {
@@ -514,6 +527,7 @@
     .k-filter-row {
         line-height: $kendo-form-line-height;
 
+        td,
         .k-table-td,
         .k-table-th {
             border-width: 0;
@@ -522,6 +536,7 @@
             white-space: nowrap;
         }
 
+        td:first-child,
         .k-table-td:first-child {
             border-inline-start-width: 0;
         }
@@ -568,6 +583,7 @@
         border-color: inherit;
         outline: 0;
 
+        .k-table-row:last-child > td,
         .k-table-row:last-child > .k-table-td {
             border-bottom-width: 0;
         }
@@ -593,11 +609,13 @@
     // Edit row
     .k-grid .k-edit-cell,
     .k-grid .k-command-cell,
+    .k-grid .k-grid-edit-row td,
     .k-grid .k-grid-edit-row .k-table-td {
         text-overflow: clip;
     }
 
     .k-grid .k-edit-cell,
+    .k-grid .k-grid-edit-row td,
     .k-grid .k-grid-edit-row .k-table-td {
 
         > input:not([type="checkbox"]):not([type="radio"]),
@@ -654,19 +672,19 @@
 
     .k-grid-virtual .k-grid-content {
         .k-grid-table-wrap {
-            float: inline-start;
+            float: left;
             width: 100%;
         }
 
         .k-grid-table {
             position: relative;
-            float: inline-start;
+            float: left;
             z-index: 1;
         }
 
         > .k-height-container {
             position: relative;
-            float: inline-start;
+            float: left;
         }
 
         &::after {
@@ -685,6 +703,7 @@
         height: 1px;
     }
 
+    .k-grid-add-row td,
     .k-grid-add-row .k-table-td {
         border-bottom-style: solid;
         border-bottom-width: 1px;
@@ -760,6 +779,7 @@
             z-index: auto;
         }
 
+        .k-grid-row-sticky td,
         .k-grid-row-sticky .k-table-td {
             border-bottom-width: $kendo-grid-border-width;
             border-top-width: $kendo-grid-border-width;
@@ -767,12 +787,11 @@
             position: sticky;
             top: inherit;
             bottom: inherit;
-        }
-
-        .k-grid-row-sticky .k-table-td {
             z-index: 2;
         }
 
+        .k-grid-row-sticky td.k-grid-content-sticky,
+        .k-grid-row-sticky.k-alt td.k-grid-content-sticky,
         .k-grid-row-sticky .k-table-td.k-grid-content-sticky,
         .k-grid-row-sticky.k-alt .k-table-td.k-grid-content-sticky {
             z-index: 3;
@@ -799,6 +818,7 @@
     .k-grid .k-table .k-grid-footer-sticky {
         border-inline-end-width: $kendo-grid-cell-vertical-border-width;
 
+        &:not([style*="display: none"]) + td,
         &:not([style*="display: none"]) + .k-table-td,
         &:not([style*="display: none"]) + .k-table-th {
             border-inline-start-width: 0;
@@ -884,6 +904,7 @@
                 padding: $_header-padding-y $_header-padding-x;
             }
 
+            td,
             .k-table-td {
                 padding: $_cell-padding-y $_cell-padding-x;
             }
@@ -945,6 +966,7 @@
             // Edit row
             .k-edit-cell,
             .k-command-cell,
+            .k-grid-edit-row td,
             .k-grid-edit-row .k-table-td {
                 padding: $_edit-cell-padding-y $_edit-cell-padding-x;
             }
@@ -952,6 +974,7 @@
 
             // Filter row
             .k-filter-row {
+                td,
                 .k-table-td,
                 .k-table-th {
                     padding: $_filter-cell-padding-y $_filter-cell-padding-x;
@@ -1014,7 +1037,7 @@
     // Remove Grid scrollbar during built-in export
     .k-pdf-export-shadow {
         .k-grid {
-            float: inline-start;
+            float: left;
             width: auto !important; // sass-lint:disable-line no-important
         }
 
@@ -1122,6 +1145,7 @@
         table-layout: auto !important;
 
         .k-table-th,
+        td,
         .k-table-td {
             white-space: nowrap !important;
         }

package/scss/grid/_theme.scss

@@ -4,6 +4,7 @@
     .k-grid-header-wrap,
     .k-grouping-header,
     .k-grid .k-table-th,
+    .k-grid td,
     .k-grid .k-table-td,
     .k-grid-footer,
     .k-grid-footer-wrap,
@@ -11,6 +12,7 @@
     .k-grid-footer-locked,
     .k-grid-header-locked,
     .k-filter-row > .k-table-th,
+    .k-filter-row > td,
     .k-filter-row > .k-table-td {
         @include fill( $border: $kendo-grid-header-border );
     }
@@ -44,6 +46,8 @@
         @include fill($bg: $kendo-grid-bg );
     }
 
+    .k-group-footer td,
+    .k-grouping-row td,
     .k-group-footer .k-table-td,
     .k-grouping-row .k-table-td,
     .k-table-tbody .k-group-cell {
@@ -79,6 +83,8 @@
         }
 
         // Selected state
+        td.k-selected,
+        .k-table-row.k-selected > td,
         .k-table-td.k-selected,
         .k-table-row.k-selected > .k-table-td {
             color: $kendo-grid-selected-text;
@@ -87,7 +93,12 @@
 
         // Focused state
         .k-table-th,
+        td,
         .k-table-td,
+        .k-master-row > td,
+        .k-grouping-row > td,
+        .k-detail-row > td,
+        .k-group-footer > td,
         .k-master-row > .k-table-td,
         .k-grouping-row > .k-table-td,
         .k-detail-row > .k-table-td,
@@ -123,30 +134,37 @@
         .k-grid-header-locked,
         .k-grid-content-locked,
         .k-grid-header-locked .k-table-th,
+        .k-grid-content-locked td,
         .k-grid-content-locked .k-table-td {
             border-color: $kendo-grid-sticky-header-border;
         }
 
         .k-grid-content-locked {
+            .k-group-footer td,
             .k-group-footer .k-table-td,
             .k-group-cell {
                 @include fill( $border: $kendo-grid-header-border );
             }
 
+            .k-grouping-row + .k-table-row td,
             .k-grouping-row + .k-table-row .k-table-td {
                 border-top-color: $kendo-grid-header-border;
             }
 
             // Selected state
+            .k-selected td,
             .k-selected .k-table-td {
                 @include fill( $bg: $kendo-grid-sticky-selected-bg );
             }
 
+            .k-selected.k-table-alt-row td,
             .k-selected.k-table-alt-row .k-table-td {
                 @include fill( $bg: $kendo-grid-sticky-selected-alt-bg );
             }
 
             // Selected hover
+            .k-selected:hover td,
+            .k-selected.k-hover td,
             .k-selected:hover .k-table-td,
             .k-selected.k-hover .k-table-td {
                 @include fill( $bg: $kendo-grid-sticky-selected-hover-bg );
@@ -190,6 +208,7 @@
         }
 
         .k-table-th.k-grid-header-sticky,
+        td.k-grid-header-sticky,
         .k-table-td.k-grid-header-sticky,
         .k-grid-header-sticky.k-sorted {
             @include fill(
@@ -240,12 +259,14 @@
         // Selected state
         &.k-selected .k-grid-content-sticky,
         &.k-selected .k-grid-row-sticky,
+        td.k-grid-content-sticky.k-selected,
         .k-table-td.k-grid-content-sticky.k-selected {
             @include fill( $bg: $kendo-grid-sticky-selected-bg );
         }
 
         &.k-selected.k-table-alt-row .k-grid-content-sticky,
         &.k-selected.k-table-alt-row .k-grid-row-sticky,
+        &.k-table-alt-row td.k-grid-content-sticky.k-selected,
         &.k-table-alt-row .k-table-td.k-grid-content-sticky.k-selected {
             @include fill( $bg: $kendo-grid-sticky-selected-alt-bg );
         }
@@ -265,6 +286,8 @@
         &.k-selected:hover .k-grid-row-sticky,
         &.k-selected.k-hover .k-grid-content-sticky,
         &.k-selected.k-hover .k-grid-row-sticky,
+        &:hover td.k-grid-content-sticky.k-selected,
+        &.k-hover td.k-grid-content-sticky.k-selected,
         &:hover .k-table-td.k-grid-content-sticky.k-selected,
         &.k-hover .k-table-td.k-grid-content-sticky.k-selected {
             background-color: $kendo-grid-sticky-selected-hover-bg;
@@ -285,12 +308,15 @@
         }
 
         .k-grid-row-sticky {
+            td,
             .k-table-td {
                 border-top-color: $kendo-grid-sticky-border;
                 border-bottom-color: $kendo-grid-sticky-border;
                 background-color: $kendo-grid-sticky-bg;
             }
 
+            &:hover td,
+            &.k-hover td,
             &:hover .k-table-td,
             &.k-hover .k-table-td {
                 background-color: $kendo-grid-sticky-hover-bg;
@@ -298,12 +324,15 @@
         }
 
         .k-table-alt-row .k-grid-content-sticky,
+        .k-grid-row-sticky.k-table-alt-row td,
         .k-grid-row-sticky.k-table-alt-row .k-table-td {
             @include fill( $bg: $kendo-grid-sticky-alt-bg );
         }
 
         // Selected state
         .k-table-row.k-selected .k-grid-content-sticky,
+        .k-selected.k-grid-row-sticky td,
+        .k-grid-row-sticky td.k-selected,
         .k-selected.k-grid-row-sticky .k-table-td,
         .k-grid-row-sticky .k-table-td.k-selected,
         .k-selected.k-grid-content-sticky {
@@ -311,6 +340,7 @@
         }
 
         .k-table-row.k-selected.k-table-alt-row .k-grid-content-sticky,
+        .k-selected.k-table-alt-row.k-grid-row-sticky td,
         .k-selected.k-table-alt-row.k-grid-row-sticky .k-table-td,
         .k-table-alt-row .k-selected.k-grid-content-sticky {
             @include fill( $bg: $kendo-grid-sticky-selected-alt-bg );
@@ -319,6 +349,10 @@
         // Hover state
         .k-table-row:hover .k-grid-content-sticky,
         .k-table-row.k-hover .k-grid-content-sticky,
+        .k-grid-row-sticky:hover td,
+        .k-grid-row-sticky.k-hover td,
+        .k-grid-row-sticky.k-table-alt-row:hover td,
+        .k-grid-row-sticky.k-table-alt-row.k-hover td,
         .k-grid-row-sticky:hover .k-table-td,
         .k-grid-row-sticky.k-hover .k-table-td,
         .k-grid-row-sticky.k-table-alt-row:hover .k-table-td,
@@ -331,12 +365,18 @@
         // Selected + Hover
         .k-table-row.k-selected:hover .k-grid-content-sticky,
         .k-table-row.k-selected.k-hover .k-grid-content-sticky,
+        .k-selected.k-grid-row-sticky:hover td,
+        .k-selected.k-grid-row-sticky.k-hover td,
+        .k-selected.k-table-alt-row.k-grid-row-sticky:hover td,
+        .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover td,
         .k-selected.k-grid-row-sticky:hover .k-table-td,
         .k-selected.k-grid-row-sticky.k-hover .k-table-td,
         .k-selected.k-table-alt-row.k-grid-row-sticky:hover .k-table-td,
         .k-selected.k-table-alt-row.k-grid-row-sticky.k-hover .k-table-td,
         .k-table-row.k-selected.k-table-alt-row:hover .k-grid-content-sticky,
         .k-table-row.k-selected.k-table-alt-row.k-hover .k-grid-content-sticky,
+        .k-grid-row-sticky:hover td.k-selected,
+        .k-grid-row-sticky.k-hover td.k-selected,
         .k-grid-row-sticky:hover .k-table-td.k-selected,
         .k-grid-row-sticky.k-hover .k-table-td.k-selected,
         .k-table-row:hover .k-grid-content-sticky.k-selected,

package/scss/icons/_layout.scss

@@ -26,6 +26,11 @@ $ki-icon-size: $kendo-icon-size;
         }
     }
 
+    // kendo-icon-wrapper component
+    .k-icon-wrapper-host {
+        display: contents;
+    }
+
     .k-icon-with-modifier {
         position: relative;
         margin: .25em;

package/scss/input/_layout.scss

@@ -288,7 +288,7 @@
             position: relative;
             aspect-ratio: auto;
 
-            > .k-button-icon {
+            .k-button-icon {
                 margin: -1em 0;
                 min-width: auto !important; // sass-lint:disable-line no-important
                 min-height: auto !important; // sass-lint:disable-line no-important

package/scss/treelist/_layout.scss

@@ -33,6 +33,8 @@
             transform: translate(0, -50%);
         }
 
+        .k-table-row.k-footer td,
+        .k-table-row.k-footer-template td,
         .k-table-row.k-footer .k-table-td,
         .k-table-row.k-footer-template .k-table-td {
             border-width: $kendo-treelist-footer-row-border-width 0;
@@ -40,6 +42,7 @@
             font-weight: bold;
         }
 
+        .k-table-row.k-footer + .k-table-row.k-footer td,
         .k-table-row.k-footer + .k-table-row.k-footer .k-table-td {
             border-top-width: 0;
         }