@progress/kendo-theme-fluent 12.1.0-dev.2 → 12.1.0-dev.4

package/dist/meta/variables.json

@@ -335,7 +335,7 @@
     },
     "kendo-colors": {
         "type": "Map",
-        "value": "(app-surface: #fafafa, on-app-surface: #242424, subtle: #707070, surface: #ffffff, surface-alt: #ffffff, border: rgba(36, 36, 36, 0.72), border-alt: #000000, base-subtle: #f5f5f5, base-subtle-hover: #ebebeb, base-subtle-active: #e0e0e0, base: #ffffff, base-hover: #f5f5f5, base-active: #ebebeb, base-emphasis: #d1d1d1, base-on-subtle: #242424, on-base: #242424, base-on-surface: #242424, primary-subtle: #ebf3fc, primary-subtle-hover: #cfe4fa, primary-subtle-active: #96c6fa, primary: #0f6cbd, primary-hover: #115ea3, primary-active: #0f548c, primary-emphasis: #abd1f8, primary-on-subtle: #0a2e4a, on-primary: #ffffff, primary-on-surface: #0f6cbd, secondary-subtle: #f0f0f0, secondary-subtle-hover: #fafafa, secondary-subtle-active: #ffffff, secondary: #ebebeb, secondary-hover: #f5f5f5, secondary-active: #fafafa, secondary-emphasis: #e0e0e0, secondary-on-subtle: #616161, on-secondary: #616161, secondary-on-surface: #616161, tertiary-subtle: #fdf5fc, tertiary-subtle-hover: #f5daf2, tertiary-subtle-active: #edbbe7, tertiary: #c239b3, tertiary-hover: #af33a1, tertiary-active: #962c8a, tertiary-emphasis: #edbbe7, tertiary-on-subtle: #af33a1, on-tertiary: #ffffff, tertiary-on-surface: #c239b3, info-subtle: #f6fafe, info-subtle-hover: #dcedfa, info-subtle-active: #bfddf5, info: #3a96dd, info-hover: #3991d5, info-active: #4fa1e1, info-emphasis: #bfddf5, info-on-subtle: #20547c, on-info: #242424, info-on-surface: #3487c7, success-subtle: #f1faf1, success-subtle-hover: #c9eac9, success-subtle-active: #9fd89f, success: #107c10, success-hover: #0e700e, success-active: #0c5e0c, success-emphasis: #9fd89f, success-on-subtle: #0e700e, on-success: #ffffff, success-on-surface: #107c10, warning-subtle: #fff9f5, warning-subtle-hover: #fee5d7, warning-subtle-active: #fdcfb4, warning: #f7630c, warning-hover: #de590b, warning-active: #bc4b09, warning-emphasis: #fdcfb4, warning-on-subtle: #8a3707, on-warning: #242424, warning-on-surface: #8a3707, error-subtle: #fdf3f4, error-subtle-hover: #f6d1d5, error-subtle-active: #eeacb2, error: #c50f1f, error-hover: #b10e1c, error-active: #960b18, error-emphasis: #eeacb2, error-on-subtle: #b10e1c, on-error: #ffffff, error-on-surface: #c50f1f, light-subtle: #ffffff, light-subtle-hover: #f5f5f5, light-subtle-active: #ebebeb, light: #ebebeb, light-hover: #f5f5f5, light-active: #f0f0f0, light-emphasis: #e0e0e0, light-on-subtle: #616161, on-light: #242424, light-on-surface: #ffffff, dark-subtle: #000000, dark-subtle-hover: #242424, dark-subtle-active: #333333, dark: #242424, dark-hover: #424242, dark-active: #333333, dark-emphasis: #616161, dark-on-subtle: #ffffff, on-dark: #ffffff, dark-on-surface: #616161, inverse-subtle: #000000, inverse-subtle-hover: #242424, inverse-subtle-active: #333333, inverse: #242424, inverse-hover: #424242, inverse-active: #333333, inverse-emphasis: #616161, inverse-on-subtle: #ffffff, on-inverse: #ffffff, inverse-on-surface: #616161, series-a: #2aa0a4, series-a-bold: #20787b, series-a-bolder: #155052, series-a-subtle: #5fb8bb, series-a-subtler: #94cfd1, series-b: #ae8c00, series-b-bold: #826900, series-b-bolder: #574600, series-b-subtle: #c2a940, series-b-subtler: #d7c580, series-c: #e3008c, series-c-bold: #aa0069, series-c-bolder: #720046, series-c-subtle: #ea40a9, series-c-subtler: #f180c5, series-d: #13a10e, series-d-bold: #0e790b, series-d-bolder: #0a5107, series-d-subtle: #4eb94a, series-d-subtler: #89d086, series-e: #637cef, series-e-bold: #4a5db3, series-e-bolder: #323e78, series-e-subtle: #c3b1db, series-e-subtler: #a58bca, series-f: #CA5010, series-f-bold: #973C0C, series-f-bolder: #652808, series-f-subtle: #D77C4C, series-f-subtler: #E5A787)",
+        "value": "(app-surface: #fafafa, on-app-surface: #242424, subtle: #707070, surface: #ffffff, surface-alt: #ffffff, border: rgba(36, 36, 36, 0.72), border-alt: #000000, base-subtle: #f5f5f5, base-subtle-hover: #ebebeb, base-subtle-active: #e0e0e0, base: #ffffff, base-hover: #f5f5f5, base-active: #ebebeb, base-emphasis: #d1d1d1, base-on-subtle: #242424, on-base: #242424, base-on-surface: #242424, primary-subtle: #ebf3fc, primary-subtle-hover: #cfe4fa, primary-subtle-active: #96c6fa, primary: #0f6cbd, primary-hover: #115ea3, primary-active: #0f548c, primary-emphasis: #abd1f8, primary-on-subtle: #0a2e4a, on-primary: #ffffff, primary-on-surface: #0f6cbd, secondary-subtle: #f0f0f0, secondary-subtle-hover: #fafafa, secondary-subtle-active: #ffffff, secondary: #ebebeb, secondary-hover: #f5f5f5, secondary-active: #fafafa, secondary-emphasis: #e0e0e0, secondary-on-subtle: #616161, on-secondary: #616161, secondary-on-surface: #616161, tertiary-subtle: #fdf5fc, tertiary-subtle-hover: #f5daf2, tertiary-subtle-active: #edbbe7, tertiary: #c239b3, tertiary-hover: #af33a1, tertiary-active: #962c8a, tertiary-emphasis: #edbbe7, tertiary-on-subtle: #af33a1, on-tertiary: #ffffff, tertiary-on-surface: #c239b3, info-subtle: #f6fafe, info-subtle-hover: #dcedfa, info-subtle-active: #bfddf5, info: #3a96dd, info-hover: #3991d5, info-active: #4fa1e1, info-emphasis: #bfddf5, info-on-subtle: #20547c, on-info: #242424, info-on-surface: #3487c7, success-subtle: #f1faf1, success-subtle-hover: #c9eac9, success-subtle-active: #9fd89f, success: #107c10, success-hover: #0e700e, success-active: #0c5e0c, success-emphasis: #9fd89f, success-on-subtle: #0e700e, on-success: #ffffff, success-on-surface: #107c10, warning-subtle: #fff9f5, warning-subtle-hover: #fee5d7, warning-subtle-active: #fdcfb4, warning: #f7630c, warning-hover: #de590b, warning-active: #bc4b09, warning-emphasis: #fdcfb4, warning-on-subtle: #8a3707, on-warning: #242424, warning-on-surface: #8a3707, error-subtle: #fdf3f4, error-subtle-hover: #f6d1d5, error-subtle-active: #eeacb2, error: #c50f1f, error-hover: #b10e1c, error-active: #960b18, error-emphasis: #eeacb2, error-on-subtle: #b10e1c, on-error: #ffffff, error-on-surface: #c50f1f, light-subtle: #ffffff, light-subtle-hover: #f5f5f5, light-subtle-active: #ebebeb, light: #ebebeb, light-hover: #f5f5f5, light-active: #f0f0f0, light-emphasis: #e0e0e0, light-on-subtle: #616161, on-light: #242424, light-on-surface: #ffffff, dark-subtle: #000000, dark-subtle-hover: #242424, dark-subtle-active: #333333, dark: #242424, dark-hover: #424242, dark-active: #333333, dark-emphasis: #616161, dark-on-subtle: #ffffff, on-dark: #ffffff, dark-on-surface: #616161, inverse-subtle: #616161, inverse-subtle-hover: #8a8a8a, inverse-subtle-active: #707070, inverse: #242424, inverse-hover: #424242, inverse-active: #333333, inverse-emphasis: #707070, inverse-on-subtle: #ffffff, on-inverse: #ffffff, inverse-on-surface: #616161, series-a: #2aa0a4, series-a-bold: #20787b, series-a-bolder: #155052, series-a-subtle: #5fb8bb, series-a-subtler: #94cfd1, series-b: #ae8c00, series-b-bold: #826900, series-b-bolder: #574600, series-b-subtle: #c2a940, series-b-subtler: #d7c580, series-c: #e3008c, series-c-bold: #aa0069, series-c-bolder: #720046, series-c-subtle: #ea40a9, series-c-subtler: #f180c5, series-d: #13a10e, series-d-bold: #0e790b, series-d-bolder: #0a5107, series-d-subtle: #4eb94a, series-d-subtler: #89d086, series-e: #637cef, series-e-bold: #4a5db3, series-e-bolder: #323e78, series-e-subtle: #c3b1db, series-e-subtler: #a58bca, series-f: #CA5010, series-f-bold: #973C0C, series-f-bolder: #652808, series-f-subtle: #D77C4C, series-f-subtler: #E5A787)",
         "prettyValue": {
             "app-surface": "#fafafa",
             "on-app-surface": "#242424",
@@ -444,13 +444,13 @@
             "dark-on-subtle": "#ffffff",
             "on-dark": "#ffffff",
             "dark-on-surface": "#616161",
-            "inverse-subtle": "#000000",
-            "inverse-subtle-hover": "#242424",
-            "inverse-subtle-active": "#333333",
+            "inverse-subtle": "#616161",
+            "inverse-subtle-hover": "#8a8a8a",
+            "inverse-subtle-active": "#707070",
             "inverse": "#242424",
             "inverse-hover": "#424242",
             "inverse-active": "#333333",
-            "inverse-emphasis": "#616161",
+            "inverse-emphasis": "#707070",
             "inverse-on-subtle": "#ffffff",
             "on-inverse": "#ffffff",
             "inverse-on-surface": "#616161",
@@ -3071,7 +3071,7 @@
     },
     "kendo-current-time-color": {
         "type": "String",
-        "value": "var(--kendo-current-time-color, #ff0000)"
+        "value": "var(--kendo-current-time-color, var(--kendo-color-error-on-surface, #c50f1f))"
     },
     "kendo-tooltip-border-radius": {
         "type": "String",
@@ -6510,10 +6510,6 @@
         "type": "String",
         "value": "var(--kendo-calendar-header-bg, var(--kendo-color-surface, #ffffff))"
     },
-    "kendo-calendar-header-text": {
-        "type": "String",
-        "value": "var(--kendo-calendar-header-text, var(--kendo-calendar-text, var(--kendo-color-on-app-surface, #242424)))"
-    },
     "kendo-calendar-header-border": {
         "type": "String",
         "value": "var(--kendo-calendar-header-border, var(--kendo-calendar-border, color-mix(in srgb, var(--kendo-color-border, rgba(36, 36, 36, 0.72)) 16%, transparent)))"
@@ -6736,7 +6732,7 @@
     },
     "kendo-calendar-navigation-text": {
         "type": "String",
-        "value": "var(--kendo-calendar-navigation-text, var(--kendo-calendar-header-text, var(--kendo-calendar-text, var(--kendo-color-on-app-surface, #242424))))"
+        "value": "var(--kendo-calendar-navigation-text, var(--kendo-color-on-app-surface, #242424))"
     },
     "kendo-calendar-navigation-border": {
         "type": "String",
@@ -9323,13 +9319,9 @@
         "type": "Number",
         "value": "100px"
     },
-    "kendo-card-avatar-size": {
-        "type": "Number",
-        "value": "3rem"
-    },
     "kendo-card-avatar-spacing": {
         "type": "String",
-        "value": "var(--kendo-card-header-padding-x, var(--kendo-spacing-3, 0.75rem))"
+        "value": "var(--kendo-spacing-2, 0.5rem)"
     },
     "kendo-card-actions-padding-x": {
         "type": "String",
@@ -9992,7 +9984,7 @@
     },
     "kendo-drawer-scrollbar-hover-color": {
         "type": "String",
-        "value": "var(--kendo-drawer-scrollbar-hover-color, color-mix(in srgb, var(--kendo-color-on-app-surface, #242424) 60%, transparent))"
+        "value": "var(--kendo-drawer-scrollbar-hover-color, var(--kendo-drawer-scrollbar-color, color-mix(in srgb, var(--kendo-color-on-app-surface, #242424) 46%, transparent)))"
     },
     "kendo-drawer-items-padding-x": {
         "type": "String",
@@ -10252,12 +10244,12 @@
     },
     "kendo-notification-theme": {
         "type": "Map",
-        "value": "(\"inverse\": (color: var(--kendo-color-inverse-on-subtle, #ffffff), background-color: var(--kendo-color-dark-subtle, #000000), border: var(--kendo-color-inverse-emphasis, #616161)), \"light\": (color: var(--kendo-color-light-on-subtle, #616161), background-color: var(--kendo-color-light-subtle, #ffffff), border: var(--kendo-color-light-emphasis, #e0e0e0)), \"dark\": (color: var(--kendo-color-dark-on-subtle, #ffffff), background-color: var(--kendo-color-dark-subtle, #000000), border: var(--kendo-color-dark-emphasis, #616161)), \"error\": (color: var(--kendo-color-error-on-subtle, #b10e1c), background-color: var(--kendo-color-error-subtle, #fdf3f4), border: var(--kendo-color-error-emphasis, #eeacb2)), \"warning\": (color: var(--kendo-color-warning-on-subtle, #8a3707), background-color: var(--kendo-color-warning-subtle, #fff9f5), border: var(--kendo-color-warning-emphasis, #fdcfb4)), \"success\": (color: var(--kendo-color-success-on-subtle, #0e700e), background-color: var(--kendo-color-success-subtle, #f1faf1), border: var(--kendo-color-success-emphasis, #9fd89f)), \"info\": (color: var(--kendo-color-info-on-subtle, #20547c), background-color: var(--kendo-color-info-subtle, #f6fafe), border: var(--kendo-color-info-emphasis, #bfddf5)), \"tertiary\": (color: var(--kendo-color-tertiary-on-subtle, #af33a1), background-color: var(--kendo-color-tertiary-subtle, #fdf5fc), border: var(--kendo-color-tertiary-emphasis, #edbbe7)), \"secondary\": (color: var(--kendo-color-secondary-on-subtle, #616161), background-color: var(--kendo-color-secondary-subtle, #f0f0f0), border: var(--kendo-color-secondary-emphasis, #e0e0e0)), \"primary\": (color: var(--kendo-color-primary-on-subtle, #0a2e4a), background-color: var(--kendo-color-primary-subtle, #ebf3fc), border: var(--kendo-color-primary-emphasis, #abd1f8)))",
+        "value": "(\"inverse\": (color: var(--kendo-color-inverse-on-subtle, #ffffff), background-color: var(--kendo-color-dark-subtle, #000000), border: var(--kendo-color-inverse-emphasis, #707070)), \"light\": (color: var(--kendo-color-light-on-subtle, #616161), background-color: var(--kendo-color-light-subtle, #ffffff), border: var(--kendo-color-light-emphasis, #e0e0e0)), \"dark\": (color: var(--kendo-color-dark-on-subtle, #ffffff), background-color: var(--kendo-color-dark-subtle, #000000), border: var(--kendo-color-dark-emphasis, #616161)), \"error\": (color: var(--kendo-color-error-on-subtle, #b10e1c), background-color: var(--kendo-color-error-subtle, #fdf3f4), border: var(--kendo-color-error-emphasis, #eeacb2)), \"warning\": (color: var(--kendo-color-warning-on-subtle, #8a3707), background-color: var(--kendo-color-warning-subtle, #fff9f5), border: var(--kendo-color-warning-emphasis, #fdcfb4)), \"success\": (color: var(--kendo-color-success-on-subtle, #0e700e), background-color: var(--kendo-color-success-subtle, #f1faf1), border: var(--kendo-color-success-emphasis, #9fd89f)), \"info\": (color: var(--kendo-color-info-on-subtle, #20547c), background-color: var(--kendo-color-info-subtle, #f6fafe), border: var(--kendo-color-info-emphasis, #bfddf5)), \"tertiary\": (color: var(--kendo-color-tertiary-on-subtle, #af33a1), background-color: var(--kendo-color-tertiary-subtle, #fdf5fc), border: var(--kendo-color-tertiary-emphasis, #edbbe7)), \"secondary\": (color: var(--kendo-color-secondary-on-subtle, #616161), background-color: var(--kendo-color-secondary-subtle, #f0f0f0), border: var(--kendo-color-secondary-emphasis, #e0e0e0)), \"primary\": (color: var(--kendo-color-primary-on-subtle, #0a2e4a), background-color: var(--kendo-color-primary-subtle, #ebf3fc), border: var(--kendo-color-primary-emphasis, #abd1f8)))",
         "prettyValue": {
             "inverse": {
                 "color": "var(--kendo-color-inverse-on-subtle, #ffffff)",
                 "background-color": "var(--kendo-color-dark-subtle, #000000)",
-                "border": "var(--kendo-color-inverse-emphasis, #616161)"
+                "border": "var(--kendo-color-inverse-emphasis, #707070)"
             },
             "light": {
                 "color": "var(--kendo-color-light-on-subtle, #616161)",
@@ -12424,7 +12416,7 @@
     },
     "kendo-adaptive-scheduler-subtle-text": {
         "type": "String",
-        "value": "var(--kendo-adaptive-scheduler-subtle-text, var(--kendo-color-subtle, #707070))"
+        "value": "var(--kendo-adaptive-scheduler-subtle-text, var(--kendo-color-on-app-surface, #242424))"
     },
     "kendo-grid-border-width": {
         "type": "String",
@@ -14024,7 +14016,7 @@
     },
     "kendo-filter-preview-operator-text": {
         "type": "String",
-        "value": "var(--kendo-filter-preview-operator-text, var(--kendo-color-subtle, #707070))"
+        "value": "var(--kendo-filter-preview-operator-text, var(--kendo-color-on-app-surface, #242424))"
     },
     "kendo-filter-toolbar-focus-shadow": {
         "type": "Null",
@@ -14984,11 +14976,11 @@
     },
     "kendo-gantt-summary-bg": {
         "type": "String",
-        "value": "var(--kendo-gantt-summary-bg, var(--kendo-color-dark-emphasis, #616161))"
+        "value": "var(--kendo-gantt-summary-bg, var(--kendo-color-inverse-subtle, #616161))"
     },
     "kendo-gantt-summary-progress-bg": {
         "type": "String",
-        "value": "var(--kendo-gantt-summary-progress-bg, var(--kendo-color-dark, #242424))"
+        "value": "var(--kendo-gantt-summary-progress-bg, var(--kendo-color-inverse, #242424))"
     },
     "kendo-gantt-summary-selected-bg": {
         "type": "String",
@@ -15012,11 +15004,11 @@
     },
     "kendo-gantt-task-bg": {
         "type": "String",
-        "value": "var(--kendo-gantt-task-bg, var(--kendo-color-subtle, #707070))"
+        "value": "var(--kendo-gantt-task-bg, var(--kendo-color-inverse-subtle, #616161))"
     },
     "kendo-gantt-task-text": {
         "type": "String",
-        "value": "var(--kendo-gantt-task-text, var(--kendo-color-app-surface, #fafafa))"
+        "value": "var(--kendo-gantt-task-text, var(--kendo-color-on-inverse, #ffffff))"
     },
     "kendo-gantt-task-border": {
         "type": "String",
@@ -15024,7 +15016,7 @@
     },
     "kendo-gantt-task-progress-bg": {
         "type": "String",
-        "value": "var(--kendo-gantt-task-progress-bg, var(--kendo-color-on-app-surface, #242424))"
+        "value": "var(--kendo-gantt-task-progress-bg, var(--kendo-color-inverse, #242424))"
     },
     "kendo-gantt-task-selected-bg": {
         "type": "String",
@@ -15168,7 +15160,7 @@
     },
     "kendo-gantt-task-progress-hover-bg": {
         "type": "String",
-        "value": "var(--kendo-gantt-task-progress-hover-bg, var(--kendo-color-on-app-surface, #242424))"
+        "value": "var(--kendo-gantt-task-progress-hover-bg, var(--kendo-color-inverse-hover, #424242))"
     },
     "kendo-gantt-task-actions-padding-y": {
         "type": "String",
@@ -16260,11 +16252,11 @@
     },
     "kendo-pdf-viewer-free-text-annotation-placeholder-text": {
         "type": "String",
-        "value": "var(--kendo-pdf-viewer-free-text-annotation-placeholder-text, rgba(124, 22, 27, 0.5))"
+        "value": "var(--kendo-pdf-viewer-free-text-annotation-placeholder-text, var(--kendo-color-primary-on-subtle, #0a2e4a))"
     },
     "kendo-pdf-viewer-free-text-annotation-text": {
         "type": "String",
-        "value": "var(--kendo-pdf-viewer-free-text-annotation-text, rgba(124, 22, 27, 0.7))"
+        "value": "var(--kendo-pdf-viewer-free-text-annotation-text, var(--kendo-color-primary-on-subtle, #0a2e4a))"
     },
     "kendo-pdf-viewer-search-panel-margin-y": {
         "type": "String",
@@ -16346,10 +16338,6 @@
         "type": "String",
         "value": "var(--kendo-scrollview-navigation-color, var(--kendo-color-app-surface, #fafafa))"
     },
-    "kendo-scrollview-navigation-icon-shadow": {
-        "type": "Null",
-        "value": "null"
-    },
     "kendo-scrollview-navigation-bg": {
         "type": "String",
         "value": "var(--kendo-scrollview-navigation-bg, transparent)"
@@ -17268,7 +17256,7 @@
     },
     "kendo-orgchart-card-body-vbox-min-height": {
         "type": "String",
-        "value": "var(--kendo-orgchart-card-body-vbox-min-height, 3rem)"
+        "value": "var(--kendo-orgchart-card-body-vbox-min-height, 3em)"
     },
     "kendo-orgchart-line-size": {
         "type": "String",

package/lib/swatches/all.json

@@ -3,7 +3,7 @@
     "name": "All",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.2",
+    "version": "12.1.0-dev.4",
     "api": "modern",
     "previewColors": [
         "#ffffff",

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

@@ -3,7 +3,7 @@
     "name": "Fluent 1 Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.2",
+    "version": "12.1.0-dev.4",
     "previewColors": [
         "#1b1a19",
         "#21201f",

package/lib/swatches/fluent-1.json

@@ -3,7 +3,7 @@
     "name": "Fluent 1",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.2",
+    "version": "12.1.0-dev.4",
     "previewColors": [
         "#ffffff",
         "#faf9f8",

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

@@ -3,7 +3,7 @@
     "name": "Fluent Main Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.2",
+    "version": "12.1.0-dev.4",
     "previewColors": [
         "#1F1F1F",
         "#292929",
@@ -554,17 +554,17 @@
                 "inverse-subtle": {
                     "name": "Inverse Subtle",
                     "type": "color",
-                    "value": "#ADADAD"
+                    "value": "#757575"
                 },
                 "inverse-subtle-hover": {
                     "name": "Inverse Subtle Hover",
                     "type": "color",
-                    "value": "#999999"
+                    "value": "#525252"
                 },
                 "inverse-subtle-active": {
                     "name": "Inverse Subtle Active",
                     "type": "color",
-                    "value": "#757575"
+                    "value": "#666666"
                 },
                 "inverse": {
                     "name": "Inverse",
@@ -574,22 +574,22 @@
                 "inverse-hover": {
                     "name": "Inverse Hover",
                     "type": "color",
-                    "value": "#ADADAD"
+                    "value": "#999999"
                 },
                 "inverse-active": {
                     "name": "Inverse Active",
                     "type": "color",
-                    "value": "#999999"
+                    "value": "#ADADAD"
                 },
                 "inverse-emphasis": {
                     "name": "Inverse Emphasis",
                     "type": "color",
-                    "value": "#525252"
+                    "value": "#666666"
                 },
                 "inverse-on-subtle": {
                     "name": "Inverse On Subtle",
                     "type": "color",
-                    "value": "#292929"
+                    "value": "white"
                 },
                 "on-inverse": {
                     "name": "On Inverse",

package/lib/swatches/fluent-main.json

@@ -3,7 +3,7 @@
     "name": "Fluent Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-fluent",
-    "version": "12.1.0-dev.2",
+    "version": "12.1.0-dev.4",
     "previewColors": [
         "#fafafa",
         "#ffffff",

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": "12.1.0-dev.2",
+  "version": "12.1.0-dev.4",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -55,12 +55,12 @@
   },
   "dependencies": {
     "@progress/kendo-svg-icons": "^4.5.0",
-    "@progress/kendo-theme-core": "12.1.0-dev.2",
-    "@progress/kendo-theme-utils": "12.1.0-dev.2"
+    "@progress/kendo-theme-core": "12.1.0-dev.4",
+    "@progress/kendo-theme-utils": "12.1.0-dev.4"
   },
   "directories": {
     "doc": "docs",
     "lib": "lib"
   },
-  "gitHead": "e99d3c1caaddd333f4d74beb7f2061382f0d2241"
+  "gitHead": "997d297f9d4fead6c717625cde73bae59c744884"
 }

package/scss/adaptive/_variables.scss

@@ -30,7 +30,7 @@ $kendo-adaptive-grid-sort-text: var( --kendo-adaptive-grid-sort-text, #{k-color(
 // Adaptive Scheduler
 $kendo-adaptive-scheduler-current-text: var( --kendo-adaptive-scheduler-current-text, #{k-color(primary)} ) !default;
 $kendo-adaptive-scheduler-base-text: var( --kendo-adaptive-scheduler-base-text, inherit ) !default;
-$kendo-adaptive-scheduler-subtle-text: var( --kendo-adaptive-scheduler-subtle-text, #{k-color(subtle)} ) !default;
+$kendo-adaptive-scheduler-subtle-text: var( --kendo-adaptive-scheduler-subtle-text, #{k-color(on-app-surface)} ) !default;
 
 @forward "@progress/kendo-theme-core/scss/components/adaptive/_variables.scss" with (
     $kendo-adaptive-bg: $kendo-adaptive-bg,

package/scss/calendar/_variables.scss

@@ -48,9 +48,6 @@ $kendo-calendar-header-min-width: calc(#{$kendo-calendar-cell-size} * 8)  !defau
 /// The background color of the calendar header.
 /// @group calendar
 $kendo-calendar-header-bg: var( --kendo-calendar-header-bg, k-color(surface) ) !default; // $kendo-component-header-bg
-/// The text color of the calendar header.
-/// @group calendar
-$kendo-calendar-header-text: var( --kendo-calendar-header-text, #{$kendo-calendar-text} ) !default; // $kendo-component-header-text
 /// The border color of the calendar header.
 /// @group calendar
 $kendo-calendar-header-border: var( --kendo-calendar-header-border, #{$kendo-calendar-border} ) !default; // $kendo-component-header-border
@@ -226,7 +223,7 @@ $kendo-calendar-navigation-item-height: var( --kendo-calendar-navigation-item-he
 $kendo-calendar-navigation-bg: var( --kendo-calendar-navigation-bg, k-color(surface) ) !default;
 /// The text color of the navigation in the infinite Calendar.
 /// @group calendar
-$kendo-calendar-navigation-text: var( --kendo-calendar-navigation-text, #{$kendo-calendar-header-text} ) !default;
+$kendo-calendar-navigation-text: var( --kendo-calendar-navigation-text, k-color(on-app-surface) ) !default;
 /// The border color of the navigation in the infinite Calendar.
 /// @group calendar
 $kendo-calendar-navigation-border: var( --kendo-calendar-navigation-border, #{$kendo-calendar-header-border} ) !default;
@@ -373,7 +370,6 @@ $kendo-calendar-sizes: (
     $kendo-calendar-header-padding-y: $kendo-calendar-header-padding-y,
     $kendo-calendar-header-border-width: $kendo-calendar-header-border-width,
     $kendo-calendar-header-bg: $kendo-calendar-header-bg,
-    $kendo-calendar-header-text: $kendo-calendar-header-text,
     $kendo-calendar-header-border: $kendo-calendar-header-border,
     $kendo-calendar-nav-gap: $kendo-calendar-nav-gap,
     $kendo-calendar-footer-padding-x: $kendo-calendar-footer-padding-x,

package/scss/card/_variables.scss

@@ -145,12 +145,9 @@ $kendo-card-subtitle-text: var( --kendo-card-subtitle-text, k-color(subtle) ) !d
 /// The maximum width of the Card image.
 /// @group card
 $kendo-card-img-max-width: 100px !default;
-/// The size of the Avatar in the Card.
-/// @group card
-$kendo-card-avatar-size: 3rem !default;
 /// The spacing between the Avatar and the text in the Card.
 /// @group card
-$kendo-card-avatar-spacing: $kendo-card-header-padding-x !default;
+$kendo-card-avatar-spacing: k-spacing(2) !default;
 
 /// The horizontal padding of the Card actions.
 /// @group card
@@ -233,7 +230,6 @@ $kendo-card-theme-colors: (
     $kendo-card-subtitle-line-height: $kendo-card-subtitle-line-height,
     $kendo-card-subtitle-text: $kendo-card-subtitle-text,
     $kendo-card-img-max-width: $kendo-card-img-max-width,
-    $kendo-card-avatar-size: $kendo-card-avatar-size,
     $kendo-card-avatar-spacing: $kendo-card-avatar-spacing,
     $kendo-card-actions-padding-x: $kendo-card-actions-padding-x,
     $kendo-card-actions-padding-y: $kendo-card-actions-padding-y,

package/scss/core/color-system/_swatch.scss

@@ -122,13 +122,13 @@ $_default-colors: (
     on-dark: map.get( $kendo-palette-neutral-gray, "white" ),
     dark-on-surface: map.get( $kendo-palette-neutral-gray, 12 ),
     // Inverse
-    inverse-subtle: map.get( $kendo-palette-neutral-gray, "black" ),
-    inverse-subtle-hover: map.get( $kendo-palette-neutral-gray, 15 ),
-    inverse-subtle-active: map.get( $kendo-palette-neutral-gray, 14 ),
+    inverse-subtle: map.get( $kendo-palette-neutral-gray, 12 ),
+    inverse-subtle-hover: map.get( $kendo-palette-neutral-gray, 10 ),
+    inverse-subtle-active: map.get( $kendo-palette-neutral-gray, 11 ),
     inverse: map.get( $kendo-palette-neutral-gray, 15 ),
     inverse-hover: map.get( $kendo-palette-neutral-gray, 13 ),
     inverse-active: map.get( $kendo-palette-neutral-gray, 14 ),
-    inverse-emphasis: map.get( $kendo-palette-neutral-gray, 12 ),
+    inverse-emphasis: map.get( $kendo-palette-neutral-gray, 11 ),
     inverse-on-subtle: map.get( $kendo-palette-neutral-gray, "white" ),
     on-inverse: map.get( $kendo-palette-neutral-gray, "white" ),
     inverse-on-surface: map.get( $kendo-palette-neutral-gray, 12 ),

package/scss/drawer/_variables.scss

@@ -45,7 +45,7 @@ $kendo-drawer-scrollbar-bg: var( --kendo-drawer-scrollbar-bg, k-color(base-subtl
 $kendo-drawer-scrollbar-radius: var( --kendo-drawer-scrollbar-radius, 20px ) !default;
 /// The hover color of the Drawer scrollbar.
 /// @group drawer
-$kendo-drawer-scrollbar-hover-color: var( --kendo-drawer-scrollbar-hover-color, color-mix(in srgb, k-color(on-app-surface) 60%, transparent) ) !default;
+$kendo-drawer-scrollbar-hover-color: var( --kendo-drawer-scrollbar-hover-color, $kendo-drawer-scrollbar-color ) !default;
 
 /// The horizontal padding of the Drawer items.
 /// @group drawer

package/scss/filter/_variables.scss

@@ -28,7 +28,7 @@ $kendo-filter-text: var( --kendo-filter-text, #{k-color(on-app-surface)} ) !defa
 $kendo-filter-preview-field-text: var( --kendo-filter-preview-field-text, #{k-color(primary)} ) !default;
 /// The text color of the Filter preview operator.
 /// @group filter
-$kendo-filter-preview-operator-text: var( --kendo-filter-preview-operator-text, #{k-color(subtle)} ) !default;
+$kendo-filter-preview-operator-text: var( --kendo-filter-preview-operator-text, #{k-color(on-app-surface)} ) !default;
 
 /// The background color of the line that connects the Filter items.
 /// @group filter

package/scss/gantt/_variables.scss

@@ -79,10 +79,10 @@ $kendo-gantt-milestone-selected-border: var(--kendo-gantt-milestone-selected-bor
 
 /// The background color of the Gantt summary.
 /// @group gantt
-$kendo-gantt-summary-bg: var(--kendo-gantt-summary-bg, k-color(dark-emphasis)) !default;
+$kendo-gantt-summary-bg: var(--kendo-gantt-summary-bg, k-color(inverse-subtle)) !default;
 /// The background color of the Gantt summary progress.
 /// @group gantt
-$kendo-gantt-summary-progress-bg: var(--kendo-gantt-summary-progress-bg, k-color(dark)) !default;
+$kendo-gantt-summary-progress-bg: var(--kendo-gantt-summary-progress-bg, k-color(inverse)) !default;
 /// The background color of the selected Gantt summary.
 /// @group gantt
 $kendo-gantt-summary-selected-bg: var(--kendo-gantt-summary-selected-bg, k-color(primary-emphasis)) !default;
@@ -101,19 +101,19 @@ $kendo-gantt-task-padding-x: var(--kendo-gantt-task-padding-x, #{k-spacing(2)})
 $kendo-gantt-task-padding-y: var(--kendo-gantt-task-padding-y, #{k-spacing(1)}) !default;
 /// The background color of the Gantt task.
 /// @group gantt
-$kendo-gantt-task-bg: var(--kendo-gantt-task-bg, #{k-color(subtle)}) !default;
+$kendo-gantt-task-bg: var(--kendo-gantt-task-bg, #{k-color(inverse-subtle)}) !default;
 /// The text color of the Gantt task.
 /// @group gantt
-$kendo-gantt-task-text: var(--kendo-gantt-task-text, #{k-color(app-surface)}) !default;
+$kendo-gantt-task-text: var(--kendo-gantt-task-text, #{k-color(on-inverse)}) !default;
 /// The border color of the Gantt task.
 /// @group gantt
 $kendo-gantt-task-border: var(--kendo-gantt-task-border, inherit) !default;
 /// The background color of the Gantt task progress.
 /// @group gantt
-$kendo-gantt-task-progress-bg: var(--kendo-gantt-task-progress-bg, #{k-color(on-app-surface)}) !default;
+$kendo-gantt-task-progress-bg: var(--kendo-gantt-task-progress-bg, #{k-color(inverse)}) !default;
 /// The background color of the hovered Gantt task progress.
 /// @group gantt
-$kendo-gantt-task-progress-hover-bg: var(--kendo-gantt-task-progress-hover-bg, #{k-color(on-app-surface)}) !default;
+$kendo-gantt-task-progress-hover-bg: var(--kendo-gantt-task-progress-hover-bg, #{k-color(inverse-hover)}) !default;
 /// The background color of selected the Gantt task.
 /// @group gantt
 $kendo-gantt-task-selected-bg: var(--kendo-gantt-task-selected-bg, #{k-color(primary-subtle-active)}) !default;

package/scss/orgchart/_variables.scss

@@ -136,7 +136,7 @@ $kendo-orgchart-card-body-border-color: var( --kendo-orgchart-card-body-border-c
 $kendo-orgchart-card-body-vbox-margin-x: var( --kendo-orgchart-card-body-vbox-margin-x, calc( #{$kendo-orgchart-spacer} - #{k-spacing(2)} ) ) !default;
 /// The min height of the OrgChart Card body title wrap.
 /// @group orgchart
-$kendo-orgchart-card-body-vbox-min-height: var( --kendo-orgchart-card-body-vbox-min-height, #{$kendo-card-avatar-size} ) !default;
+$kendo-orgchart-card-body-vbox-min-height: var( --kendo-orgchart-card-body-vbox-min-height, 3em ) !default;
 
 /// The size of the OrgChart connecting line.
 /// @group orgchart

package/scss/pdf-viewer/_variables.scss

@@ -118,10 +118,10 @@ $kendo-pdf-viewer-highlight-annotation-hover-border: var( --kendo-pdf-viewer-hig
 $kendo-pdf-viewer-free-text-annotation-border: var( --kendo-pdf-viewer-free-text-annotation-border, #{k-color(primary)} ) !default;
 /// The placeholder text color of the PDFViewer free text annotation.
 /// @group pdf-viewer
-$kendo-pdf-viewer-free-text-annotation-placeholder-text: var( --kendo-pdf-viewer-free-text-annotation-placeholder-text, rgba(124, 22, 27, 0.5) ) !default;
+$kendo-pdf-viewer-free-text-annotation-placeholder-text: var( --kendo-pdf-viewer-free-text-annotation-placeholder-text, k-color(primary-on-subtle) ) !default;
 /// The text color of the PDFViewer free text annotation.
 /// @group pdf-viewer
-$kendo-pdf-viewer-free-text-annotation-text: var( --kendo-pdf-viewer-free-text-annotation-text, rgba(124, 22, 27, 0.7) ) !default;
+$kendo-pdf-viewer-free-text-annotation-text: var( --kendo-pdf-viewer-free-text-annotation-text, k-color(primary-on-subtle) ) !default;
 
 @forward "@progress/kendo-theme-core/scss/components/pdf-viewer/_variables.scss" with (
     $kendo-pdf-viewer-border-width: $kendo-pdf-viewer-border-width,

package/scss/time-marker/_variables.scss

@@ -1,9 +1,11 @@
+@use "../core/_index.scss" as *;
+
 /// The border width of the current time indicator.
 /// @group time-marker
 $kendo-current-time-width: var( --kendo-current-time-width, 1px ) !default;
 /// The color of the current time indicator.
 /// @group time-marker
-$kendo-current-time-color: var( --kendo-current-time-color, #ff0000 ) !default;
+$kendo-current-time-color: var( --kendo-current-time-color, k-color(error-on-surface) ) !default;
 
 @forward "@progress/kendo-theme-core/scss/components/time-marker/_variables.scss" with (
     $kendo-current-time-width: $kendo-current-time-width,