@progress/kendo-theme-fluent 14.2.0-dev.4 → 14.2.0-dev.6

package/dist/meta/variables.json

@@ -3003,15 +3003,15 @@
     },
     "kendo-badge-bg": {
         "type": "String",
-        "value": "var(--kendo-badge-bg, var(--kendo-color-surface-alt))"
+        "value": "var(--kendo-badge-bg, var(--kendo-color-base))"
     },
     "kendo-badge-text": {
         "type": "String",
-        "value": "var(--kendo-badge-text, var(--kendo-color-on-app-surface))"
+        "value": "var(--kendo-badge-text, var(--kendo-color-on-base))"
     },
     "kendo-badge-border": {
         "type": "String",
-        "value": "var(--kendo-badge-border, color-mix(in srgb, var(--kendo-color-border) 16%, transparent))"
+        "value": "var(--kendo-badge-border, var(--kendo-color-base))"
     },
     "kendo-badge-font-weight": {
         "type": "String",
@@ -13386,6 +13386,14 @@
         "type": "String",
         "value": "var(--kendo-grid-grouping-row-text, var(--kendo-table-group-row-text, var(--kendo-table-header-text, var(--kendo-color-on-app-surface))))"
     },
+    "kendo-grid-grouping-indent-size": {
+        "type": "String",
+        "value": "var(--kendo-spacing-6)"
+    },
+    "kendo-grid-grouping-row-checkbox-margin-end": {
+        "type": "String",
+        "value": "var(--kendo-spacing-3)"
+    },
     "kendo-grid-sorted-icon-spacing": {
         "type": "String",
         "value": "var(--kendo-grid-sort-icon-spacing, var(--kendo-icon-lg-spacing, 0.5rem))"

package/lib/swatches/all.json

@@ -3,7 +3,7 @@
     "name": "All",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "14.2.0-dev.4",
+    "version": "14.2.0-dev.6",
     "api": "modern",
     "previewColors": [
         "oklch(100.00% 0.0001 0deg)",

package/lib/swatches/fluent-1-dark.json

@@ -3,7 +3,7 @@
     "name": "Fluent 1 Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "14.2.0-dev.4",
+    "version": "14.2.0-dev.6",
     "previewColors": [
         "oklch(21.85% 0.0025 67.57deg)",
         "oklch(24.42% 0.0024 67.57deg)",

package/lib/swatches/fluent-1.json

@@ -3,7 +3,7 @@
     "name": "Fluent 1",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "14.2.0-dev.4",
+    "version": "14.2.0-dev.6",
     "previewColors": [
         "oklch(100.00% 0.0001 0deg)",
         "oklch(98.26% 0.0016 66.88deg)",

package/lib/swatches/fluent-main-dark.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "14.2.0-dev.4",
+    "version": "14.2.0-dev.6",
     "previewColors": [
         "oklch(23.93% 0.0000 0deg)",
         "oklch(28.09% 0.0000 0deg)",

package/lib/swatches/fluent-main.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "14.2.0-dev.4",
+    "version": "14.2.0-dev.6",
     "previewColors": [
         "oklch(98.51% 0.0001 0deg)",
         "oklch(100.00% 0.0001 0deg)",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-fluent",
   "description": "A css variables based theme for Kendo UI that follows the Fluent design system guidelines.",
-  "version": "14.2.0-dev.4",
+  "version": "14.2.0-dev.6",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -44,9 +44,8 @@
     "sass:compile:dist": "npx sass --style=compressed --no-source-map --load-path=../../node_modules ./dist:dist",
     "sass:watch": "npx sass --no-source-map --load-path=../../node_modules --watch ./scss/all.scss ./dist/all.css",
     "css:prefix": "npx postcss --replace ./dist/**/*.css",
-    "docs": "node ../../scripts/sassdoc.js",
+    "docs": "npm run resolve-variables && node ../../scripts/sassdoc.js",
     "docs:check": "npm run docs && git diff --name-only --exit-code -- docs",
-    "predocs": "npm run resolve-variables",
     "resolve-variables": "node ../../scripts/resolve-variables.js",
     "nuget-pack": "jq '.version' package.json | xargs nuget pack package.nuspec -Version",
     "nuget-push": "nuget push *.nupkg -ApiKey $NUGET_API_KEY -Source $NUGET_FEED -SkipDuplicate",
@@ -55,8 +54,8 @@
   },
   "dependencies": {
     "@progress/kendo-svg-icons": "^4.9.0",
-    "@progress/kendo-theme-core": "14.2.0-dev.4",
-    "@progress/kendo-theme-utils": "14.2.0-dev.4"
+    "@progress/kendo-theme-core": "14.2.0-dev.6",
+    "@progress/kendo-theme-utils": "14.2.0-dev.6"
   },
   "directories": {
     "doc": "docs",

package/scss/badge/_theme.scss

@@ -13,6 +13,7 @@
         &.k-badge-solid {
             #{k-when-default($kendo-badge-default-theme-color, "base")}
             &.k-badge-base {
+                /* Exactly the same as the color tokens in core, but leaving it for custom variables support */
                 color: $kendo-badge-text;
                 background-color: $kendo-badge-bg;
                 border-color: $kendo-badge-border;
@@ -21,10 +22,8 @@
 
         #{k-when-default($kendo-badge-default-fill-mode, "outline")}
         &.k-badge-outline {
-            #{k-when-default($kendo-badge-default-theme-color, "base")}
-            &.k-badge-base {
-                border-color: $kendo-badge-border;
-            }
+            /* Exactly the same as the color tokens in core, but leaving it for custom variables support */
+            border-color: currentColor;
 
             @each $name in $kendo-badge-theme-colors {
                 #{k-when-default($kendo-badge-default-theme-color, $name)}

package/scss/badge/_variables.scss

@@ -20,13 +20,13 @@ $kendo-badge-default-roundness: "md" !default;
 
 /// The background color of the Badge.
 /// @group badge
-$kendo-badge-bg: var( --kendo-badge-bg, k-color(surface-alt) ) !default;
+$kendo-badge-bg: var( --kendo-badge-bg, k-color(base) ) !default;
 /// The text color of the Badge.
 /// @group badge
-$kendo-badge-text: var( --kendo-badge-text, k-color(on-app-surface) ) !default;
+$kendo-badge-text: var( --kendo-badge-text, k-color(on-base) ) !default;
 /// The border color of the Badge.
 /// @group badge
-$kendo-badge-border: var( --kendo-badge-border, color-mix(in srgb, k-color(border) 16%, transparent) ) !default;
+$kendo-badge-border: var( --kendo-badge-border, k-color(base) ) !default;
 
 /// The border width of the Badge.
 /// @group badge

package/scss/grid/_layout.scss

@@ -33,14 +33,9 @@
             border-block-end-width: 0;
         }
 
-        .k-grouping-row + .k-table-row .k-table-td {
-            border-block-start-width: $kendo-grid-grouping-row-border-width-y;
-        }
-
-        .k-grouping-row .k-group-cell,
-        .k-grouping-row + .k-table-row .k-group-cell {
+        .k-grouping-row .k-group-cell {
             border-block-width: 0;
-            border-inline-end-width: 1px;
+            border-inline-width: 0;
         }
 
         .k-group-footer .k-table-td {
@@ -69,6 +64,12 @@
                 }
             }
         }
+
+        .k-master-row:has(+ .k-detail-row) {
+            > .k-table-td:not(.k-group-cell) {
+                border-block-end-width: 0;
+            }
+        }
     }
 
     .k-grid-pinned-container {
@@ -180,7 +181,11 @@
     // Master row
     .k-master-row .k-group-cell {
         border-block-width: 0;
-        border-inline-end-width: $kendo-grid-border-width;
+    }
+
+    .k-detail-row .k-group-cell + :not(.k-group-cell),
+    .k-master-row .k-group-cell + :not(.k-group-cell) {
+        border-inline-start: 1px solid;
     }
 
     .k-master-row.k-expanded .k-table-td {

package/scss/grid/_theme.scss

@@ -59,6 +59,13 @@
         .k-table-row.k-selected > .k-table-td.k-grid-content-sticky {
             border-inline-color: $kendo-grid-sticky-border;
         }
+
+        .k-detail-row,
+        .k-master-row {
+            .k-group-cell + :not(.k-group-cell) {
+                border-inline-start-color: $kendo-grid-border;
+            }
+        }
     }
 
     // Grid header

package/scss/grid/_variables.scss

@@ -314,6 +314,12 @@ $kendo-grid-grouping-header-border: var( --kendo-grid-grouping-header-border, #{
 /// The vertical border width of the Grid grouping row.
 /// @group grid
 $kendo-grid-grouping-row-border-width-y: var( --kendo-grid-grouping-row-border-width-y, #{$kendo-grid-border-width} ) !default;
+/// The indent size for nested grouping rows.
+/// @group grid
+$kendo-grid-grouping-indent-size: k-spacing(6) !default;
+/// The margin at the end of the checkbox in grouping rows.
+/// @group grid
+$kendo-grid-grouping-row-checkbox-margin-end: k-spacing(3) !default;
 /// The background color of the Grid grouping row.
 /// @group grid
 $kendo-grid-grouping-row-bg: var( --kendo-grid-grouping-row-bg, #{$kendo-table-group-row-bg} ) !default;
@@ -712,6 +718,8 @@ $kendo-grid-pinned-source-font-weight: var(--kendo-font-weight-semibold) !defaul
     $kendo-grid-drag-cell-width: $kendo-grid-drag-cell-width,
     $kendo-grid-hierarchy-col-width: $kendo-grid-hierarchy-col-width,
     $kendo-grid-grouping-row-border-top: $kendo-grid-grouping-row-border-width-y,
+    $kendo-grid-grouping-indent-size: $kendo-grid-grouping-indent-size,
+    $kendo-grid-grouping-row-checkbox-margin-end: $kendo-grid-grouping-row-checkbox-margin-end,
     $kendo-grid-group-footer-border-y: $kendo-grid-group-footer-border-width-y,
     $kendo-grid-row-resizer-hover-bg: $kendo-grid-row-resizer-hover-bg,
     $kendo-grid-row-resizer-active-bg: $kendo-grid-row-resizer-active-bg,