@progress/kendo-theme-core 14.2.0-dev.3 → 14.2.0-dev.5

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-core",
   "description": "A collection of functions and mixins used for building themes for Kendo UI",
-  "version": "14.2.0-dev.3",
+  "version": "14.2.0-dev.5",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [

package/scss/components/grid/_layout.scss

@@ -276,19 +276,29 @@
             width: $kendo-grid-hierarchy-col-width;
         }
 
+        .k-grouping-row .k-grouping-row-content,
         .k-grouping-row p {
             margin: 0;
             display: flex;
             align-items: center;
             align-content: center;
+            overflow: hidden;
 
             .k-icon {
                 flex-shrink: 0;
             }
+
+            .k-grouping-row-text {
+                flex: 1;
+                min-width: 0;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+            }
         }
 
         .k-grouping-row .k-table-td {
-            overflow: visible;
+            padding-inline-start: calc( #{$kendo-grid-cell-padding-x} + var(--kendo-grid-grouping-level, 0) * #{$kendo-grid-grouping-indent-size} );
         }
 
         .k-grouping-row + .k-table-row .k-table-td {
@@ -301,19 +311,49 @@
             text-overflow: clip;
         }
 
+        .k-grouping-row + .k-grouping-row .k-table-td,
+        .k-grouping-row + .k-grouping-row .k-group-cell {
+            border-block-start-width: $kendo-grid-grouping-row-border-top;
+        }
+
+        .k-group-cell + .k-group-cell {
+            border-inline-start-width: 0;
+        }
+
+        .k-grouping-row .k-group-cell + .k-table-td:not(.k-group-cell),
+        .k-grouping-row .k-table-td:not(.k-group-cell) + .k-table-td {
+            border-inline-start-color: transparent;
+        }
+
         .k-grouping-row .k-icon {
             margin-inline-start: calc( ( $kendo-icon-size / 2 ) - #{$kendo-grid-cell-padding-x} );
             margin-inline-end: calc( $kendo-icon-size / 2 );
             text-decoration: none;
         }
 
+        .k-grouping-row .k-checkbox-wrap {
+            margin-inline-end: $kendo-grid-grouping-row-checkbox-margin-end;
+        }
+
         .k-table .k-group-footer .k-table-td {
             border-style: solid;
             border-width: $kendo-grid-group-footer-border-y 0;
         }
 
+        .k-table .k-group-footer .k-group-cell {
+            border-block-start-width: 0;
+            border-block-end-width: $kendo-grid-group-footer-border-y;
+            border-inline-width: 0;
+        }
+
         .k-group-footer .k-group-cell + .k-table-td {
-            border-inline-start-width: $kendo-grid-cell-vertical-border-width;
+            border-inline-start-color: transparent;
+        }
+
+        .k-table-row:not(.k-grouping-row, .k-group-footer):has(+ .k-grouping-row) {
+            > .k-table-td {
+                border-block-end-width: 1px;
+            }
         }
 
         .k-hierarchy-cell,
@@ -370,6 +410,14 @@
             }
         }
 
+        .k-detail-row,
+        .k-master-row:has(+ .k-table-group-row),
+        .k-master-row:has(+ .k-detail-row) {
+            > .k-table-td:not(.k-group-cell) {
+                border-block-end-width: 1px;
+            }
+        }
+
         .k-dirty-cell {
             position: relative;
 
@@ -1066,6 +1114,10 @@
                     padding-inline: $_cell-padding-x;
                 }
 
+                .k-grouping-row .k-table-td {
+                    padding-inline-start: calc( #{$_cell-padding-x} + var(--kendo-grid-grouping-level, 0) * #{$kendo-grid-grouping-indent-size} );
+                }
+
                 .k-grouping-header {
                     padding-block: $_grouping-header-padding-y;
                     padding-inline: $_grouping-header-padding-x;
@@ -1218,6 +1270,20 @@
                 padding: k-spacing(1);
                 margin: 0;
             }
+
+            .k-table-td {
+                padding-inline-start: calc( #{$kendo-grid-stack-cell-padding-x} + var(--kendo-grid-grouping-level, 0) * #{$kendo-grid-grouping-indent-size} );
+            }
+        }
+
+        .k-table .k-group-footer .k-table-td {
+            border-block-start-width: 0;
+        }
+
+        .k-table-row:not(.k-grouping-row, .k-group-footer):has(+ .k-group-footer) {
+            > .k-table-td:not(.k-group-cell) {
+                border-block-end-width: $kendo-grid-group-footer-border-y;
+            }
         }
 
         // Column template

package/scss/components/grid/_theme.scss

@@ -103,6 +103,10 @@
             }
         }
 
+        .k-table-row:not(.k-grouping-row, .k-group-footer):has(+ .k-grouping-row) > .k-table-td {
+            border-block-end-color: $kendo-grid-border;
+        }
+
         // Locked columns
         .k-grid-content-locked {
             border-color: $kendo-grid-sticky-header-border;
@@ -192,6 +196,14 @@
             }
         }
 
+        .k-detail-row,
+        .k-master-row:has(+ .k-table-group-row),
+        .k-master-row:has(+ .k-detail-row) {
+            > .k-grid-content-sticky {
+                border-block-end-color: $kendo-grid-border;
+            }
+        }
+
     }
 
     // Grid header
@@ -282,9 +294,9 @@
     }
 
     .k-grid-add-row {
-        color: $kendo-grid-header-text;
-        background-color: $kendo-grid-header-bg;
-        border-color: $kendo-grid-header-border;
+        color: $kendo-grid-add-row-text;
+        background-color: $kendo-grid-add-row-bg;
+        border-color: $kendo-grid-add-row-border;
     }
 
     // Grouping

package/scss/components/grid/_variables.scss

@@ -124,6 +124,10 @@ $kendo-grid-header-bg: null !default;
 $kendo-grid-header-text: null !default;
 $kendo-grid-header-border: null !default;
 
+$kendo-grid-add-row-bg: null !default;
+$kendo-grid-add-row-text: null !default;
+$kendo-grid-add-row-border: null !default;
+
 $kendo-grid-footer-bg: null !default;
 $kendo-grid-footer-text: null !default;
 $kendo-grid-footer-border: null !default;
@@ -151,6 +155,8 @@ $kendo-grid-selection-aggregates-font-weight: null !default;
 
 $kendo-grid-grouping-row-bg: null !default;
 $kendo-grid-grouping-row-text: null !default;
+$kendo-grid-grouping-indent-size: null !default;
+$kendo-grid-grouping-row-checkbox-margin-end: null !default;
 
 $kendo-grid-sorted-icon-spacing: null !default;
 $kendo-grid-sorted-bg: null !default;

package/scss/components/spreadsheet/_layout.scss

@@ -311,7 +311,7 @@
         height: 100%;
         overflow: scroll;
         position: absolute;
-        z-index: k-z-index("base", 2);
+        z-index: k-z-index("base", 1);
 
         @media (hover: none), (pointer: coarse) {
             // on touch devices we want this to stay on top.