@sage/design-tokens 14.7.0 → 14.8.0

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 (134) hide show
  1. package/css/frozenproduct/all.css +3 -2
  2. package/css/frozenproduct/large/components/table.css +3 -2
  3. package/css/frozenproduct/small/components/table.css +3 -2
  4. package/css/marketing/all.css +3 -2
  5. package/css/marketing/large/components/table.css +3 -2
  6. package/css/marketing/small/components/table.css +3 -2
  7. package/css/product/all.css +13 -12
  8. package/css/product/large/components/table.css +3 -2
  9. package/css/product/small/components/table.css +13 -12
  10. package/ios/frozenproduct/large/dark/components/table.h +2 -1
  11. package/ios/frozenproduct/large/light/components/table.h +2 -1
  12. package/ios/frozenproduct/small/dark/components/table.h +2 -1
  13. package/ios/frozenproduct/small/light/components/table.h +2 -1
  14. package/ios/marketing/large/dark/components/table.h +2 -1
  15. package/ios/marketing/large/light/components/table.h +2 -1
  16. package/ios/marketing/small/dark/components/table.h +2 -1
  17. package/ios/marketing/small/light/components/table.h +2 -1
  18. package/ios/product/large/dark/components/table.h +2 -1
  19. package/ios/product/large/light/components/table.h +2 -1
  20. package/ios/product/small/dark/components/table.h +2 -1
  21. package/ios/product/small/light/components/table.h +2 -1
  22. package/js/common/frozenproduct/large/dark/components/table.d.ts +1 -0
  23. package/js/common/frozenproduct/large/dark/components/table.js +22 -5
  24. package/js/common/frozenproduct/large/light/components/table.d.ts +1 -0
  25. package/js/common/frozenproduct/large/light/components/table.js +22 -5
  26. package/js/common/frozenproduct/small/dark/components/table.d.ts +1 -0
  27. package/js/common/frozenproduct/small/dark/components/table.js +22 -5
  28. package/js/common/frozenproduct/small/light/components/table.d.ts +1 -0
  29. package/js/common/frozenproduct/small/light/components/table.js +22 -5
  30. package/js/common/marketing/large/dark/components/table.d.ts +1 -0
  31. package/js/common/marketing/large/dark/components/table.js +22 -5
  32. package/js/common/marketing/large/light/components/table.d.ts +1 -0
  33. package/js/common/marketing/large/light/components/table.js +22 -5
  34. package/js/common/marketing/small/dark/components/table.d.ts +1 -0
  35. package/js/common/marketing/small/dark/components/table.js +22 -5
  36. package/js/common/marketing/small/light/components/table.d.ts +1 -0
  37. package/js/common/marketing/small/light/components/table.js +22 -5
  38. package/js/common/product/large/dark/components/table.d.ts +1 -0
  39. package/js/common/product/large/dark/components/table.js +22 -5
  40. package/js/common/product/large/light/components/table.d.ts +1 -0
  41. package/js/common/product/large/light/components/table.js +22 -5
  42. package/js/common/product/small/dark/components/table.d.ts +1 -0
  43. package/js/common/product/small/dark/components/table.js +22 -5
  44. package/js/common/product/small/light/components/table.d.ts +1 -0
  45. package/js/common/product/small/light/components/table.js +22 -5
  46. package/js/es6/frozenproduct/large/dark/components/table.d.ts +1 -0
  47. package/js/es6/frozenproduct/large/dark/components/table.js +2 -1
  48. package/js/es6/frozenproduct/large/light/components/table.d.ts +1 -0
  49. package/js/es6/frozenproduct/large/light/components/table.js +2 -1
  50. package/js/es6/frozenproduct/small/dark/components/table.d.ts +1 -0
  51. package/js/es6/frozenproduct/small/dark/components/table.js +2 -1
  52. package/js/es6/frozenproduct/small/light/components/table.d.ts +1 -0
  53. package/js/es6/frozenproduct/small/light/components/table.js +2 -1
  54. package/js/es6/marketing/large/dark/components/table.d.ts +1 -0
  55. package/js/es6/marketing/large/dark/components/table.js +2 -1
  56. package/js/es6/marketing/large/light/components/table.d.ts +1 -0
  57. package/js/es6/marketing/large/light/components/table.js +2 -1
  58. package/js/es6/marketing/small/dark/components/table.d.ts +1 -0
  59. package/js/es6/marketing/small/dark/components/table.js +2 -1
  60. package/js/es6/marketing/small/light/components/table.d.ts +1 -0
  61. package/js/es6/marketing/small/light/components/table.js +2 -1
  62. package/js/es6/product/large/dark/components/table.d.ts +1 -0
  63. package/js/es6/product/large/dark/components/table.js +2 -1
  64. package/js/es6/product/large/light/components/table.d.ts +1 -0
  65. package/js/es6/product/large/light/components/table.js +2 -1
  66. package/js/es6/product/small/dark/components/table.d.ts +1 -0
  67. package/js/es6/product/small/dark/components/table.js +2 -1
  68. package/js/es6/product/small/light/components/table.d.ts +1 -0
  69. package/js/es6/product/small/light/components/table.js +2 -1
  70. package/js/umd/frozenproduct/large/dark/components/table.js +22 -5
  71. package/js/umd/frozenproduct/large/light/components/table.js +22 -5
  72. package/js/umd/frozenproduct/small/dark/components/table.js +22 -5
  73. package/js/umd/frozenproduct/small/light/components/table.js +22 -5
  74. package/js/umd/marketing/large/dark/components/table.js +22 -5
  75. package/js/umd/marketing/large/light/components/table.js +22 -5
  76. package/js/umd/marketing/small/dark/components/table.js +22 -5
  77. package/js/umd/marketing/small/light/components/table.js +22 -5
  78. package/js/umd/product/large/dark/components/table.js +22 -5
  79. package/js/umd/product/large/light/components/table.js +22 -5
  80. package/js/umd/product/small/dark/components/table.js +22 -5
  81. package/js/umd/product/small/light/components/table.js +22 -5
  82. package/json/flat/frozenproduct/large/dark/components/table.json +2 -1
  83. package/json/flat/frozenproduct/large/light/components/table.json +2 -1
  84. package/json/flat/frozenproduct/small/dark/components/table.json +2 -1
  85. package/json/flat/frozenproduct/small/light/components/table.json +2 -1
  86. package/json/flat/marketing/large/dark/components/table.json +2 -1
  87. package/json/flat/marketing/large/light/components/table.json +2 -1
  88. package/json/flat/marketing/small/dark/components/table.json +2 -1
  89. package/json/flat/marketing/small/light/components/table.json +2 -1
  90. package/json/flat/product/large/dark/components/table.json +2 -1
  91. package/json/flat/product/large/light/components/table.json +2 -1
  92. package/json/flat/product/small/dark/components/table.json +2 -1
  93. package/json/flat/product/small/light/components/table.json +2 -1
  94. package/json/nested/frozenproduct/large/dark/components/table.json +2 -1
  95. package/json/nested/frozenproduct/large/light/components/table.json +2 -1
  96. package/json/nested/frozenproduct/small/dark/components/table.json +2 -1
  97. package/json/nested/frozenproduct/small/light/components/table.json +2 -1
  98. package/json/nested/marketing/large/dark/components/table.json +2 -1
  99. package/json/nested/marketing/large/light/components/table.json +2 -1
  100. package/json/nested/marketing/small/dark/components/table.json +2 -1
  101. package/json/nested/marketing/small/light/components/table.json +2 -1
  102. package/json/nested/product/large/dark/components/table.json +2 -1
  103. package/json/nested/product/large/light/components/table.json +2 -1
  104. package/json/nested/product/small/dark/components/table.json +2 -1
  105. package/json/nested/product/small/light/components/table.json +2 -1
  106. package/package.json +1 -1
  107. package/sage-design-tokens-14.8.0.tgz +0 -0
  108. package/scss/frozenproduct/large/components/button.scss +13 -13
  109. package/scss/frozenproduct/large/components/container.scss +10 -10
  110. package/scss/frozenproduct/large/components/form.scss +7 -7
  111. package/scss/frozenproduct/large/components/link.scss +2 -2
  112. package/scss/frozenproduct/large/components/nav.scss +5 -5
  113. package/scss/frozenproduct/large/components/page.scss +1 -1
  114. package/scss/frozenproduct/large/components/popover.scss +2 -2
  115. package/scss/frozenproduct/large/components/progress.scss +6 -6
  116. package/scss/frozenproduct/large/components/status.scss +3 -3
  117. package/scss/frozenproduct/large/components/tab.scss +7 -7
  118. package/scss/frozenproduct/large/components/table.scss +13 -12
  119. package/scss/frozenproduct/small/components/table.scss +3 -2
  120. package/scss/marketing/large/components/table.scss +3 -2
  121. package/scss/marketing/small/components/button.scss +13 -13
  122. package/scss/marketing/small/components/container.scss +10 -10
  123. package/scss/marketing/small/components/form.scss +7 -7
  124. package/scss/marketing/small/components/link.scss +2 -2
  125. package/scss/marketing/small/components/nav.scss +5 -5
  126. package/scss/marketing/small/components/page.scss +1 -1
  127. package/scss/marketing/small/components/popover.scss +2 -2
  128. package/scss/marketing/small/components/progress.scss +6 -6
  129. package/scss/marketing/small/components/status.scss +3 -3
  130. package/scss/marketing/small/components/tab.scss +7 -7
  131. package/scss/marketing/small/components/table.scss +13 -12
  132. package/scss/product/large/components/table.scss +3 -2
  133. package/scss/product/small/components/table.scss +3 -2
  134. package/sage-design-tokens-14.7.0.tgz +0 -0
@@ -571,28 +571,45 @@
571
571
  thin: {
572
572
  $type: "borderWidth",
573
573
  $value: 1,
574
- $description: "Table border",
574
+ $description: "Table border. Optional choice of cell border width.",
575
575
  filePath: "data/tokens/components/table.json",
576
576
  isSource: true,
577
577
  original: {
578
578
  $type: "borderWidth",
579
579
  $value: "{global.borderwidth.XS}",
580
- $description: "Table border",
580
+ $description: "Table border. Optional choice of cell border width.",
581
581
  },
582
582
  name: "tableBorderwidthThin",
583
583
  attributes: {},
584
584
  path: ["table", "borderwidth", "thin"],
585
585
  },
586
- thick: {
586
+ medium: {
587
587
  $type: "borderWidth",
588
588
  $value: 2,
589
- $description: "header border for subtle",
589
+ $description:
590
+ "Header border for subtle. Optional choice of cell border width.",
590
591
  filePath: "data/tokens/components/table.json",
591
592
  isSource: true,
592
593
  original: {
593
594
  $type: "borderWidth",
594
595
  $value: "{global.borderwidth.S}",
595
- $description: "header border for subtle",
596
+ $description:
597
+ "Header border for subtle. Optional choice of cell border width.",
598
+ },
599
+ name: "tableBorderwidthMedium",
600
+ attributes: {},
601
+ path: ["table", "borderwidth", "medium"],
602
+ },
603
+ thick: {
604
+ $type: "borderWidth",
605
+ $value: 3,
606
+ $description: "Optional choice of cell border width.",
607
+ filePath: "data/tokens/components/table.json",
608
+ isSource: true,
609
+ original: {
610
+ $type: "borderWidth",
611
+ $value: "{global.borderwidth.M}",
612
+ $description: "Optional choice of cell border width.",
596
613
  },
597
614
  name: "tableBorderwidthThick",
598
615
  attributes: {},
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -33,7 +33,8 @@
33
33
  "tableBoxshadowColumnStickyRight": [{"x":"-2","y":"0","blur":"2","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"-5","y":"0","blur":"5","spread":"0","color":"#0000001A","type":"dropShadow"}],
34
34
  "tableBoxshadowRowDragging": [{"x":"0","y":"3","blur":"4","spread":"0","color":"#0000001A","type":"dropShadow"},{"x":"10","y":"10","blur":"60","spread":"0","color":"#0000001A","type":"dropShadow"}],
35
35
  "tableBorderwidthThin": 1,
36
- "tableBorderwidthThick": 2,
36
+ "tableBorderwidthMedium": 2,
37
+ "tableBorderwidthThick": 3,
37
38
  "tableSpaceNone": 0,
38
39
  "tableSpaceYg": 4,
39
40
  "tableSpaceRowXXs": 8,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
@@ -132,7 +132,8 @@
132
132
  },
133
133
  "borderwidth": {
134
134
  "thin": 1,
135
- "thick": 2
135
+ "medium": 2,
136
+ "thick": 3
136
137
  },
137
138
  "space": {
138
139
  "none": 0,
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  },
7
7
  "description": "Design tokens for the Sage Design System.",
8
8
  "author": "The Sage Group plc",
9
- "version": "14.7.0",
9
+ "version": "14.8.0",
10
10
  "license": "SEE LICENSE IN https://github.com/Sage/design-tokens/blob/master/license",
11
11
  "tags": [
12
12
  "design tokens",
Binary file
@@ -40,7 +40,6 @@ $button-color-typical-secondary-inverse-label-disabled: $modes-color-interactive
40
40
  $button-color-typical-tertiary-inverse-border-disabled: $modes-color-interactive-inactive-inverse-default;
41
41
  $button-color-typical-tertiary-inverse-label-disabled: $modes-color-interactive-inactive-inverse-content;
42
42
  $button-color-typical-subtle-inverse-label-disabled: $modes-color-interactive-inactive-inverse-content;
43
- $button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-active;
44
43
  $button-typography-adaptive-primary-s: $global-typography-adaptive-component-firm-s;
45
44
  $button-typography-adaptive-primary-m: $global-typography-adaptive-component-firm-m;
46
45
  $button-typography-adaptive-primary-l: $global-typography-adaptive-component-firm-l;
@@ -72,7 +71,6 @@ $button-typography-responsive-tertiary-s: $global-typography-responsive-componen
72
71
  $button-typography-responsive-tertiary-m: $global-typography-responsive-component-firm-m;
73
72
  $button-typography-responsive-tertiary-l: $global-typography-responsive-component-firm-l;
74
73
  $button-color-ai-label-active: $modes-color-interactive-monochrome-with-active-alt;
75
- $button-color-ai-label-enabled: $modes-color-interactive-monochrome-default;
76
74
  $button-color-ai-label-hover: $modes-color-interactive-monochrome-with-hover;
77
75
  $button-color-destructive-primary-bg-hover: $modes-color-interactive-danger-hover;
78
76
  $button-color-destructive-secondary-bg-hover: $modes-color-interactive-danger-hover-alt;
@@ -81,25 +79,18 @@ $button-color-destructive-secondary-label-hover: $modes-color-interactive-danger
81
79
  $button-color-typical-primary-bg-enabled: $modes-color-interactive-primary-default;
82
80
  $button-color-typical-primary-inverse-bg-enabled: $modes-color-interactive-primary-inverse-default;
83
81
  $button-color-typical-secondary-label-active: $modes-color-interactive-monochrome-with-active-alt;
84
- $button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-default;
85
82
  $button-color-typical-secondary-label-hover: $modes-color-interactive-monochrome-with-hover;
86
83
  $button-color-typical-tertiary-bg-enabled: $button-color-none;
87
84
  $button-color-typical-tertiary-label-active: $modes-color-interactive-monochrome-with-active-alt;
88
- $button-color-typical-tertiary-label-enabled: $modes-color-interactive-monochrome-default;
89
85
  $button-color-typical-tertiary-label-hover: $modes-color-interactive-monochrome-with-hover;
90
86
  $button-color-typical-tertiary-inverse-bg-enabled: $button-color-none;
91
87
  $button-color-typical-subtle-bg-hover: $modes-color-interactive-monochrome-hover-alt;
92
88
  $button-color-typical-subtle-label-active: $modes-color-interactive-monochrome-with-active-alt;
93
- $button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-default;
94
89
  $button-color-typical-subtle-label-hover: $modes-color-interactive-monochrome-with-hover;
90
+ $button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-active;
95
91
  $button-color-typical-toggle-bg-hover: $modes-color-interactive-monochrome-hover-alt;
96
- $button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-default;
97
- $button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-default-alt;
98
92
  $button-color-typical-toggle-label-hover: $modes-color-interactive-monochrome-with-hover;
99
93
  $button-color-video-bg-blur: $modes-color-interactive-monochrome-hover-alt;
100
- $button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-default;
101
- $button-color-video-primary-label-hover: $modes-color-interactive-monochrome-default;
102
- $button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-default;
103
94
  $button-size-split: $global-size-micro-xxs; // Split button (divider width)
104
95
  $button-size-xs: $global-size-macro-xs; // min-height on XS Buttons
105
96
  $button-size-s: $global-size-macro-s; // min-height on S Buttons
@@ -237,6 +228,7 @@ $button-space-video-x-s: $global-space-micro-xs; // Left padding on play icon in
237
228
  $button-space-video-x-m: $global-space-micro-xs; // Left padding on play icon in video button
238
229
  $button-space-video-x-l: $global-space-micro-xs; // Left padding on play icon in video button
239
230
  $button-color-ai-label-disabled: $modes-color-interactive-inactive-content;
231
+ $button-color-ai-label-enabled: $modes-color-interactive-monochrome-default;
240
232
  $button-color-destructive-primary-label-disabled: $modes-color-interactive-inactive-content-alt;
241
233
  $button-color-destructive-secondary-label-disabled: $modes-color-interactive-inactive-content;
242
234
  $button-color-typical-primary-bg-active: $modes-color-interactive-primary-active;
@@ -251,8 +243,10 @@ $button-color-typical-secondary-border-active: $modes-color-interactive-primary-
251
243
  $button-color-typical-secondary-border-enabled: $modes-color-interactive-primary-default-alt;
252
244
  $button-color-typical-secondary-border-hover: $modes-color-interactive-primary-hover;
253
245
  $button-color-typical-secondary-label-disabled: $modes-color-interactive-inactive-content;
246
+ $button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-default;
254
247
  $button-color-typical-secondary-inverse-bg-active: $modes-color-interactive-primary-inverse-active-alt;
255
248
  $button-color-typical-secondary-inverse-bg-enabled: $modes-color-interactive-primary-inverse-default-alt3;
249
+ $button-color-typical-secondary-inverse-bg-hover: $modes-color-interactive-primary-inverse-hover-alt;
256
250
  $button-color-typical-secondary-inverse-border-active: $modes-color-interactive-primary-inverse-active;
257
251
  $button-color-typical-secondary-inverse-border-enabled: $modes-color-interactive-primary-inverse-default-alt;
258
252
  $button-color-typical-secondary-inverse-border-hover: $modes-color-interactive-primary-inverse-hover;
@@ -265,28 +259,35 @@ $button-color-typical-tertiary-border-active: $modes-color-interactive-primary-a
265
259
  $button-color-typical-tertiary-border-enabled: $modes-color-interactive-primary-default-alt;
266
260
  $button-color-typical-tertiary-border-hover: $modes-color-interactive-primary-hover;
267
261
  $button-color-typical-tertiary-label-disabled: $modes-color-interactive-inactive-content;
262
+ $button-color-typical-tertiary-label-enabled: $modes-color-interactive-monochrome-default;
268
263
  $button-color-typical-tertiary-inverse-bg-active: $modes-color-interactive-primary-inverse-active-alt;
264
+ $button-color-typical-tertiary-inverse-bg-hover: $modes-color-interactive-primary-inverse-hover-alt;
269
265
  $button-color-typical-tertiary-inverse-border-active: $modes-color-interactive-primary-inverse-active;
270
266
  $button-color-typical-tertiary-inverse-border-enabled: $modes-color-interactive-primary-inverse-default-alt;
271
267
  $button-color-typical-tertiary-inverse-border-hover: $modes-color-interactive-primary-inverse-hover;
272
268
  $button-color-typical-tertiary-inverse-label-active: $modes-color-interactive-monochrome-inverse-with-active-alt;
273
269
  $button-color-typical-tertiary-inverse-label-enabled: $modes-color-interactive-monochrome-inverse-default;
274
270
  $button-color-typical-tertiary-inverse-label-hover: $modes-color-interactive-monochrome-inverse-with-hover;
275
- $button-color-typical-subtle-bg-active: $modes-color-interactive-monochrome-active-alt;
276
271
  $button-color-typical-subtle-label-disabled: $modes-color-interactive-inactive-content;
272
+ $button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-default;
277
273
  $button-color-typical-subtle-inverse-bg-hover: $modes-color-interactive-monochrome-inverse-hover-alt;
278
274
  $button-color-typical-subtle-inverse-label-active: $modes-color-interactive-monochrome-inverse-with-active-alt;
279
275
  $button-color-typical-subtle-inverse-label-enabled: $modes-color-interactive-monochrome-inverse-default;
280
276
  $button-color-typical-subtle-inverse-label-hover: $modes-color-interactive-monochrome-inverse-with-hover;
281
277
  $button-color-typical-toggle-label-active-disabled: $modes-color-interactive-inactive-content-alt;
278
+ $button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-default;
282
279
  $button-color-typical-toggle-label-active: $modes-color-interactive-monochrome-with-active;
283
280
  $button-color-typical-toggle-label-disabled: $modes-color-interactive-inactive-content;
281
+ $button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-default-alt;
284
282
  $button-color-video-primary-bg-enabled: $modes-color-interactive-monochrome-with-default;
285
283
  $button-color-video-primary-bg-hover: $modes-color-interactive-monochrome-with-default;
284
+ $button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-default;
285
+ $button-color-video-primary-label-hover: $modes-color-interactive-monochrome-default;
286
286
  $button-color-video-secondary-bg-hover: $modes-color-interactive-monochrome-with-default;
287
287
  $button-color-video-secondary-border-enabled: $modes-color-interactive-monochrome-with-default;
288
288
  $button-color-video-secondary-border-hover: $modes-color-interactive-monochrome-with-default;
289
289
  $button-color-video-secondary-label-enabled: $modes-color-interactive-monochrome-with-default;
290
+ $button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-default;
290
291
  $button-radius-s: $global-radius-interactive-l; // Buttons S (typical and destructive, and inc bar, split and multi), Button toggle M (parent container)
291
292
  $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)
292
293
  $button-radius-l: $global-radius-interactive-xxl; // Buttons L (typical and destructive, and inc bar, split and multi), Button toggle L (parent container)
@@ -322,9 +323,8 @@ $button-color-destructive-primary-bg-disabled: $modes-color-interactive-inactive
322
323
  $button-color-destructive-secondary-border-disabled: $modes-color-interactive-inactive-default;
323
324
  $button-color-typical-primary-bg-disabled: $modes-color-interactive-inactive-default;
324
325
  $button-color-typical-secondary-border-disabled: $modes-color-interactive-inactive-default;
325
- $button-color-typical-secondary-inverse-bg-hover: $modes-color-interactive-primary-inverse-hover-alt;
326
326
  $button-color-typical-tertiary-border-disabled: $modes-color-interactive-inactive-default;
327
- $button-color-typical-tertiary-inverse-bg-hover: $modes-color-interactive-primary-inverse-hover-alt;
327
+ $button-color-typical-subtle-bg-active: $modes-color-interactive-monochrome-active-alt;
328
328
  $button-color-typical-subtle-inverse-bg-active: $modes-color-interactive-monochrome-inverse-active-alt;
329
329
  $button-color-typical-toggle-bg-active-disabled: $modes-color-interactive-inactive-default;
330
330
  $button-color-typical-toggle-border-disabled: $modes-color-interactive-inactive-default;
@@ -24,17 +24,12 @@ $container-color-ai-nudge-border-ai-horizontal: $modes-color-status-ai-default-h
24
24
  $container-color-ai-nudge-border-ai-vertical: $modes-color-status-ai-default-vertical; // left and right border for AI nudge message component
25
25
  $container-color-ai-tile-bordervertical: $modes-color-status-ai-default-vertical; // left border for AI tiles and bubbles.
26
26
  $container-color-interactive-bg-footer-activated: $modes-color-status-positive-default; //
27
- $container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-active;
28
27
  $container-color-interactive-border-activated: $modes-color-status-positive-default;
29
28
  $container-color-interactive-bg-footer-default: $modes-color-generic-bg-nought; // tile footer bg color
30
29
  $container-color-interactive-bg-enabled: $modes-color-generic-bg-nought;
31
- $container-color-interactive-border-active: $modes-color-interactive-monochrome-active;
32
- $container-color-interactive-icon-active: $modes-color-interactive-monochrome-active; // Active chevron for any accordion.
33
- $container-color-interactive-text-active: $modes-color-interactive-monochrome-active; // Active label for any accordion.
34
30
  $container-color-interactive-detailedicon-bg: $modes-color-custom-default; //
35
31
  $container-color-interactive-droptarget-bg-default: $modes-color-status-info-default; // draggable drop target background color
36
32
  $container-color-standard-bg-default: $modes-color-generic-bg-nought;
37
- $container-color-standard-border-active: $modes-color-interactive-monochrome-active;
38
33
  $container-color-standard-statusborder-bg-caution: $modes-color-status-caution-default;
39
34
  $container-color-standard-statusborder-bg-negative: $modes-color-status-negative-default;
40
35
  $container-color-standard-statusborder-bg-important: $modes-color-status-important-default;
@@ -61,17 +56,17 @@ $container-typography-responsive-paragraph-s: $global-typography-responsive-comp
61
56
  $container-typography-responsive-paragraph-m: $global-typography-responsive-component-moderate-m;
62
57
  $container-typography-responsive-paragraph-l: $global-typography-responsive-component-moderate-l;
63
58
  $container-color-blockquote-border: $modes-color-interactive-primary-default;
59
+ $container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-active;
64
60
  $container-color-interactive-bg-hover: $modes-color-interactive-monochrome-hover-alt; // Used for accordion hover backgrounds
65
- $container-color-interactive-borderalt-hover: $modes-color-interactive-monochrome-default; // For hover border on Link preview.
66
- $container-color-interactive-icon-enabled: $modes-color-interactive-monochrome-default; // Enabled chevron for any accordion.
67
- $container-color-interactive-icon-alt-enabled: $modes-color-interactive-monochrome-default-alt; // Enabled label for subtle accordion.
68
- $container-color-interactive-icon-hover: $modes-color-interactive-monochrome-default; // Hover chevron for any accordion.
61
+ $container-color-interactive-border-active: $modes-color-interactive-monochrome-active;
62
+ $container-color-interactive-icon-active: $modes-color-interactive-monochrome-active; // Active chevron for any accordion.
63
+ $container-color-interactive-text-active: $modes-color-interactive-monochrome-active; // Active label for any accordion.
69
64
  $container-color-interactive-text-enabled: $modes-color-generic-content-harsh; // Enabled label for standard accordion.
70
65
  $container-color-interactive-text-alt-enabled: $modes-color-generic-content-moderate; // Enabled label for subtle accordion.
71
- $container-color-interactive-text-hover: $modes-color-interactive-monochrome-default; // Hover label for any accordion.
72
66
  $container-color-scrollbar-bg-default: $modes-color-generic-bg-faint;
73
67
  $container-color-standard-bg-alt: $modes-color-generic-bg-faint;
74
68
  $container-color-standard-bg-footer-default: $modes-color-generic-bg-faint; // tile footer bg color
69
+ $container-color-standard-border-active: $modes-color-interactive-monochrome-active;
75
70
  $container-color-standard-dimmer: $modes-color-interactive-inactive-mask; // dimmed mask for dialogs
76
71
  $container-color-standard-text-alt: $modes-color-generic-content-moderate; // for subheadings etc
77
72
  $container-color-standard-text-default: $modes-color-generic-content-harsh; // for headings, paragraph text etc
@@ -88,11 +83,16 @@ $container-boxshadow-card-hover: $global-boxshadow-interactive-hover; // Card (h
88
83
  $container-boxshadow-card-drag: $global-boxshadow-interactive-drag; // Card (drag state)
89
84
  $container-color-interactive-bg-disabled: $modes-color-interactive-inactive-default-alt;
90
85
  $container-color-interactive-border-alt: $modes-color-generic-fg-delicate; // Link preview.
86
+ $container-color-interactive-borderalt-hover: $modes-color-interactive-monochrome-default; // For hover border on Link preview.
91
87
  $container-color-interactive-border-inactive: $modes-color-generic-fg-soft;
92
88
  $container-color-interactive-border-enabled: $modes-color-generic-fg-moderate;
89
+ $container-color-interactive-icon-enabled: $modes-color-interactive-monochrome-default; // Enabled chevron for any accordion.
90
+ $container-color-interactive-icon-alt-enabled: $modes-color-interactive-monochrome-default-alt; // Enabled label for subtle accordion.
91
+ $container-color-interactive-icon-hover: $modes-color-interactive-monochrome-default; // Hover chevron for any accordion.
93
92
  $container-color-interactive-label-footer-active: $modes-color-interactive-monochrome-with-active;
94
93
  $container-color-interactive-label-footer-activated: $modes-color-interactive-monochrome-with-active;
95
94
  $container-color-interactive-text-disabled: $modes-color-interactive-inactive-content;
95
+ $container-color-interactive-text-hover: $modes-color-interactive-monochrome-default; // Hover label for any accordion.
96
96
  $container-color-scrollbar-fg-default: $modes-color-generic-fg-moderate;
97
97
  $container-color-standard-border-alt: $modes-color-generic-fg-soft;
98
98
  $container-color-standard-border-default: $modes-color-generic-fg-faint;
@@ -16,10 +16,7 @@ $form-radius-radio: $global-radius-circle; // Radio button
16
16
  $form-radius-switch: $global-radius-circle; // Switch container and handle
17
17
  $form-radius-calendar-none: $global-radius-none; // Calendar (start and end duration)
18
18
  $form-radius-calendar-date: $global-radius-circle; // Calendar date (hover & selected),
19
- $form-color-calendar-bg-active: $modes-color-interactive-monochrome-active;
20
- $form-color-calendar-border-duration: $modes-color-interactive-monochrome-active;
21
19
  $form-color-labelset-label-required: $modes-color-interactive-danger-default;
22
- $form-color-switch-bg-active: $modes-color-interactive-monochrome-active;
23
20
  $form-color-validation-border-error: $modes-color-status-negative-default;
24
21
  $form-color-validation-bar-error: $modes-color-status-negative-default; // error bar to left of inputs
25
22
  $form-color-validation-bar-warning: $modes-color-status-caution-default; // warning bar to left of inputs
@@ -38,10 +35,10 @@ $form-typography-responsive-label-l: $global-typography-responsive-component-fir
38
35
  $form-typography-responsive-default-s: $global-typography-responsive-component-moderate-s;
39
36
  $form-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
40
37
  $form-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
38
+ $form-color-calendar-bg-active: $modes-color-interactive-monochrome-active;
41
39
  $form-color-calendar-bg-hover: $modes-color-interactive-monochrome-hover-alt;
40
+ $form-color-calendar-border-duration: $modes-color-interactive-monochrome-active;
42
41
  $form-color-calendar-text-hover: $modes-color-interactive-monochrome-with-hover;
43
- $form-color-dropdown-label-alt: $modes-color-interactive-monochrome-default;
44
- $form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-default-alt;
45
42
  $form-color-dropdown-label-hover: $modes-color-interactive-monochrome-with-hover;
46
43
  $form-color-typical-bg-default: $modes-color-interactive-data-entry-default;
47
44
  $form-color-typical-bg-enabled: $modes-color-interactive-data-entry-default;
@@ -50,9 +47,8 @@ $form-color-typical-icon-active: $modes-color-interactive-data-entry-with-active
50
47
  $form-color-typical-icon-hover: $modes-color-interactive-data-entry-with-hover;
51
48
  $form-color-typical-text-hover: $modes-color-interactive-data-entry-with-hover; // text hover state when dragging a file over file input
52
49
  $form-color-typical-text-read-only: $modes-color-generic-content-harsh;
50
+ $form-color-switch-bg-active: $modes-color-interactive-monochrome-active;
53
51
  $form-color-switch-bg-enabled: $modes-color-interactive-data-entry-default; // for switch
54
- $form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
55
- $form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
56
52
  $form-space-none: $global-space-none;
57
53
  $form-space-calendar-x-m: $global-space-macro-m;
58
54
  $form-space-calendar-y-m: $global-space-macro-m;
@@ -233,7 +229,9 @@ $form-color-calendar-text-enabled: $modes-color-interactive-data-entry-content;
233
229
  $form-color-calendar-text-alt-enabled: $modes-color-interactive-data-entry-content-alt;
234
230
  $form-color-dropdown-bg-hover: $popover-color-bg-hover; // REF POPOVER
235
231
  $form-color-dropdown-label-active: $modes-color-interactive-monochrome-with-active;
232
+ $form-color-dropdown-label-alt: $modes-color-interactive-monochrome-default;
236
233
  $form-color-dropdown-label-disabled: $modes-color-interactive-inactive-content;
234
+ $form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-default-alt;
237
235
  $form-color-labelset-label-default: $modes-color-interactive-data-entry-content;
238
236
  $form-color-labelset-label-alt: $modes-color-interactive-data-entry-content-alt; // used for '(optional)' text and hint text.
239
237
  $form-color-labelset-label-disabled: $modes-color-interactive-inactive-content;
@@ -253,8 +251,10 @@ $form-color-typical-text-default: $modes-color-interactive-data-entry-content;
253
251
  $form-color-typical-text-disabled: $modes-color-interactive-inactive-content;
254
252
  $form-color-typical-text-enabled: $modes-color-interactive-data-entry-content; // Dropdown text (subtle dropdown).
255
253
  $form-color-switch-bg-disabled: $modes-color-interactive-inactive-default-alt; // for switch
254
+ $form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
256
255
  $form-color-switch-fg-active: $modes-color-interactive-monochrome-with-active;
257
256
  $form-color-switch-fg-activedisabled: $modes-color-interactive-inactive-content-alt;
257
+ $form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
258
258
  $form-color-switch-label-active: $modes-color-interactive-data-entry-content;
259
259
  $form-color-switch-label-enabled: $modes-color-interactive-data-entry-content-alt;
260
260
  $form-color-switch-icon-enabled: $modes-color-interactive-data-entry-content-alt;
@@ -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-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.
@@ -20,13 +19,14 @@ $link-typography-adaptive-heading-m: $global-typography-adaptive-component-under
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
21
  $link-color-destructive-inverse-label-default: $modes-color-interactive-danger-inverse-default-alt; // .
23
- $link-color-subtle-label-default: $modes-color-interactive-monochrome-default;
22
+ $link-color-subtle-label-hover: $modes-color-interactive-monochrome-active;
24
23
  $link-color-subtle-inverse-label-hover: $modes-color-interactive-monochrome-inverse-active;
25
24
  $link-boxshadow-skiplink: $global-boxshadow-container-near;
26
25
  $link-color-destructive-label-hover: $modes-color-interactive-danger-hover-alt2;
27
26
  $link-color-destructive-inverse-label-hover: $modes-color-interactive-danger-inverse-hover-alt2;
28
27
  $link-color-typical-label-default: $modes-color-interactive-primary-default-alt2;
29
28
  $link-color-typical-inverse-label-default: $modes-color-interactive-primary-inverse-default-alt2;
29
+ $link-color-subtle-label-default: $modes-color-interactive-monochrome-default;
30
30
  $link-color-subtle-inverse-label-default: $modes-color-interactive-monochrome-inverse-default;
31
31
  $link-size-skiplink-m: $global-size-macro-m;
32
32
  $link-size-icon-m: $global-size-icon-m;