@sage/design-tokens 7.1.2 → 7.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/css/frozenproduct/all.css +1 -1
  2. package/css/frozenproduct/large/components/tab.css +1 -1
  3. package/css/frozenproduct/small/components/tab.css +1 -1
  4. package/css/marketing/all.css +1 -1
  5. package/css/marketing/large/components/tab.css +1 -1
  6. package/css/marketing/small/components/tab.css +1 -1
  7. package/css/product/all.css +1 -1
  8. package/css/product/large/components/tab.css +1 -1
  9. package/css/product/small/components/tab.css +1 -1
  10. package/ios/frozenproduct/large/dark/components/tab.h +1 -1
  11. package/ios/frozenproduct/large/light/components/tab.h +1 -1
  12. package/ios/frozenproduct/small/dark/components/tab.h +1 -1
  13. package/ios/frozenproduct/small/light/components/tab.h +1 -1
  14. package/ios/marketing/large/dark/components/tab.h +1 -1
  15. package/ios/marketing/large/light/components/tab.h +1 -1
  16. package/ios/marketing/small/dark/components/tab.h +1 -1
  17. package/ios/marketing/small/light/components/tab.h +1 -1
  18. package/ios/product/large/dark/components/tab.h +1 -1
  19. package/ios/product/large/light/components/tab.h +1 -1
  20. package/ios/product/small/dark/components/tab.h +1 -1
  21. package/ios/product/small/light/components/tab.h +1 -1
  22. package/js/common/frozenproduct/large/dark/components/tab.js +2 -2
  23. package/js/common/frozenproduct/large/light/components/tab.js +2 -2
  24. package/js/common/frozenproduct/small/dark/components/tab.js +2 -2
  25. package/js/common/frozenproduct/small/light/components/tab.js +2 -2
  26. package/js/common/marketing/large/dark/components/tab.js +2 -2
  27. package/js/common/marketing/large/light/components/tab.js +2 -2
  28. package/js/common/marketing/small/dark/components/tab.js +2 -2
  29. package/js/common/marketing/small/light/components/tab.js +2 -2
  30. package/js/common/product/large/dark/components/tab.js +2 -2
  31. package/js/common/product/large/light/components/tab.js +2 -2
  32. package/js/common/product/small/dark/components/tab.js +2 -2
  33. package/js/common/product/small/light/components/tab.js +2 -2
  34. package/js/es6/frozenproduct/large/dark/components/tab.js +1 -1
  35. package/js/es6/frozenproduct/large/light/components/tab.js +1 -1
  36. package/js/es6/frozenproduct/small/dark/components/tab.js +1 -1
  37. package/js/es6/frozenproduct/small/light/components/tab.js +1 -1
  38. package/js/es6/marketing/large/dark/components/tab.js +1 -1
  39. package/js/es6/marketing/large/light/components/tab.js +1 -1
  40. package/js/es6/marketing/small/dark/components/tab.js +1 -1
  41. package/js/es6/marketing/small/light/components/tab.js +1 -1
  42. package/js/es6/product/large/dark/components/tab.js +1 -1
  43. package/js/es6/product/large/light/components/tab.js +1 -1
  44. package/js/es6/product/small/dark/components/tab.js +1 -1
  45. package/js/es6/product/small/light/components/tab.js +1 -1
  46. package/js/umd/frozenproduct/large/dark/components/tab.js +2 -2
  47. package/js/umd/frozenproduct/large/light/components/tab.js +2 -2
  48. package/js/umd/frozenproduct/small/dark/components/tab.js +2 -2
  49. package/js/umd/frozenproduct/small/light/components/tab.js +2 -2
  50. package/js/umd/marketing/large/dark/components/tab.js +2 -2
  51. package/js/umd/marketing/large/light/components/tab.js +2 -2
  52. package/js/umd/marketing/small/dark/components/tab.js +2 -2
  53. package/js/umd/marketing/small/light/components/tab.js +2 -2
  54. package/js/umd/product/large/dark/components/tab.js +2 -2
  55. package/js/umd/product/large/light/components/tab.js +2 -2
  56. package/js/umd/product/small/dark/components/tab.js +2 -2
  57. package/js/umd/product/small/light/components/tab.js +2 -2
  58. package/json/flat/frozenproduct/large/dark/components/tab.json +1 -1
  59. package/json/flat/frozenproduct/large/light/components/tab.json +1 -1
  60. package/json/flat/frozenproduct/small/dark/components/tab.json +1 -1
  61. package/json/flat/frozenproduct/small/light/components/tab.json +1 -1
  62. package/json/flat/marketing/large/dark/components/tab.json +1 -1
  63. package/json/flat/marketing/large/light/components/tab.json +1 -1
  64. package/json/flat/marketing/small/dark/components/tab.json +1 -1
  65. package/json/flat/marketing/small/light/components/tab.json +1 -1
  66. package/json/flat/product/large/dark/components/tab.json +1 -1
  67. package/json/flat/product/large/light/components/tab.json +1 -1
  68. package/json/flat/product/small/dark/components/tab.json +1 -1
  69. package/json/flat/product/small/light/components/tab.json +1 -1
  70. package/json/nested/frozenproduct/large/dark/components/tab.json +1 -1
  71. package/json/nested/frozenproduct/large/light/components/tab.json +1 -1
  72. package/json/nested/frozenproduct/small/dark/components/tab.json +1 -1
  73. package/json/nested/frozenproduct/small/light/components/tab.json +1 -1
  74. package/json/nested/marketing/large/dark/components/tab.json +1 -1
  75. package/json/nested/marketing/large/light/components/tab.json +1 -1
  76. package/json/nested/marketing/small/dark/components/tab.json +1 -1
  77. package/json/nested/marketing/small/light/components/tab.json +1 -1
  78. package/json/nested/product/large/dark/components/tab.json +1 -1
  79. package/json/nested/product/large/light/components/tab.json +1 -1
  80. package/json/nested/product/small/dark/components/tab.json +1 -1
  81. package/json/nested/product/small/light/components/tab.json +1 -1
  82. package/package.json +1 -1
  83. package/sage-design-tokens-7.1.3.tgz +0 -0
  84. package/scss/frozenproduct/large/components/button.scss +23 -23
  85. package/scss/frozenproduct/large/components/container.scss +9 -9
  86. package/scss/frozenproduct/large/components/form.scss +7 -7
  87. package/scss/frozenproduct/large/components/link.scss +2 -2
  88. package/scss/frozenproduct/large/components/nav.scss +3 -3
  89. package/scss/frozenproduct/large/components/page.scss +1 -1
  90. package/scss/frozenproduct/large/components/popover.scss +2 -2
  91. package/scss/frozenproduct/large/components/progress.scss +6 -6
  92. package/scss/frozenproduct/large/components/status.scss +3 -3
  93. package/scss/frozenproduct/large/components/tab.scss +7 -7
  94. package/scss/frozenproduct/large/components/table.scss +11 -11
  95. package/scss/frozenproduct/small/components/button.scss +23 -23
  96. package/scss/frozenproduct/small/components/container.scss +9 -9
  97. package/scss/frozenproduct/small/components/form.scss +7 -7
  98. package/scss/frozenproduct/small/components/link.scss +2 -2
  99. package/scss/frozenproduct/small/components/nav.scss +3 -3
  100. package/scss/frozenproduct/small/components/page.scss +1 -1
  101. package/scss/frozenproduct/small/components/popover.scss +2 -2
  102. package/scss/frozenproduct/small/components/progress.scss +6 -6
  103. package/scss/frozenproduct/small/components/status.scss +3 -3
  104. package/scss/frozenproduct/small/components/tab.scss +7 -7
  105. package/scss/frozenproduct/small/components/table.scss +11 -11
  106. package/scss/marketing/large/components/tab.scss +1 -1
  107. package/scss/marketing/small/components/tab.scss +1 -1
  108. package/scss/product/large/components/tab.scss +1 -1
  109. package/scss/product/small/components/button.scss +23 -23
  110. package/scss/product/small/components/container.scss +9 -9
  111. package/scss/product/small/components/form.scss +7 -7
  112. package/scss/product/small/components/link.scss +2 -2
  113. package/scss/product/small/components/nav.scss +3 -3
  114. package/scss/product/small/components/page.scss +1 -1
  115. package/scss/product/small/components/popover.scss +2 -2
  116. package/scss/product/small/components/progress.scss +6 -6
  117. package/scss/product/small/components/status.scss +3 -3
  118. package/scss/product/small/components/tab.scss +7 -7
  119. package/scss/product/small/components/table.scss +11 -11
  120. package/sage-design-tokens-7.1.2.tgz +0 -0
@@ -5,7 +5,6 @@
5
5
 
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
- $link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
9
8
  $link-typography-responsive-default-s: $global-typography-responsive-component-underlined-moderate-s; // Small Viewports: 14.81, Large Viewports: 13.79. Match token size to component size.
10
9
  $link-typography-responsive-default-m: $global-typography-responsive-component-underlined-moderate-m; // Small Viewports: 16, Large Viewports: 16. Match token size to component size.
11
10
  $link-typography-responsive-default-l: $global-typography-responsive-component-underlined-moderate-l; // Small Viewports: 17.28, Large Viewports: 18.56. Match token size to component size.
@@ -19,10 +18,11 @@ $link-typography-adaptive-heading-s: $global-typography-adaptive-component-under
19
18
  $link-typography-adaptive-heading-m: $global-typography-adaptive-component-underlined-firm-m;
20
19
  $link-typography-adaptive-heading-l: $global-typography-adaptive-component-underlined-firm-l;
21
20
  $link-color-destructive-label-default: $modes-color-interactive-danger-default-alt; // .
22
- $link-color-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
21
+ $link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
23
22
  $link-boxshadow-skiplink: $global-boxshadow-container-near;
24
23
  $link-color-destructive-label-hover: $modes-color-interactive-danger-hover-alt2;
25
24
  $link-color-typical-label-default: $modes-color-interactive-primary-default-alt;
25
+ $link-color-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
26
26
  $link-size-skiplink-m: $global-size-macro-m;
27
27
  $link-size-icon-m: $global-size-icon-m;
28
28
  $link-radius-link: $global-radius-interactive-xs; // Link (focus bg and bottom corners of focus underline)
@@ -6,7 +6,6 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $nav-color-bg-default: $modes-color-generic-bg-nought; // nav bar bg
9
- $nav-color-item-bg-active: $modes-color-interactive-monochrome-generic-active;
10
9
  $nav-color-item-bg-enabled: $modes-color-none;
11
10
  $nav-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
12
11
  $nav-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
@@ -20,17 +19,18 @@ $nav-typography-responsive-label-l: $global-typography-responsive-component-firm
20
19
  $nav-typography-responsive-default-s: $global-typography-responsive-component-moderate-s;
21
20
  $nav-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
22
21
  $nav-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
22
+ $nav-color-item-bg-active: $modes-color-interactive-monochrome-generic-active;
23
23
  $nav-color-item-bg-activealt: $modes-color-interactive-monochrome-generic-hover-alt;
24
24
  $nav-color-item-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
25
25
  $nav-color-item-label-activealt: $modes-color-interactive-monochrome-generic-with-hover;
26
- $nav-color-item-label-enabled: $modes-color-interactive-monochrome-generic-default;
27
26
  $nav-color-item-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
28
- $nav-color-item-label-alt: $modes-color-interactive-monochrome-generic-default-alt;
29
27
  $nav-color-menu-bg-default: $modes-color-generic-bg-faint; // menu (level 1) nav bg
30
28
  $nav-color-menu-bg-alt: $modes-color-generic-bg-delicate; // level 2 nav bg
31
29
  $nav-color-menu-bg-alt2: $modes-color-generic-bg-soft; // level 3 nav bg
32
30
  $nav-boxshadow-menu: $global-boxshadow-cleanedge-near; // Menu
33
31
  $nav-color-item-label-active: $modes-color-interactive-monochrome-generic-with-active;
32
+ $nav-color-item-label-enabled: $modes-color-interactive-monochrome-generic-default;
33
+ $nav-color-item-label-alt: $modes-color-interactive-monochrome-generic-default-alt;
34
34
  $nav-color-menu-border-default: $modes-color-generic-fg-delicate; // level 1 border
35
35
  $nav-radius-menu: $global-radius-interactive-m; // Drop list bottom corners, product popout list all corners
36
36
  $nav-radius-menuitem: $global-radius-interactive-s; // Menu (menu item state bg shape),
@@ -6,7 +6,6 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $page-color-bg-default: $modes-color-generic-backdrop-nought;
9
- $page-color-bg-alt: $modes-color-generic-backdrop-faint;
10
9
  $page-typography-responsive-h1: $global-typography-responsive-heading-l;
11
10
  $page-typography-responsive-h2: $global-typography-responsive-heading-m;
12
11
  $page-typography-responsive-h3: $global-typography-responsive-heading-s;
@@ -21,6 +20,7 @@ $page-typography-adaptive-h4: $global-typography-adaptive-subheading-l;
21
20
  $page-typography-adaptive-h5: $global-typography-adaptive-subheading-m;
22
21
  $page-typography-adaptive-p-typical: $global-typography-adaptive-body-s;
23
22
  $page-typography-adaptive-p-large: $global-typography-adaptive-body-s;
23
+ $page-color-bg-alt: $modes-color-generic-backdrop-faint;
24
24
  $page-color-text-alt: $modes-color-generic-content-moderate; // for subheadings etc
25
25
  $page-color-text-default: $modes-color-generic-content-harsh; // for headings, paragraph text etc
26
26
  $page-space-none: $global-space-none;
@@ -6,7 +6,6 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $popover-radius-none: $global-radius-none; // Navigation menu top corners
9
- $popover-color-bg-active: $modes-color-interactive-monochrome-generic-active; // previously action minor 850
10
9
  $popover-color-bg-default: $modes-color-generic-bg-nought; // REF'D IN FORM. Popover container bg
11
10
  $popover-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
12
11
  $popover-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
@@ -21,11 +20,11 @@ $popover-typography-responsive-default-s: $global-typography-responsive-componen
21
20
  $popover-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
22
21
  $popover-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
23
22
  $popover-boxshadow-container: $global-boxshadow-container-near; // REF'D IN FORM. Popover container for Button popover, Button split, (and Form calendar, color picker, dropdown)
23
+ $popover-color-bg-active: $modes-color-interactive-monochrome-generic-active; // previously action minor 850
24
24
  $popover-color-bg-activealt: $modes-color-interactive-monochrome-generic-hover-alt; // REF'D IN FORM.
25
25
  $popover-color-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt; // REF'D IN FORM.
26
26
  $popover-color-label-activealt: $modes-color-interactive-monochrome-generic-with-hover;
27
27
  $popover-color-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
28
- $popover-color-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
29
28
  $popover-color-submenu-bg-default: $modes-color-generic-bg-faint; // popover small screen submenu container bg
30
29
  $popover-size-icon-m: $global-size-icon-m;
31
30
  $popover-size-item-s: $global-size-macro-s; // REF'D IN FORM. Menu item min height.
@@ -53,3 +52,4 @@ $popover-space-submenu-x-m: $global-space-macro-xs; // Right left padding on sma
53
52
  $popover-space-submenu-x-l: $global-space-macro-xs; // Right left padding on small screen submenu popover container.
54
53
  $popover-color-label-active: $modes-color-interactive-monochrome-generic-with-active;
55
54
  $popover-color-label-disabled: $modes-color-interactive-inactive-content;
55
+ $popover-color-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
@@ -25,19 +25,13 @@ $progress-radius-skeleton-circle: $global-radius-circle; // Used to represent ci
25
25
  $progress-color-fg-ai: $modes-color-interactive-ai-default; // For progress ring in ai buttons
26
26
  $progress-color-fg-alt: $modes-color-status-positive-default;
27
27
  $progress-color-fg-caution: $modes-color-status-caution-default;
28
- $progress-color-fg-default: $modes-color-interactive-monochrome-generic-active;
29
28
  $progress-color-fg-error: $modes-color-status-negative-default;
30
29
  $progress-color-fg-info: $modes-color-status-info-default;
31
30
  $progress-color-datavis-fg-default: $modes-color-status-generic-default;
32
- $progress-color-loader-fg-default: $modes-color-interactive-monochrome-generic-active; // used for loader standard loader spinner
33
31
  $progress-color-loader-fg-error: $modes-color-status-negative-default;
34
32
  $progress-color-loader-fg-complete: $modes-color-status-positive-default;
35
- $progress-color-stepflow-bg-active: $modes-color-interactive-monochrome-generic-active;
36
33
  $progress-color-stepflow-bg-complete: $modes-color-status-positive-default;
37
- $progress-color-stepflow-border-active-outer: $modes-color-interactive-monochrome-generic-active;
38
- $progress-color-stepindicator-bg-active: $modes-color-interactive-monochrome-generic-active;
39
34
  $progress-color-stepindicator-bg-complete: $modes-color-status-positive-default;
40
- $progress-color-stepindicator-border-active-outer: $modes-color-interactive-monochrome-generic-active;
41
35
  $progress-color-stepindicator-border-success: $modes-color-status-positive-default;
42
36
  $progress-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
43
37
  $progress-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
@@ -53,14 +47,20 @@ $progress-typography-responsive-default-m: $global-typography-responsive-compone
53
47
  $progress-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
54
48
  $progress-color-bg-default: $modes-color-interactive-progress-bg;
55
49
  $progress-color-fg-alt2: $modes-color-generic-content-firm;
50
+ $progress-color-fg-default: $modes-color-interactive-monochrome-generic-active;
56
51
  $progress-color-label-alt: $modes-color-generic-content-firm;
57
52
  $progress-color-label-default: $modes-color-generic-content-harsh;
58
53
  $progress-color-loader-bg-default: $modes-color-interactive-progress-bg;
59
54
  $progress-color-loader-bg-alt: $modes-color-interactive-progress-bg-alt; // used for inverse loader bgs
55
+ $progress-color-loader-fg-default: $modes-color-interactive-monochrome-generic-active; // used for loader standard loader spinner
56
+ $progress-color-stepflow-bg-active: $modes-color-interactive-monochrome-generic-active;
60
57
  $progress-color-stepflow-bg-default: $modes-color-generic-fg-nought;
61
58
  $progress-color-stepflow-border-active-inner: $modes-color-generic-fg-nought;
59
+ $progress-color-stepflow-border-active-outer: $modes-color-interactive-monochrome-generic-active;
62
60
  $progress-color-stepflow-label-alt: $modes-color-generic-content-firm;
63
61
  $progress-color-stepflow-label-default: $modes-color-generic-content-harsh;
62
+ $progress-color-stepindicator-bg-active: $modes-color-interactive-monochrome-generic-active;
63
+ $progress-color-stepindicator-border-active-outer: $modes-color-interactive-monochrome-generic-active;
64
64
  $progress-color-stepindicator-label-default: $modes-color-generic-content-harsh;
65
65
  $progress-size-bar-s: $global-size-micro-xs; // S loader bar
66
66
  $progress-size-bar-m: $global-size-micro-m; // M progress tracker bar, M loader bar
@@ -7,6 +7,7 @@
7
7
 
8
8
  $status-radius-none: $global-radius-none; // Pill (embedded element inner corners)
9
9
  $status-color-none: $modes-color-none; // transparent override used for hiding colors when needed.
10
+ $status-color-message-global-callout-bg-default: $modes-color-status-callout-default-alt; // Global message bg
10
11
  $status-color-message-global-info-bg-default: $modes-color-status-info-default-alt; // Global message bg
11
12
  $status-color-message-global-info-icon: $modes-color-status-info-default; // Icon on tinted bgs
12
13
  $status-color-message-global-warning-bg-default: $modes-color-status-caution-default-alt; // Global message bg
@@ -14,6 +15,7 @@ $status-color-message-global-warning-icon: $modes-color-status-caution-default;
14
15
  $status-color-message-contextual-bg: $modes-color-generic-bg-nought;
15
16
  $status-color-message-contextual-icon: $modes-color-generic-bg-nought; // decorative icon on standard contextual messages
16
17
  $status-color-message-contextual-ai-bg-alt: $modes-color-status-neutral-default-alt;
18
+ $status-color-message-contextual-callout-bg-alt: $modes-color-status-callout-default-alt; // Subtle message bg
17
19
  $status-color-message-contextual-error-bg-default: $modes-color-status-negative-default;
18
20
  $status-color-message-contextual-error-bg-alt: $modes-color-status-negative-default-alt; // Subtle message bg
19
21
  $status-color-message-contextual-error-border-default: $modes-color-status-negative-default;
@@ -64,13 +66,12 @@ $status-typography-responsive-heading-s: $global-typography-responsive-component
64
66
  $status-typography-responsive-heading-m: $global-typography-responsive-component-firm-m;
65
67
  $status-typography-responsive-heading-l: $global-typography-responsive-component-firm-l;
66
68
  $status-color-message-global-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
67
- $status-color-message-global-callout-bg-default: $modes-color-status-callout-default-alt; // Global message bg
69
+ $status-color-message-global-callout-bg-hover: $modes-color-status-callout-hover-alt; // global message bg hover
68
70
  $status-color-message-global-info-bg-hover: $modes-color-status-info-hover-alt;
69
71
  $status-color-message-global-warning-bg-hover: $modes-color-status-caution-hover-alt;
70
72
  $status-color-message-contextual-text: $modes-color-status-content-with-hover-alt; // Message text.
71
73
  $status-color-message-contextual-ai-bg-default: $modes-color-status-ai-default-alt;
72
74
  $status-color-message-contextual-ai-border-default: $modes-color-status-ai-default-alt;
73
- $status-color-message-contextual-callout-bg-alt: $modes-color-status-callout-default-alt; // Subtle message bg
74
75
  $status-color-pill-error-bg-alt-hover: $modes-color-status-negative-hover-alt;
75
76
  $status-color-pill-error-bg-hover: $modes-color-status-negative-hover;
76
77
  $status-color-pill-info-bg-alt-hover: $modes-color-status-info-hover-alt;
@@ -87,7 +88,6 @@ $status-color-rating-bg-default-alt: $modes-color-status-reviews-default-alt;
87
88
  $status-color-rating-bg-hover: $modes-color-status-reviews-hover;
88
89
  $status-color-rating-border-default: $modes-color-status-reviews-default;
89
90
  $status-color-message-global-label-default: $modes-color-status-content-with-default-alt;
90
- $status-color-message-global-callout-bg-hover: $modes-color-status-callout-hover-alt; // global message bg hover
91
91
  $status-color-message-global-callout-icon: $modes-color-status-content-with-default-alt; // Icon on tinted bgs
92
92
  $status-color-message-contextual-callout-icon: $modes-color-status-content-with-default-alt;
93
93
  $status-color-pill-label-default: $modes-color-status-content-with-default;
@@ -6,9 +6,6 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $tab-color-bg-enabled: $modes-color-none;
9
- $tab-color-border-active: $modes-color-interactive-monochrome-generic-active;
10
- $tab-color-label-active: $modes-color-interactive-monochrome-generic-active;
11
- $tab-color-icon-active: $modes-color-interactive-monochrome-generic-active;
12
9
  $tab-color-navigation-bg-default: $modes-color-generic-bg-nought; // For previous/next buttons on responsive tabs
13
10
  $tab-color-validation-border-warning: $modes-color-status-caution-default;
14
11
  $tab-color-validation-border-error: $modes-color-status-negative-default;
@@ -22,12 +19,11 @@ $tab-typography-responsive-label-s: $global-typography-responsive-component-firm
22
19
  $tab-typography-responsive-label-m: $global-typography-responsive-component-firm-m;
23
20
  $tab-typography-responsive-label-l: $global-typography-responsive-component-firm-l;
24
21
  $tab-color-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt; // For anchor nav, not tab.
25
- $tab-color-icon-enabled: $modes-color-interactive-monochrome-generic-default-alt;
22
+ $tab-color-border-active: $modes-color-interactive-monochrome-generic-active;
26
23
  $tab-color-icon-hover: $modes-color-interactive-monochrome-generic-with-hover;
27
- $tab-color-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
24
+ $tab-color-label-active: $modes-color-interactive-monochrome-generic-active;
25
+ $tab-color-icon-active: $modes-color-interactive-monochrome-generic-active;
28
26
  $tab-color-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
29
- $tab-color-validation-label-error: $modes-color-interactive-monochrome-generic-default-alt;
30
- $tab-color-validation-label-warning: $modes-color-interactive-monochrome-generic-default-alt;
31
27
  $tab-size-m: $global-size-macro-m; // Anchor nav, M Tab
32
28
  $tab-size-l: $global-size-macro-l; // L tab
33
29
  $tab-size-shadow-arrow: $global-size-micro-m; // Shadow width for linear gradient shadow on repsonsive tab arrows.
@@ -46,6 +42,10 @@ $tab-space-y-l: $global-space-micro-xxl; // Top bottom padding in Tab.
46
42
  $tab-color-bg-active: $modes-color-interactive-monochrome-generic-with-active;
47
43
  $tab-color-border-enabled: $modes-color-generic-fg-delicate;
48
44
  $tab-color-border-hover: $modes-color-generic-fg-moderate;
45
+ $tab-color-icon-enabled: $modes-color-interactive-monochrome-generic-default-alt;
46
+ $tab-color-label-enabled: $modes-color-interactive-monochrome-generic-default;
47
+ $tab-color-validation-label-error: $modes-color-interactive-monochrome-generic-default-alt;
48
+ $tab-color-validation-label-warning: $modes-color-interactive-monochrome-generic-default-alt;
49
49
  $tab-radius-m: $global-radius-interactive-m; // Tab horizontal - top corners. Tab vertical - left corners.
50
50
  $tab-radius-l: $global-radius-interactive-m; // Tab horizontal - top corners. Tab vertical - left corners.
51
51
  $tab-radius-baseline-m: $global-radius-interactive-xxs;
@@ -6,7 +6,6 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $table-color-header-subtle-bg-default: $modes-color-none;
9
- $table-color-row-bg-active: $modes-color-interactive-monochrome-generic-active;
10
9
  $table-color-row-bg-default: $modes-color-generic-bg-nought;
11
10
  $table-color-row-label-hover: $modes-color-generic-content-extreme;
12
11
  $table-typography-adaptive-heading-s: $global-typography-adaptive-component-firm-s;
@@ -27,30 +26,31 @@ $table-typography-responsive-default-l: $global-typography-responsive-component-
27
26
  $table-typography-responsive-label-s: $global-typography-responsive-component-firm-s;
28
27
  $table-typography-responsive-label-m: $global-typography-responsive-component-firm-m;
29
28
  $table-typography-responsive-label-l: $global-typography-responsive-component-firm-l;
30
- $table-color-header-subtle-bg-alt: $modes-color-interactive-monochrome-subtle-default; // header alt
31
- $table-color-header-subtle-bg-hover: $modes-color-interactive-monochrome-generic-hover;
32
- $table-color-header-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
33
- $table-color-header-subtle-label-hover: $modes-color-interactive-monochrome-generic-default;
34
- $table-color-header-harsh-bg-alt: $modes-color-interactive-monochrome-generic-default-alt; // header alt
35
- $table-color-header-harsh-bg-default: $modes-color-interactive-monochrome-generic-default;
36
- $table-color-header-harsh-bg-hover: $modes-color-interactive-monochrome-generic-hover;
37
- $table-color-header-harsh-border-default: $modes-color-interactive-monochrome-subtle-default-alt;
38
- $table-color-header-harsh-label-hover: $modes-color-interactive-monochrome-generic-default;
39
29
  $table-color-row-bg-activated: $modes-color-interactive-primary-default;
30
+ $table-color-row-bg-active: $modes-color-interactive-monochrome-generic-active;
40
31
  $table-color-row-bg-alt: $modes-color-generic-bg-delicate; // Zebra stripes
41
32
  $table-color-row-bg-alt2: $modes-color-generic-bg-soft; // Zebra stripes combined with child rows.
42
33
  $table-color-row-bg-alt3: $modes-color-generic-bg-faint; // Child rows.
43
34
  $table-color-row-bg-hover: $modes-color-generic-bg-soft;
44
35
  $table-color-row-label-default: $modes-color-generic-content-harsh;
45
36
  $table-color-footer-bg-default: $modes-color-generic-bg-soft;
46
- $table-color-footer-label-default: $modes-color-interactive-monochrome-generic-default;
47
37
  $table-boxshadow-parentrow: $global-boxshadow-container-far;
38
+ $table-color-header-subtle-bg-alt: $modes-color-interactive-monochrome-subtle-default; // header alt
39
+ $table-color-header-subtle-bg-hover: $modes-color-interactive-monochrome-generic-hover;
48
40
  $table-color-header-subtle-border-default: $modes-color-generic-fg-delicate; // Header borders
41
+ $table-color-header-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
42
+ $table-color-header-subtle-label-hover: $modes-color-interactive-monochrome-generic-default;
43
+ $table-color-header-harsh-bg-alt: $modes-color-interactive-monochrome-generic-default-alt; // header alt
44
+ $table-color-header-harsh-bg-default: $modes-color-interactive-monochrome-generic-default;
45
+ $table-color-header-harsh-bg-hover: $modes-color-interactive-monochrome-generic-hover;
46
+ $table-color-header-harsh-border-default: $modes-color-interactive-monochrome-subtle-default-alt;
49
47
  $table-color-header-harsh-label-default: $modes-color-interactive-monochrome-generic-with-default;
48
+ $table-color-header-harsh-label-hover: $modes-color-interactive-monochrome-generic-default;
50
49
  $table-color-row-border-default: $modes-color-generic-fg-delicate;
51
50
  $table-color-row-label-activated: $modes-color-interactive-monochrome-generic-with-active;
52
51
  $table-color-row-label-active: $modes-color-interactive-monochrome-generic-with-active;
53
52
  $table-color-footer-border-default: $modes-color-generic-fg-delicate; // Header borders
53
+ $table-color-footer-label-default: $modes-color-interactive-monochrome-generic-default;
54
54
  $table-radius-container: $global-radius-container-m; // Table (parent container)
55
55
  $table-borderwidth-thin: $global-borderwidth-xs; // Table border
56
56
  $table-borderwidth-thick: $global-borderwidth-s; // header border for subtle
@@ -22,6 +22,9 @@ $button-color-ai-border-hover: $modes-color-interactive-ai-default;
22
22
  $button-color-destructive-primary-bg-enabled: $modes-color-interactive-danger-default;
23
23
  $button-color-destructive-secondary-border-enabled: $modes-color-interactive-danger-default;
24
24
  $button-color-destructive-secondary-label-enabled: $modes-color-interactive-danger-default;
25
+ $button-color-typical-secondary-border-active: $modes-color-interactive-monochrome-generic-active;
26
+ $button-color-typical-tertiary-border-active: $modes-color-interactive-monochrome-generic-active;
27
+ $button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-generic-active;
25
28
  $button-typography-adaptive-primary-s: $global-typography-adaptive-component-firm-s;
26
29
  $button-typography-adaptive-primary-m: $global-typography-adaptive-component-firm-m;
27
30
  $button-typography-adaptive-primary-l: $global-typography-adaptive-component-firm-l;
@@ -46,24 +49,34 @@ $button-typography-responsive-tertiary-l: $global-typography-responsive-componen
46
49
  $button-typography-responsive-subtle-s: $global-typography-responsive-component-firm-s;
47
50
  $button-typography-responsive-subtle-m: $global-typography-responsive-component-firm-m;
48
51
  $button-typography-responsive-subtle-l: $global-typography-responsive-component-firm-l;
52
+ $button-color-ai-label-enabled: $modes-color-interactive-monochrome-generic-default;
49
53
  $button-color-ai-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
50
54
  $button-color-destructive-primary-bg-hover: $modes-color-interactive-danger-hover;
51
55
  $button-color-destructive-secondary-border-hover: $modes-color-interactive-danger-hover;
52
56
  $button-color-destructive-secondary-label-hover: $modes-color-interactive-danger-hover;
53
57
  $button-color-typical-primary-bg-enabled: $modes-color-interactive-primary-default;
54
58
  $button-color-typical-secondary-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
55
- $button-color-typical-secondary-border-active: $modes-color-interactive-monochrome-generic-active;
59
+ $button-color-typical-secondary-border-enabled: $modes-color-interactive-monochrome-generic-default;
60
+ $button-color-typical-secondary-border-hover: $modes-color-interactive-monochrome-generic-default;
61
+ $button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-generic-default;
56
62
  $button-color-typical-secondary-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
57
63
  $button-color-typical-subtle-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
64
+ $button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-generic-default;
58
65
  $button-color-typical-subtle-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
59
66
  $button-color-typical-tertiary-bg-enabled: $button-color-none;
60
67
  $button-color-typical-tertiary-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
61
- $button-color-typical-tertiary-border-active: $modes-color-interactive-monochrome-generic-active;
68
+ $button-color-typical-tertiary-border-enabled: $modes-color-interactive-monochrome-generic-default-alt2;
69
+ $button-color-typical-tertiary-border-hover: $modes-color-interactive-monochrome-generic-default;
70
+ $button-color-typical-tertiary-label-enabled: $modes-color-interactive-monochrome-generic-default;
62
71
  $button-color-typical-tertiary-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
63
- $button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-generic-active;
64
72
  $button-color-typical-toggle-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
73
+ $button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-generic-default;
74
+ $button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
65
75
  $button-color-typical-toggle-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
66
76
  $button-color-video-bg-blur: $modes-color-interactive-monochrome-generic-hover-alt;
77
+ $button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-generic-default;
78
+ $button-color-video-primary-label-hover: $modes-color-interactive-monochrome-generic-default;
79
+ $button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-generic-default;
67
80
  $button-size-split: $global-size-micro-xxs; // Split button (divider width)
68
81
  $button-size-s: $global-size-macro-s; // min-height on S Buttons
69
82
  $button-size-m: $global-size-macro-m; // min-height on M Buttons
@@ -153,8 +166,8 @@ $button-space-toggle-container-y-l: $global-space-micro-s; // Vertical padding
153
166
  $button-space-video-x-s: $global-space-micro-xs; // Left padding on play icon in video button
154
167
  $button-space-video-x-m: $global-space-micro-xs; // Left padding on play icon in video button
155
168
  $button-space-video-x-l: $global-space-micro-xs; // Left padding on play icon in video button
169
+ $button-color-ai-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
156
170
  $button-color-ai-label-disabled: $modes-color-interactive-inactive-content;
157
- $button-color-ai-label-enabled: $modes-color-interactive-monochrome-generic-default;
158
171
  $button-color-destructive-primary-label-disabled: $modes-color-interactive-inactive-content-alt;
159
172
  $button-color-destructive-primary-label-enabled: $modes-color-interactive-danger-with-default;
160
173
  $button-color-destructive-primary-label-hover: $modes-color-interactive-danger-with-default;
@@ -167,30 +180,24 @@ $button-color-typical-primary-label-active: $modes-color-interactive-primary-wit
167
180
  $button-color-typical-primary-label-disabled: $modes-color-interactive-inactive-content-alt;
168
181
  $button-color-typical-primary-label-enabled: $modes-color-interactive-primary-with-default;
169
182
  $button-color-typical-primary-label-hover: $modes-color-interactive-primary-with-default;
170
- $button-color-typical-secondary-border-enabled: $modes-color-interactive-monochrome-generic-default;
171
- $button-color-typical-secondary-border-hover: $modes-color-interactive-monochrome-generic-default;
183
+ $button-color-typical-secondary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
184
+ $button-color-typical-secondary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
172
185
  $button-color-typical-secondary-label-disabled: $modes-color-interactive-inactive-content;
173
- $button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-generic-default;
186
+ $button-color-typical-subtle-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
187
+ $button-color-typical-subtle-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
174
188
  $button-color-typical-subtle-label-disabled: $modes-color-interactive-inactive-content;
175
- $button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-generic-default;
176
- $button-color-typical-tertiary-border-enabled: $modes-color-interactive-monochrome-generic-default-alt2;
177
- $button-color-typical-tertiary-border-hover: $modes-color-interactive-monochrome-generic-default;
189
+ $button-color-typical-tertiary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
190
+ $button-color-typical-tertiary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
178
191
  $button-color-typical-tertiary-label-disabled: $modes-color-interactive-inactive-content;
179
- $button-color-typical-tertiary-label-enabled: $modes-color-interactive-monochrome-generic-default;
180
192
  $button-color-typical-toggle-label-active-disabled: $modes-color-interactive-inactive-content-alt;
181
- $button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-generic-default;
182
193
  $button-color-typical-toggle-label-active: $modes-color-interactive-monochrome-generic-with-active;
183
194
  $button-color-typical-toggle-label-disabled: $modes-color-interactive-inactive-content;
184
- $button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
185
195
  $button-color-video-primary-bg-enabled: $modes-color-interactive-monochrome-generic-with-default;
186
196
  $button-color-video-primary-bg-hover: $modes-color-interactive-monochrome-generic-with-default;
187
- $button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-generic-default;
188
- $button-color-video-primary-label-hover: $modes-color-interactive-monochrome-generic-default;
189
197
  $button-color-video-secondary-bg-hover: $modes-color-interactive-monochrome-generic-with-default;
190
198
  $button-color-video-secondary-border-enabled: $modes-color-interactive-monochrome-generic-with-default;
191
199
  $button-color-video-secondary-border-hover: $modes-color-interactive-monochrome-generic-with-default;
192
200
  $button-color-video-secondary-label-enabled: $modes-color-interactive-monochrome-generic-with-default;
193
- $button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-generic-default;
194
201
  $button-radius-s: $global-radius-interactive-l; // Buttons S (typical and destructive, and inc bar, split and multi), Button toggle M (parent container)
195
202
  $button-radius-m: $global-radius-interactive-xl; // Buttons M (typical and destructive, and inc bar, split and multi), Button toggle L (parent container), Button toggle M (parent container)
196
203
  $button-radius-l: $global-radius-interactive-xxl; // Buttons L (typical and destructive, and inc bar, split and multi), Button toggle L (parent container)
@@ -212,17 +219,10 @@ $button-borderwidth-secondary: $global-borderwidth-s; // Secondary button.
212
219
  $button-borderwidth-tertiary: $global-borderwidth-xs; // tertiary button border
213
220
  $button-borderwidth-togglecontainer: $global-borderwidth-xs; // Toggle container
214
221
  $button-color-ai-border-disabled: $modes-color-interactive-inactive-default;
215
- $button-color-ai-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
216
222
  $button-color-destructive-primary-bg-disabled: $modes-color-interactive-inactive-default;
217
223
  $button-color-destructive-secondary-border-disabled: $modes-color-interactive-inactive-default;
218
224
  $button-color-typical-primary-bg-disabled: $modes-color-interactive-inactive-default;
219
- $button-color-typical-secondary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
220
225
  $button-color-typical-secondary-border-disabled: $modes-color-interactive-inactive-default;
221
- $button-color-typical-secondary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
222
- $button-color-typical-subtle-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
223
- $button-color-typical-subtle-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
224
- $button-color-typical-tertiary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
225
226
  $button-color-typical-tertiary-bg-active-disabled: $modes-color-interactive-inactive-default;
226
227
  $button-color-typical-tertiary-border-disabled: $modes-color-interactive-inactive-default;
227
- $button-color-typical-tertiary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
228
228
  $button-color-typical-toggle-bg-active-disabled: $modes-color-interactive-inactive-default;
@@ -12,15 +12,20 @@ $container-radius-blockquote-bar: $global-radius-circle; // radius for blockquot
12
12
  $container-radius-scrollbar: $global-radius-circle; // Scrollbar
13
13
  $container-opacity-carousel-hidden: $modes-color-modifiers-input-disabled-fg; // opacity applied to next and previous carousel slides
14
14
  $container-color-standard-bg-default: $modes-color-generic-bg-nought;
15
+ $container-color-standard-border-active: $modes-color-interactive-monochrome-generic-active;
15
16
  $container-color-ai-borderhorizontal: $modes-color-status-ai-default-horizontal; // top and bottom border for AI dialog component
16
17
  $container-color-ai-bordervertical: $modes-color-status-ai-default-vertical; // left and right border for dialog and insight bubbles.
17
18
  $container-color-ai-nudge-border-ai-horizontal: $modes-color-status-ai-default-horizontal; // top and bottom border for AI nudge message component
18
19
  $container-color-ai-nudge-border-ai-vertical: $modes-color-status-ai-default-vertical; // left and right border for AI nudge message component
19
20
  $container-color-interactive-detailedicon-bg: $modes-color-custom-default; //
20
21
  $container-color-interactive-bg-footer-activated: $modes-color-status-positive-default; //
22
+ $container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-generic-active;
21
23
  $container-color-interactive-border-activated: $modes-color-status-positive-default;
22
24
  $container-color-interactive-bg-footer-default: $modes-color-generic-bg-nought; // tile footer bg color
23
25
  $container-color-interactive-bg-enabled: $modes-color-generic-bg-nought;
26
+ $container-color-interactive-border-active: $modes-color-interactive-monochrome-generic-active;
27
+ $container-color-interactive-icon-active: $modes-color-interactive-monochrome-generic-active; // Active chevron for any accordion.
28
+ $container-color-interactive-text-active: $modes-color-interactive-monochrome-generic-active; // Active label for any accordion.
24
29
  $container-typography-adaptive-heading-m: $global-typography-adaptive-heading-s; // Accordion, Subscription tile, Tile select and generic tile or card headings
25
30
  $container-typography-adaptive-heading-l: $global-typography-adaptive-heading-m; // Dialog, drawer and sidebar headings
26
31
  $container-typography-adaptive-subheading-m: $global-typography-adaptive-subheading-m; // Accordion subheading, Step flow subheading, tile select subheading, dialog, drawer and sidebar subheading
@@ -41,18 +46,17 @@ $container-typography-responsive-paragraph-m: $global-typography-responsive-comp
41
46
  $container-typography-responsive-paragraph-l: $global-typography-responsive-component-moderate-l;
42
47
  $container-color-standard-bg-alt: $modes-color-generic-bg-faint;
43
48
  $container-color-standard-bg-footer-default: $modes-color-generic-bg-faint; // tile footer bg color
44
- $container-color-standard-border-active: $modes-color-interactive-monochrome-generic-active;
45
49
  $container-color-standard-dimmer: $modes-color-interactive-inactive-mask; // dimmed mask for dialogs
46
50
  $container-color-standard-text-alt: $modes-color-generic-content-moderate; // for subheadings etc
47
51
  $container-color-standard-text-default: $modes-color-generic-content-harsh; // for headings, paragraph text etc
48
52
  $container-color-scrollbar-bg-default: $modes-color-generic-bg-faint;
49
- $container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-generic-active;
50
53
  $container-color-interactive-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt; // Used for accordion hover backgrounds
51
- $container-color-interactive-border-active: $modes-color-interactive-monochrome-generic-active;
52
- $container-color-interactive-icon-active: $modes-color-interactive-monochrome-generic-active; // Active chevron for any accordion.
53
- $container-color-interactive-text-active: $modes-color-interactive-monochrome-generic-active; // Active label for any accordion.
54
+ $container-color-interactive-icon-enabled: $modes-color-interactive-monochrome-generic-default; // Enabled chevron for any accordion.
55
+ $container-color-interactive-icon-alt-enabled: $modes-color-interactive-monochrome-generic-default-alt; // Enabled label for subtle accordion.
56
+ $container-color-interactive-icon-hover: $modes-color-interactive-monochrome-generic-default; // Hover chevron for any accordion.
54
57
  $container-color-interactive-text-enabled: $modes-color-generic-content-harsh; // Enabled label for standard accordion.
55
58
  $container-color-interactive-text-alt-enabled: $modes-color-generic-content-moderate; // Enabled label for subtle accordion.
59
+ $container-color-interactive-text-hover: $modes-color-interactive-monochrome-generic-default; // Hover label for any accordion.
56
60
  $container-color-blockquote-border: $modes-color-interactive-primary-default;
57
61
  $container-boxshadow-card-enabled: $global-boxshadow-interactive-enabled; // Card (enabled)
58
62
  $container-boxshadow-card-hover: $global-boxshadow-interactive-hover; // Card (hover state)
@@ -72,13 +76,9 @@ $container-color-interactive-bg-disabled: $modes-color-interactive-inactive-defa
72
76
  $container-color-interactive-border-alt: $modes-color-generic-fg-delicate; // Link preview.
73
77
  $container-color-interactive-border-inactive: $modes-color-generic-fg-soft;
74
78
  $container-color-interactive-border-enabled: $modes-color-generic-fg-moderate;
75
- $container-color-interactive-icon-enabled: $modes-color-interactive-monochrome-generic-default; // Enabled chevron for any accordion.
76
- $container-color-interactive-icon-alt-enabled: $modes-color-interactive-monochrome-generic-default-alt; // Enabled label for subtle accordion.
77
- $container-color-interactive-icon-hover: $modes-color-interactive-monochrome-generic-default; // Hover chevron for any accordion.
78
79
  $container-color-interactive-label-footer-active: $modes-color-interactive-monochrome-generic-with-active;
79
80
  $container-color-interactive-label-footer-activated: $modes-color-interactive-monochrome-generic-with-active;
80
81
  $container-color-interactive-text-disabled: $modes-color-interactive-inactive-content;
81
- $container-color-interactive-text-hover: $modes-color-interactive-monochrome-generic-default; // Hover label for any accordion.
82
82
  $container-size-none: $global-size-none;
83
83
  $container-size-accordionstandard-chevron: $global-size-icon-m; // Accordion chevron container
84
84
  $container-size-quotebar-width: $global-size-micro-m; // block quote bar width
@@ -13,7 +13,10 @@ $form-radius-radio: $global-radius-circle; // Radio button
13
13
  $form-radius-switch: $global-radius-circle; // Switch container and handle
14
14
  $form-radius-calendar-none: $global-radius-none; // Calendar (start and end duration)
15
15
  $form-radius-calendar-date: $global-radius-circle; // Calendar date (hover & selected),
16
+ $form-color-calendar-bg-active: $modes-color-interactive-monochrome-generic-active;
17
+ $form-color-calendar-border-duration: $modes-color-interactive-monochrome-generic-active;
16
18
  $form-color-labelset-label-required: $modes-color-interactive-danger-default;
19
+ $form-color-switch-bg-active: $modes-color-interactive-monochrome-generic-active;
17
20
  $form-color-validation-border-error: $modes-color-status-negative-default;
18
21
  $form-color-validation-bar-error: $modes-color-status-negative-default; // error bar to left of inputs
19
22
  $form-color-validation-bar-warning: $modes-color-status-caution-default; // warning bar to left of inputs
@@ -32,10 +35,10 @@ $form-typography-responsive-label-l: $global-typography-responsive-component-fir
32
35
  $form-typography-responsive-default-s: $global-typography-responsive-component-moderate-s;
33
36
  $form-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
34
37
  $form-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
35
- $form-color-calendar-bg-active: $modes-color-interactive-monochrome-generic-active;
36
38
  $form-color-calendar-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
37
- $form-color-calendar-border-duration: $modes-color-interactive-monochrome-generic-active;
38
39
  $form-color-calendar-text-hover: $modes-color-interactive-monochrome-generic-with-hover;
40
+ $form-color-dropdown-label-alt: $modes-color-interactive-monochrome-generic-default;
41
+ $form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
39
42
  $form-color-dropdown-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
40
43
  $form-color-typical-bg-default: $modes-color-interactive-data-entry-default;
41
44
  $form-color-typical-bg-enabled: $modes-color-interactive-data-entry-default;
@@ -44,8 +47,9 @@ $form-color-typical-icon-active: $modes-color-interactive-data-entry-with-active
44
47
  $form-color-typical-icon-hover: $modes-color-interactive-data-entry-with-hover;
45
48
  $form-color-typical-text-hover: $modes-color-interactive-data-entry-with-hover; // text hover state when dragging a file over file input
46
49
  $form-color-typical-text-read-only: $modes-color-generic-content-harsh;
47
- $form-color-switch-bg-active: $modes-color-interactive-monochrome-generic-active;
48
50
  $form-color-switch-bg-enabled: $modes-color-interactive-data-entry-default; // for switch
51
+ $form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
52
+ $form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
49
53
  $form-space-none: $global-space-none;
50
54
  $form-space-calendar-x-m: $global-space-macro-m;
51
55
  $form-space-calendar-y-m: $global-space-macro-m;
@@ -221,9 +225,7 @@ $form-color-calendar-text-enabled: $modes-color-interactive-data-entry-content;
221
225
  $form-color-calendar-text-alt-enabled: $modes-color-interactive-data-entry-content-alt;
222
226
  $form-color-dropdown-bg-hover: $popover-color-bg-hover; // REF POPOVER
223
227
  $form-color-dropdown-label-active: $modes-color-interactive-monochrome-generic-with-active;
224
- $form-color-dropdown-label-alt: $modes-color-interactive-monochrome-generic-default;
225
228
  $form-color-dropdown-label-disabled: $modes-color-interactive-inactive-content;
226
- $form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
227
229
  $form-color-labelset-label-default: $modes-color-interactive-data-entry-content;
228
230
  $form-color-labelset-label-alt: $modes-color-interactive-data-entry-content-alt; // used for '(optional)' text and hint text.
229
231
  $form-color-labelset-label-disabled: $modes-color-interactive-inactive-content;
@@ -243,10 +245,8 @@ $form-color-typical-text-default: $modes-color-interactive-data-entry-content;
243
245
  $form-color-typical-text-disabled: $modes-color-interactive-inactive-content;
244
246
  $form-color-typical-text-enabled: $modes-color-interactive-data-entry-content; // Dropdown text (subtle dropdown).
245
247
  $form-color-switch-bg-disabled: $modes-color-interactive-inactive-default-alt; // for switch
246
- $form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
247
248
  $form-color-switch-fg-active: $modes-color-interactive-monochrome-generic-with-active;
248
249
  $form-color-switch-fg-activedisabled: $modes-color-interactive-inactive-content-alt;
249
- $form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
250
250
  $form-color-switch-label-active: $modes-color-interactive-data-entry-content;
251
251
  $form-color-switch-label-enabled: $modes-color-interactive-data-entry-content-alt;
252
252
  $form-color-switch-icon-enabled: $modes-color-interactive-data-entry-content-alt;
@@ -5,6 +5,7 @@
5
5
 
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
+ $link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
8
9
  $link-typography-responsive-default-s: $global-typography-responsive-component-underlined-moderate-s; // Small Viewports: 14.81, Large Viewports: 13.79. Match token size to component size.
9
10
  $link-typography-responsive-default-m: $global-typography-responsive-component-underlined-moderate-m; // Small Viewports: 16, Large Viewports: 16. Match token size to component size.
10
11
  $link-typography-responsive-default-l: $global-typography-responsive-component-underlined-moderate-l; // Small Viewports: 17.28, Large Viewports: 18.56. Match token size to component size.
@@ -18,11 +19,10 @@ $link-typography-adaptive-heading-s: $global-typography-adaptive-component-under
18
19
  $link-typography-adaptive-heading-m: $global-typography-adaptive-component-underlined-firm-m;
19
20
  $link-typography-adaptive-heading-l: $global-typography-adaptive-component-underlined-firm-l;
20
21
  $link-color-destructive-label-default: $modes-color-interactive-danger-default-alt; // .
21
- $link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
22
+ $link-color-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
22
23
  $link-boxshadow-skiplink: $global-boxshadow-container-near;
23
24
  $link-color-destructive-label-hover: $modes-color-interactive-danger-hover-alt2;
24
25
  $link-color-typical-label-default: $modes-color-interactive-primary-default-alt;
25
- $link-color-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
26
26
  $link-size-skiplink-m: $global-size-macro-m;
27
27
  $link-size-icon-m: $global-size-icon-m;
28
28
  $link-radius-link: $global-radius-interactive-xs; // Link (focus bg and bottom corners of focus underline)
@@ -6,6 +6,7 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $nav-color-bg-default: $modes-color-generic-bg-nought; // nav bar bg
9
+ $nav-color-item-bg-active: $modes-color-interactive-monochrome-generic-active;
9
10
  $nav-color-item-bg-enabled: $modes-color-none;
10
11
  $nav-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
11
12
  $nav-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
@@ -19,18 +20,17 @@ $nav-typography-responsive-label-l: $global-typography-responsive-component-firm
19
20
  $nav-typography-responsive-default-s: $global-typography-responsive-component-moderate-s;
20
21
  $nav-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
21
22
  $nav-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
22
- $nav-color-item-bg-active: $modes-color-interactive-monochrome-generic-active;
23
23
  $nav-color-item-bg-activealt: $modes-color-interactive-monochrome-generic-hover-alt;
24
24
  $nav-color-item-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
25
25
  $nav-color-item-label-activealt: $modes-color-interactive-monochrome-generic-with-hover;
26
+ $nav-color-item-label-enabled: $modes-color-interactive-monochrome-generic-default;
26
27
  $nav-color-item-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
28
+ $nav-color-item-label-alt: $modes-color-interactive-monochrome-generic-default-alt;
27
29
  $nav-color-menu-bg-default: $modes-color-generic-bg-faint; // menu (level 1) nav bg
28
30
  $nav-color-menu-bg-alt: $modes-color-generic-bg-delicate; // level 2 nav bg
29
31
  $nav-color-menu-bg-alt2: $modes-color-generic-bg-soft; // level 3 nav bg
30
32
  $nav-boxshadow-menu: $global-boxshadow-cleanedge-near; // Menu
31
33
  $nav-color-item-label-active: $modes-color-interactive-monochrome-generic-with-active;
32
- $nav-color-item-label-enabled: $modes-color-interactive-monochrome-generic-default;
33
- $nav-color-item-label-alt: $modes-color-interactive-monochrome-generic-default-alt;
34
34
  $nav-color-menu-border-default: $modes-color-generic-fg-delicate; // level 1 border
35
35
  $nav-radius-menu: $global-radius-interactive-m; // Drop list bottom corners, product popout list all corners
36
36
  $nav-radius-menuitem: $global-radius-interactive-s; // Menu (menu item state bg shape),
@@ -6,6 +6,7 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $page-color-bg-default: $modes-color-generic-backdrop-nought;
9
+ $page-color-bg-alt: $modes-color-generic-backdrop-faint;
9
10
  $page-typography-responsive-h1: $global-typography-responsive-heading-l;
10
11
  $page-typography-responsive-h2: $global-typography-responsive-heading-m;
11
12
  $page-typography-responsive-h3: $global-typography-responsive-heading-s;
@@ -20,7 +21,6 @@ $page-typography-adaptive-h4: $global-typography-adaptive-subheading-l;
20
21
  $page-typography-adaptive-h5: $global-typography-adaptive-subheading-m;
21
22
  $page-typography-adaptive-p-typical: $global-typography-adaptive-body-s;
22
23
  $page-typography-adaptive-p-large: $global-typography-adaptive-body-s;
23
- $page-color-bg-alt: $modes-color-generic-backdrop-faint;
24
24
  $page-color-text-alt: $modes-color-generic-content-moderate; // for subheadings etc
25
25
  $page-color-text-default: $modes-color-generic-content-harsh; // for headings, paragraph text etc
26
26
  $page-space-x-l: $global-space-macro-xl;
@@ -6,6 +6,7 @@
6
6
  // Do not edit directly, this file was auto-generated.
7
7
 
8
8
  $popover-radius-none: $global-radius-none; // Navigation menu top corners
9
+ $popover-color-bg-active: $modes-color-interactive-monochrome-generic-active; // previously action minor 850
9
10
  $popover-color-bg-default: $modes-color-generic-bg-nought; // REF'D IN FORM. Popover container bg
10
11
  $popover-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
11
12
  $popover-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
@@ -20,11 +21,11 @@ $popover-typography-responsive-default-s: $global-typography-responsive-componen
20
21
  $popover-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
21
22
  $popover-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
22
23
  $popover-boxshadow-container: $global-boxshadow-container-near; // REF'D IN FORM. Popover container for Button popover, Button split, (and Form calendar, color picker, dropdown)
23
- $popover-color-bg-active: $modes-color-interactive-monochrome-generic-active; // previously action minor 850
24
24
  $popover-color-bg-activealt: $modes-color-interactive-monochrome-generic-hover-alt; // REF'D IN FORM.
25
25
  $popover-color-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt; // REF'D IN FORM.
26
26
  $popover-color-label-activealt: $modes-color-interactive-monochrome-generic-with-hover;
27
27
  $popover-color-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
28
+ $popover-color-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
28
29
  $popover-color-submenu-bg-default: $modes-color-generic-bg-faint; // popover small screen submenu container bg
29
30
  $popover-size-icon-m: $global-size-icon-m;
30
31
  $popover-size-item-s: $global-size-macro-s; // REF'D IN FORM. Menu item min height.
@@ -52,4 +53,3 @@ $popover-space-submenu-x-m: $global-space-macro-xs; // Right left padding on sma
52
53
  $popover-space-submenu-x-l: $global-space-macro-xs; // Right left padding on small screen submenu popover container.
53
54
  $popover-color-label-active: $modes-color-interactive-monochrome-generic-with-active;
54
55
  $popover-color-label-disabled: $modes-color-interactive-inactive-content;
55
- $popover-color-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;