@sage/design-tokens 2.40.0 → 2.41.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.
- package/android/base.xml +11 -6
- package/css/base.css +11 -6
- package/data/tokens.json +32 -5
- package/docs/tokens/base/colors/index.html +8 -8
- package/docs/tokens/base/index.html +114 -9
- package/docs/tokens/base/spacing/index.html +84 -0
- package/docs/tokens/base/typography/index.html +22 -1
- package/docs/tokens/index.html +114 -9
- package/ios/base.h +11 -6
- package/js/base/common.d.ts +5 -0
- package/js/base/common.js +11 -6
- package/js/base/es6.d.ts +5 -0
- package/js/base/es6.js +10 -5
- package/package.json +1 -1
- package/sage-design-tokens-2.41.0.tgz +0 -0
- package/scss/base.scss +11 -6
- package/sage-design-tokens-2.40.0.tgz +0 -0
package/android/base.xml
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
<!--
|
|
4
4
|
Do not edit directly
|
|
5
|
-
Generated on
|
|
5
|
+
Generated on Tue, 06 Sep 2022 13:51:10 GMT
|
|
6
6
|
-->
|
|
7
7
|
<resources>
|
|
8
8
|
<string name="metaName">Base Theme</string>
|
|
@@ -91,10 +91,10 @@
|
|
|
91
91
|
<string name="colorsSemanticPositiveYin065">#000000a6</string>
|
|
92
92
|
<string name="colorsSemanticPositiveYin090">#000000e6</string>
|
|
93
93
|
<string name="colorsSemanticPositiveYang100">#ffffffff</string>
|
|
94
|
-
<string name="colorsSemanticNegative350">#
|
|
95
|
-
<string name="colorsSemanticNegative450">#
|
|
96
|
-
<string name="colorsSemanticNegative500">#
|
|
97
|
-
<string name="colorsSemanticNegative600">#
|
|
94
|
+
<string name="colorsSemanticNegative350">#db7380ff</string>
|
|
95
|
+
<string name="colorsSemanticNegative450">#d04b5cff</string>
|
|
96
|
+
<string name="colorsSemanticNegative500">#cb374aff</string>
|
|
97
|
+
<string name="colorsSemanticNegative600">#a22c3bff</string>
|
|
98
98
|
<string name="colorsSemanticNegativeTransparent">#00000000</string>
|
|
99
99
|
<string name="colorsSemanticNegativeYin030">#0000004d</string>
|
|
100
100
|
<string name="colorsSemanticNegativeYin055">#0000008c</string>
|
|
@@ -264,6 +264,10 @@
|
|
|
264
264
|
<string name="spacing050">4px</string>
|
|
265
265
|
<string name="spacing060">5px</string>
|
|
266
266
|
<string name="spacing075">6px</string>
|
|
267
|
+
<string name="spacingNeg010">-1px</string>
|
|
268
|
+
<string name="spacingNeg025">-2px</string>
|
|
269
|
+
<string name="spacingNeg050">-4px</string>
|
|
270
|
+
<string name="spacingNeg075">-6px</string>
|
|
267
271
|
<string name="borderWidth100">1px</string>
|
|
268
272
|
<string name="borderWidth200">2px</string>
|
|
269
273
|
<string name="borderWidth300">3px</string>
|
|
@@ -306,7 +310,7 @@
|
|
|
306
310
|
<string name="typographyAccordionTitleM">Bold 20px/125% Sage UI</string>
|
|
307
311
|
<string name="typographyAccordionSubtitleM">Regular 14px/150% Sage UI</string>
|
|
308
312
|
<string name="typographyAccordionParagraphM">Regular 14px/150% Sage UI</string>
|
|
309
|
-
<string name="typographyActionPopoverMenuItemM">
|
|
313
|
+
<string name="typographyActionPopoverMenuItemM">Medium 14px/150% Sage UI</string>
|
|
310
314
|
<string name="typographyAnchorNavLabelM">Medium 14px/150% Sage UI</string>
|
|
311
315
|
<string name="typographyBadgeLabelM">Medium 12px/150% Sage UI</string>
|
|
312
316
|
<string name="typographyButtonLabelS">Medium 14px/150% Sage UI</string>
|
|
@@ -328,6 +332,7 @@
|
|
|
328
332
|
<string name="typographyDialogTitleL">Bold 24px/125% Sage UI</string>
|
|
329
333
|
<string name="typographyDialogTitleXl">Bold 24px/125% Sage UI</string>
|
|
330
334
|
<string name="typographyDialogTitleXxl">Bold 24px/125% Sage UI</string>
|
|
335
|
+
<string name="typographyDialogSubtitle">Regular 16px/150% Sage UI</string>
|
|
331
336
|
<string name="typographyDialogParagraphXs">Regular 14px/150% Sage UI</string>
|
|
332
337
|
<string name="typographyDialogParagraphS">Regular 14px/150% Sage UI</string>
|
|
333
338
|
<string name="typographyDialogParagraphMs">Regular 14px/150% Sage UI</string>
|
package/css/base.css
CHANGED
|
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Do not edit directly
|
|
7
|
-
* Generated on
|
|
7
|
+
* Generated on Tue, 06 Sep 2022 13:51:10 GMT
|
|
8
8
|
*/
|
|
9
9
|
|
|
10
10
|
:root {
|
|
@@ -94,10 +94,10 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
94
94
|
--colorsSemanticPositiveYin065: #000000a6;
|
|
95
95
|
--colorsSemanticPositiveYin090: #000000e6;
|
|
96
96
|
--colorsSemanticPositiveYang100: #ffffffff;
|
|
97
|
-
--colorsSemanticNegative350: #
|
|
98
|
-
--colorsSemanticNegative450: #
|
|
99
|
-
--colorsSemanticNegative500: #
|
|
100
|
-
--colorsSemanticNegative600: #
|
|
97
|
+
--colorsSemanticNegative350: #db7380ff;
|
|
98
|
+
--colorsSemanticNegative450: #d04b5cff;
|
|
99
|
+
--colorsSemanticNegative500: #cb374aff;
|
|
100
|
+
--colorsSemanticNegative600: #a22c3bff;
|
|
101
101
|
--colorsSemanticNegativeTransparent: #00000000;
|
|
102
102
|
--colorsSemanticNegativeYin030: #0000004d;
|
|
103
103
|
--colorsSemanticNegativeYin055: #0000008c;
|
|
@@ -267,6 +267,10 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
267
267
|
--spacing050: 4px;
|
|
268
268
|
--spacing060: 5px;
|
|
269
269
|
--spacing075: 6px;
|
|
270
|
+
--spacingNeg010: -1px;
|
|
271
|
+
--spacingNeg025: -2px;
|
|
272
|
+
--spacingNeg050: -4px;
|
|
273
|
+
--spacingNeg075: -6px;
|
|
270
274
|
--borderWidth100: 1px;
|
|
271
275
|
--borderWidth200: 2px;
|
|
272
276
|
--borderWidth300: 3px;
|
|
@@ -309,7 +313,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
309
313
|
--typographyAccordionTitleM: 700 20px/125% Sage UI;
|
|
310
314
|
--typographyAccordionSubtitleM: 400 14px/150% Sage UI;
|
|
311
315
|
--typographyAccordionParagraphM: 400 14px/150% Sage UI;
|
|
312
|
-
--typographyActionPopoverMenuItemM:
|
|
316
|
+
--typographyActionPopoverMenuItemM: 500 14px/150% Sage UI;
|
|
313
317
|
--typographyAnchorNavLabelM: 500 14px/150% Sage UI;
|
|
314
318
|
--typographyBadgeLabelM: 500 12px/150% Sage UI;
|
|
315
319
|
--typographyButtonLabelS: 500 14px/150% Sage UI;
|
|
@@ -331,6 +335,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
331
335
|
--typographyDialogTitleL: 700 24px/125% Sage UI;
|
|
332
336
|
--typographyDialogTitleXl: 700 24px/125% Sage UI;
|
|
333
337
|
--typographyDialogTitleXxl: 700 24px/125% Sage UI;
|
|
338
|
+
--typographyDialogSubtitle: 400 16px/150% Sage UI;
|
|
334
339
|
--typographyDialogParagraphXs: 400 14px/150% Sage UI;
|
|
335
340
|
--typographyDialogParagraphS: 400 14px/150% Sage UI;
|
|
336
341
|
--typographyDialogParagraphMs: 400 14px/150% Sage UI;
|
package/data/tokens.json
CHANGED
|
@@ -432,19 +432,19 @@
|
|
|
432
432
|
},
|
|
433
433
|
"negative": {
|
|
434
434
|
"350": {
|
|
435
|
-
"value": "#
|
|
435
|
+
"value": "#db7380ff",
|
|
436
436
|
"type": "color"
|
|
437
437
|
},
|
|
438
438
|
"450": {
|
|
439
|
-
"value": "#
|
|
439
|
+
"value": "#d04b5cff",
|
|
440
440
|
"type": "color"
|
|
441
441
|
},
|
|
442
442
|
"500": {
|
|
443
|
-
"value": "#
|
|
443
|
+
"value": "#cb374aff",
|
|
444
444
|
"type": "color"
|
|
445
445
|
},
|
|
446
446
|
"600": {
|
|
447
|
-
"value": "#
|
|
447
|
+
"value": "#a22c3bff",
|
|
448
448
|
"type": "color"
|
|
449
449
|
},
|
|
450
450
|
"transparent": {
|
|
@@ -1273,6 +1273,22 @@
|
|
|
1273
1273
|
"075": {
|
|
1274
1274
|
"value": "6px",
|
|
1275
1275
|
"type": "spacing"
|
|
1276
|
+
},
|
|
1277
|
+
"neg010": {
|
|
1278
|
+
"value": "-1px",
|
|
1279
|
+
"type": "spacing"
|
|
1280
|
+
},
|
|
1281
|
+
"neg025": {
|
|
1282
|
+
"value": "-2px",
|
|
1283
|
+
"type": "spacing"
|
|
1284
|
+
},
|
|
1285
|
+
"neg050": {
|
|
1286
|
+
"value": "-4px",
|
|
1287
|
+
"type": "spacing"
|
|
1288
|
+
},
|
|
1289
|
+
"neg075": {
|
|
1290
|
+
"value": "-6px",
|
|
1291
|
+
"type": "spacing"
|
|
1276
1292
|
}
|
|
1277
1293
|
},
|
|
1278
1294
|
"borderWidth": {
|
|
@@ -1624,7 +1640,7 @@
|
|
|
1624
1640
|
"m": {
|
|
1625
1641
|
"value": {
|
|
1626
1642
|
"fontFamily": "Sage UI",
|
|
1627
|
-
"fontWeight": "
|
|
1643
|
+
"fontWeight": "Medium",
|
|
1628
1644
|
"lineHeight": "150%",
|
|
1629
1645
|
"fontSize": "14px",
|
|
1630
1646
|
"letterSpacing": "0%",
|
|
@@ -1932,6 +1948,17 @@
|
|
|
1932
1948
|
"type": "typography"
|
|
1933
1949
|
}
|
|
1934
1950
|
},
|
|
1951
|
+
"subtitle": {
|
|
1952
|
+
"value": {
|
|
1953
|
+
"fontFamily": "Sage UI",
|
|
1954
|
+
"fontWeight": "Regular",
|
|
1955
|
+
"lineHeight": "150%",
|
|
1956
|
+
"fontSize": "16px",
|
|
1957
|
+
"letterSpacing": "0%",
|
|
1958
|
+
"paragraphSpacing": "0px"
|
|
1959
|
+
},
|
|
1960
|
+
"type": "typography"
|
|
1961
|
+
},
|
|
1935
1962
|
"paragraph": {
|
|
1936
1963
|
"xs": {
|
|
1937
1964
|
"value": {
|
|
@@ -2061,11 +2061,11 @@
|
|
|
2061
2061
|
</a>
|
|
2062
2062
|
</td>
|
|
2063
2063
|
<td class="is-vcentered">
|
|
2064
|
-
<pre>#
|
|
2064
|
+
<pre>#db7380ff</pre>
|
|
2065
2065
|
</td>
|
|
2066
2066
|
<td class="is-vcentered">
|
|
2067
2067
|
<div class="table__color-preview"
|
|
2068
|
-
style="background-color: #
|
|
2068
|
+
style="background-color: #db7380ff;">
|
|
2069
2069
|
</div>
|
|
2070
2070
|
|
|
2071
2071
|
</td>
|
|
@@ -2082,11 +2082,11 @@
|
|
|
2082
2082
|
</a>
|
|
2083
2083
|
</td>
|
|
2084
2084
|
<td class="is-vcentered">
|
|
2085
|
-
<pre>#
|
|
2085
|
+
<pre>#d04b5cff</pre>
|
|
2086
2086
|
</td>
|
|
2087
2087
|
<td class="is-vcentered">
|
|
2088
2088
|
<div class="table__color-preview"
|
|
2089
|
-
style="background-color: #
|
|
2089
|
+
style="background-color: #d04b5cff;">
|
|
2090
2090
|
</div>
|
|
2091
2091
|
|
|
2092
2092
|
</td>
|
|
@@ -2103,11 +2103,11 @@
|
|
|
2103
2103
|
</a>
|
|
2104
2104
|
</td>
|
|
2105
2105
|
<td class="is-vcentered">
|
|
2106
|
-
<pre>#
|
|
2106
|
+
<pre>#cb374aff</pre>
|
|
2107
2107
|
</td>
|
|
2108
2108
|
<td class="is-vcentered">
|
|
2109
2109
|
<div class="table__color-preview"
|
|
2110
|
-
style="background-color: #
|
|
2110
|
+
style="background-color: #cb374aff;">
|
|
2111
2111
|
</div>
|
|
2112
2112
|
|
|
2113
2113
|
</td>
|
|
@@ -2124,11 +2124,11 @@
|
|
|
2124
2124
|
</a>
|
|
2125
2125
|
</td>
|
|
2126
2126
|
<td class="is-vcentered">
|
|
2127
|
-
<pre>#
|
|
2127
|
+
<pre>#a22c3bff</pre>
|
|
2128
2128
|
</td>
|
|
2129
2129
|
<td class="is-vcentered">
|
|
2130
2130
|
<div class="table__color-preview"
|
|
2131
|
-
style="background-color: #
|
|
2131
|
+
style="background-color: #a22c3bff;">
|
|
2132
2132
|
</div>
|
|
2133
2133
|
|
|
2134
2134
|
</td>
|
|
@@ -2057,11 +2057,11 @@
|
|
|
2057
2057
|
</a>
|
|
2058
2058
|
</td>
|
|
2059
2059
|
<td class="is-vcentered">
|
|
2060
|
-
<pre>#
|
|
2060
|
+
<pre>#db7380ff</pre>
|
|
2061
2061
|
</td>
|
|
2062
2062
|
<td class="is-vcentered">
|
|
2063
2063
|
<div class="table__color-preview"
|
|
2064
|
-
style="background-color: #
|
|
2064
|
+
style="background-color: #db7380ff;">
|
|
2065
2065
|
</div>
|
|
2066
2066
|
|
|
2067
2067
|
</td>
|
|
@@ -2078,11 +2078,11 @@
|
|
|
2078
2078
|
</a>
|
|
2079
2079
|
</td>
|
|
2080
2080
|
<td class="is-vcentered">
|
|
2081
|
-
<pre>#
|
|
2081
|
+
<pre>#d04b5cff</pre>
|
|
2082
2082
|
</td>
|
|
2083
2083
|
<td class="is-vcentered">
|
|
2084
2084
|
<div class="table__color-preview"
|
|
2085
|
-
style="background-color: #
|
|
2085
|
+
style="background-color: #d04b5cff;">
|
|
2086
2086
|
</div>
|
|
2087
2087
|
|
|
2088
2088
|
</td>
|
|
@@ -2099,11 +2099,11 @@
|
|
|
2099
2099
|
</a>
|
|
2100
2100
|
</td>
|
|
2101
2101
|
<td class="is-vcentered">
|
|
2102
|
-
<pre>#
|
|
2102
|
+
<pre>#cb374aff</pre>
|
|
2103
2103
|
</td>
|
|
2104
2104
|
<td class="is-vcentered">
|
|
2105
2105
|
<div class="table__color-preview"
|
|
2106
|
-
style="background-color: #
|
|
2106
|
+
style="background-color: #cb374aff;">
|
|
2107
2107
|
</div>
|
|
2108
2108
|
|
|
2109
2109
|
</td>
|
|
@@ -2120,11 +2120,11 @@
|
|
|
2120
2120
|
</a>
|
|
2121
2121
|
</td>
|
|
2122
2122
|
<td class="is-vcentered">
|
|
2123
|
-
<pre>#
|
|
2123
|
+
<pre>#a22c3bff</pre>
|
|
2124
2124
|
</td>
|
|
2125
2125
|
<td class="is-vcentered">
|
|
2126
2126
|
<div class="table__color-preview"
|
|
2127
|
-
style="background-color: #
|
|
2127
|
+
style="background-color: #a22c3bff;">
|
|
2128
2128
|
</div>
|
|
2129
2129
|
|
|
2130
2130
|
</td>
|
|
@@ -5710,6 +5710,90 @@
|
|
|
5710
5710
|
style="width: 6px">
|
|
5711
5711
|
</div>
|
|
5712
5712
|
|
|
5713
|
+
</td>
|
|
5714
|
+
</tr>
|
|
5715
|
+
<tr>
|
|
5716
|
+
<td class="with-icons is-vcentered"
|
|
5717
|
+
id="base-spacingNeg010"
|
|
5718
|
+
title="theme: base; category: spacing; variant: neg010; ">
|
|
5719
|
+
spacingNeg010
|
|
5720
|
+
<a href="#base-spacingNeg010"
|
|
5721
|
+
title="permalink"
|
|
5722
|
+
class="permalink">
|
|
5723
|
+
🔗
|
|
5724
|
+
</a>
|
|
5725
|
+
</td>
|
|
5726
|
+
<td class="is-vcentered">
|
|
5727
|
+
<pre>-1px</pre>
|
|
5728
|
+
</td>
|
|
5729
|
+
<td class="is-vcentered">
|
|
5730
|
+
<div class="table__spacing-preview"
|
|
5731
|
+
style="width: -1px">
|
|
5732
|
+
</div>
|
|
5733
|
+
|
|
5734
|
+
</td>
|
|
5735
|
+
</tr>
|
|
5736
|
+
<tr>
|
|
5737
|
+
<td class="with-icons is-vcentered"
|
|
5738
|
+
id="base-spacingNeg025"
|
|
5739
|
+
title="theme: base; category: spacing; variant: neg025; ">
|
|
5740
|
+
spacingNeg025
|
|
5741
|
+
<a href="#base-spacingNeg025"
|
|
5742
|
+
title="permalink"
|
|
5743
|
+
class="permalink">
|
|
5744
|
+
🔗
|
|
5745
|
+
</a>
|
|
5746
|
+
</td>
|
|
5747
|
+
<td class="is-vcentered">
|
|
5748
|
+
<pre>-2px</pre>
|
|
5749
|
+
</td>
|
|
5750
|
+
<td class="is-vcentered">
|
|
5751
|
+
<div class="table__spacing-preview"
|
|
5752
|
+
style="width: -2px">
|
|
5753
|
+
</div>
|
|
5754
|
+
|
|
5755
|
+
</td>
|
|
5756
|
+
</tr>
|
|
5757
|
+
<tr>
|
|
5758
|
+
<td class="with-icons is-vcentered"
|
|
5759
|
+
id="base-spacingNeg050"
|
|
5760
|
+
title="theme: base; category: spacing; variant: neg050; ">
|
|
5761
|
+
spacingNeg050
|
|
5762
|
+
<a href="#base-spacingNeg050"
|
|
5763
|
+
title="permalink"
|
|
5764
|
+
class="permalink">
|
|
5765
|
+
🔗
|
|
5766
|
+
</a>
|
|
5767
|
+
</td>
|
|
5768
|
+
<td class="is-vcentered">
|
|
5769
|
+
<pre>-4px</pre>
|
|
5770
|
+
</td>
|
|
5771
|
+
<td class="is-vcentered">
|
|
5772
|
+
<div class="table__spacing-preview"
|
|
5773
|
+
style="width: -4px">
|
|
5774
|
+
</div>
|
|
5775
|
+
|
|
5776
|
+
</td>
|
|
5777
|
+
</tr>
|
|
5778
|
+
<tr>
|
|
5779
|
+
<td class="with-icons is-vcentered"
|
|
5780
|
+
id="base-spacingNeg075"
|
|
5781
|
+
title="theme: base; category: spacing; variant: neg075; ">
|
|
5782
|
+
spacingNeg075
|
|
5783
|
+
<a href="#base-spacingNeg075"
|
|
5784
|
+
title="permalink"
|
|
5785
|
+
class="permalink">
|
|
5786
|
+
🔗
|
|
5787
|
+
</a>
|
|
5788
|
+
</td>
|
|
5789
|
+
<td class="is-vcentered">
|
|
5790
|
+
<pre>-6px</pre>
|
|
5791
|
+
</td>
|
|
5792
|
+
<td class="is-vcentered">
|
|
5793
|
+
<div class="table__spacing-preview"
|
|
5794
|
+
style="width: -6px">
|
|
5795
|
+
</div>
|
|
5796
|
+
|
|
5713
5797
|
</td>
|
|
5714
5798
|
</tr>
|
|
5715
5799
|
</table>
|
|
@@ -6755,7 +6839,7 @@
|
|
|
6755
6839
|
</a>
|
|
6756
6840
|
</td>
|
|
6757
6841
|
<td class="is-vcentered">
|
|
6758
|
-
<pre>
|
|
6842
|
+
<pre>500 14px/150% Sage UI</pre>
|
|
6759
6843
|
</td>
|
|
6760
6844
|
<td class="is-vcentered">
|
|
6761
6845
|
<div class="table__typography-preview">
|
|
@@ -7205,6 +7289,27 @@
|
|
|
7205
7289
|
|
|
7206
7290
|
</td>
|
|
7207
7291
|
</tr>
|
|
7292
|
+
<tr>
|
|
7293
|
+
<td class="with-icons is-vcentered"
|
|
7294
|
+
id="base-typographyDialogSubtitle"
|
|
7295
|
+
title="theme: base; category: typography; name: dialog; variant: subtitle; ">
|
|
7296
|
+
typographyDialogSubtitle
|
|
7297
|
+
<a href="#base-typographyDialogSubtitle"
|
|
7298
|
+
title="permalink"
|
|
7299
|
+
class="permalink">
|
|
7300
|
+
🔗
|
|
7301
|
+
</a>
|
|
7302
|
+
</td>
|
|
7303
|
+
<td class="is-vcentered">
|
|
7304
|
+
<pre>400 16px/150% Sage UI</pre>
|
|
7305
|
+
</td>
|
|
7306
|
+
<td class="is-vcentered">
|
|
7307
|
+
<div class="table__typography-preview">
|
|
7308
|
+
n/a
|
|
7309
|
+
</div>
|
|
7310
|
+
|
|
7311
|
+
</td>
|
|
7312
|
+
</tr>
|
|
7208
7313
|
<tr>
|
|
7209
7314
|
<td class="with-icons is-vcentered"
|
|
7210
7315
|
id="base-typographyDialogParagraphXs"
|
|
@@ -703,6 +703,90 @@
|
|
|
703
703
|
style="width: 6px">
|
|
704
704
|
</div>
|
|
705
705
|
|
|
706
|
+
</td>
|
|
707
|
+
</tr>
|
|
708
|
+
<tr>
|
|
709
|
+
<td class="with-icons is-vcentered"
|
|
710
|
+
id="base-spacingNeg010"
|
|
711
|
+
title="theme: base; category: spacing; variant: neg010; ">
|
|
712
|
+
spacingNeg010
|
|
713
|
+
<a href="#base-spacingNeg010"
|
|
714
|
+
title="permalink"
|
|
715
|
+
class="permalink">
|
|
716
|
+
🔗
|
|
717
|
+
</a>
|
|
718
|
+
</td>
|
|
719
|
+
<td class="is-vcentered">
|
|
720
|
+
<pre>-1px</pre>
|
|
721
|
+
</td>
|
|
722
|
+
<td class="is-vcentered">
|
|
723
|
+
<div class="table__spacing-preview"
|
|
724
|
+
style="width: -1px">
|
|
725
|
+
</div>
|
|
726
|
+
|
|
727
|
+
</td>
|
|
728
|
+
</tr>
|
|
729
|
+
<tr>
|
|
730
|
+
<td class="with-icons is-vcentered"
|
|
731
|
+
id="base-spacingNeg025"
|
|
732
|
+
title="theme: base; category: spacing; variant: neg025; ">
|
|
733
|
+
spacingNeg025
|
|
734
|
+
<a href="#base-spacingNeg025"
|
|
735
|
+
title="permalink"
|
|
736
|
+
class="permalink">
|
|
737
|
+
🔗
|
|
738
|
+
</a>
|
|
739
|
+
</td>
|
|
740
|
+
<td class="is-vcentered">
|
|
741
|
+
<pre>-2px</pre>
|
|
742
|
+
</td>
|
|
743
|
+
<td class="is-vcentered">
|
|
744
|
+
<div class="table__spacing-preview"
|
|
745
|
+
style="width: -2px">
|
|
746
|
+
</div>
|
|
747
|
+
|
|
748
|
+
</td>
|
|
749
|
+
</tr>
|
|
750
|
+
<tr>
|
|
751
|
+
<td class="with-icons is-vcentered"
|
|
752
|
+
id="base-spacingNeg050"
|
|
753
|
+
title="theme: base; category: spacing; variant: neg050; ">
|
|
754
|
+
spacingNeg050
|
|
755
|
+
<a href="#base-spacingNeg050"
|
|
756
|
+
title="permalink"
|
|
757
|
+
class="permalink">
|
|
758
|
+
🔗
|
|
759
|
+
</a>
|
|
760
|
+
</td>
|
|
761
|
+
<td class="is-vcentered">
|
|
762
|
+
<pre>-4px</pre>
|
|
763
|
+
</td>
|
|
764
|
+
<td class="is-vcentered">
|
|
765
|
+
<div class="table__spacing-preview"
|
|
766
|
+
style="width: -4px">
|
|
767
|
+
</div>
|
|
768
|
+
|
|
769
|
+
</td>
|
|
770
|
+
</tr>
|
|
771
|
+
<tr>
|
|
772
|
+
<td class="with-icons is-vcentered"
|
|
773
|
+
id="base-spacingNeg075"
|
|
774
|
+
title="theme: base; category: spacing; variant: neg075; ">
|
|
775
|
+
spacingNeg075
|
|
776
|
+
<a href="#base-spacingNeg075"
|
|
777
|
+
title="permalink"
|
|
778
|
+
class="permalink">
|
|
779
|
+
🔗
|
|
780
|
+
</a>
|
|
781
|
+
</td>
|
|
782
|
+
<td class="is-vcentered">
|
|
783
|
+
<pre>-6px</pre>
|
|
784
|
+
</td>
|
|
785
|
+
<td class="is-vcentered">
|
|
786
|
+
<div class="table__spacing-preview"
|
|
787
|
+
style="width: -6px">
|
|
788
|
+
</div>
|
|
789
|
+
|
|
706
790
|
</td>
|
|
707
791
|
</tr>
|
|
708
792
|
</table>
|
|
@@ -360,7 +360,7 @@
|
|
|
360
360
|
</a>
|
|
361
361
|
</td>
|
|
362
362
|
<td class="is-vcentered">
|
|
363
|
-
<pre>
|
|
363
|
+
<pre>500 14px/150% Sage UI</pre>
|
|
364
364
|
</td>
|
|
365
365
|
<td class="is-vcentered">
|
|
366
366
|
<div class="table__typography-preview">
|
|
@@ -810,6 +810,27 @@
|
|
|
810
810
|
|
|
811
811
|
</td>
|
|
812
812
|
</tr>
|
|
813
|
+
<tr>
|
|
814
|
+
<td class="with-icons is-vcentered"
|
|
815
|
+
id="base-typographyDialogSubtitle"
|
|
816
|
+
title="theme: base; category: typography; name: dialog; variant: subtitle; ">
|
|
817
|
+
typographyDialogSubtitle
|
|
818
|
+
<a href="#base-typographyDialogSubtitle"
|
|
819
|
+
title="permalink"
|
|
820
|
+
class="permalink">
|
|
821
|
+
🔗
|
|
822
|
+
</a>
|
|
823
|
+
</td>
|
|
824
|
+
<td class="is-vcentered">
|
|
825
|
+
<pre>400 16px/150% Sage UI</pre>
|
|
826
|
+
</td>
|
|
827
|
+
<td class="is-vcentered">
|
|
828
|
+
<div class="table__typography-preview">
|
|
829
|
+
n/a
|
|
830
|
+
</div>
|
|
831
|
+
|
|
832
|
+
</td>
|
|
833
|
+
</tr>
|
|
813
834
|
<tr>
|
|
814
835
|
<td class="with-icons is-vcentered"
|
|
815
836
|
id="base-typographyDialogParagraphXs"
|
package/docs/tokens/index.html
CHANGED
|
@@ -2063,11 +2063,11 @@
|
|
|
2063
2063
|
</a>
|
|
2064
2064
|
</td>
|
|
2065
2065
|
<td class="is-vcentered">
|
|
2066
|
-
<pre>#
|
|
2066
|
+
<pre>#db7380ff</pre>
|
|
2067
2067
|
</td>
|
|
2068
2068
|
<td class="is-vcentered">
|
|
2069
2069
|
<div class="table__color-preview"
|
|
2070
|
-
style="background-color: #
|
|
2070
|
+
style="background-color: #db7380ff;">
|
|
2071
2071
|
</div>
|
|
2072
2072
|
|
|
2073
2073
|
</td>
|
|
@@ -2084,11 +2084,11 @@
|
|
|
2084
2084
|
</a>
|
|
2085
2085
|
</td>
|
|
2086
2086
|
<td class="is-vcentered">
|
|
2087
|
-
<pre>#
|
|
2087
|
+
<pre>#d04b5cff</pre>
|
|
2088
2088
|
</td>
|
|
2089
2089
|
<td class="is-vcentered">
|
|
2090
2090
|
<div class="table__color-preview"
|
|
2091
|
-
style="background-color: #
|
|
2091
|
+
style="background-color: #d04b5cff;">
|
|
2092
2092
|
</div>
|
|
2093
2093
|
|
|
2094
2094
|
</td>
|
|
@@ -2105,11 +2105,11 @@
|
|
|
2105
2105
|
</a>
|
|
2106
2106
|
</td>
|
|
2107
2107
|
<td class="is-vcentered">
|
|
2108
|
-
<pre>#
|
|
2108
|
+
<pre>#cb374aff</pre>
|
|
2109
2109
|
</td>
|
|
2110
2110
|
<td class="is-vcentered">
|
|
2111
2111
|
<div class="table__color-preview"
|
|
2112
|
-
style="background-color: #
|
|
2112
|
+
style="background-color: #cb374aff;">
|
|
2113
2113
|
</div>
|
|
2114
2114
|
|
|
2115
2115
|
</td>
|
|
@@ -2126,11 +2126,11 @@
|
|
|
2126
2126
|
</a>
|
|
2127
2127
|
</td>
|
|
2128
2128
|
<td class="is-vcentered">
|
|
2129
|
-
<pre>#
|
|
2129
|
+
<pre>#a22c3bff</pre>
|
|
2130
2130
|
</td>
|
|
2131
2131
|
<td class="is-vcentered">
|
|
2132
2132
|
<div class="table__color-preview"
|
|
2133
|
-
style="background-color: #
|
|
2133
|
+
style="background-color: #a22c3bff;">
|
|
2134
2134
|
</div>
|
|
2135
2135
|
|
|
2136
2136
|
</td>
|
|
@@ -5726,6 +5726,90 @@
|
|
|
5726
5726
|
style="width: 6px">
|
|
5727
5727
|
</div>
|
|
5728
5728
|
|
|
5729
|
+
</td>
|
|
5730
|
+
</tr>
|
|
5731
|
+
<tr>
|
|
5732
|
+
<td class="with-icons is-vcentered"
|
|
5733
|
+
id="base-spacingNeg010"
|
|
5734
|
+
title="theme: base; category: spacing; variant: neg010; ">
|
|
5735
|
+
spacingNeg010
|
|
5736
|
+
<a href="#base-spacingNeg010"
|
|
5737
|
+
title="permalink"
|
|
5738
|
+
class="permalink">
|
|
5739
|
+
🔗
|
|
5740
|
+
</a>
|
|
5741
|
+
</td>
|
|
5742
|
+
<td class="is-vcentered">
|
|
5743
|
+
<pre>-1px</pre>
|
|
5744
|
+
</td>
|
|
5745
|
+
<td class="is-vcentered">
|
|
5746
|
+
<div class="table__spacing-preview"
|
|
5747
|
+
style="width: -1px">
|
|
5748
|
+
</div>
|
|
5749
|
+
|
|
5750
|
+
</td>
|
|
5751
|
+
</tr>
|
|
5752
|
+
<tr>
|
|
5753
|
+
<td class="with-icons is-vcentered"
|
|
5754
|
+
id="base-spacingNeg025"
|
|
5755
|
+
title="theme: base; category: spacing; variant: neg025; ">
|
|
5756
|
+
spacingNeg025
|
|
5757
|
+
<a href="#base-spacingNeg025"
|
|
5758
|
+
title="permalink"
|
|
5759
|
+
class="permalink">
|
|
5760
|
+
🔗
|
|
5761
|
+
</a>
|
|
5762
|
+
</td>
|
|
5763
|
+
<td class="is-vcentered">
|
|
5764
|
+
<pre>-2px</pre>
|
|
5765
|
+
</td>
|
|
5766
|
+
<td class="is-vcentered">
|
|
5767
|
+
<div class="table__spacing-preview"
|
|
5768
|
+
style="width: -2px">
|
|
5769
|
+
</div>
|
|
5770
|
+
|
|
5771
|
+
</td>
|
|
5772
|
+
</tr>
|
|
5773
|
+
<tr>
|
|
5774
|
+
<td class="with-icons is-vcentered"
|
|
5775
|
+
id="base-spacingNeg050"
|
|
5776
|
+
title="theme: base; category: spacing; variant: neg050; ">
|
|
5777
|
+
spacingNeg050
|
|
5778
|
+
<a href="#base-spacingNeg050"
|
|
5779
|
+
title="permalink"
|
|
5780
|
+
class="permalink">
|
|
5781
|
+
🔗
|
|
5782
|
+
</a>
|
|
5783
|
+
</td>
|
|
5784
|
+
<td class="is-vcentered">
|
|
5785
|
+
<pre>-4px</pre>
|
|
5786
|
+
</td>
|
|
5787
|
+
<td class="is-vcentered">
|
|
5788
|
+
<div class="table__spacing-preview"
|
|
5789
|
+
style="width: -4px">
|
|
5790
|
+
</div>
|
|
5791
|
+
|
|
5792
|
+
</td>
|
|
5793
|
+
</tr>
|
|
5794
|
+
<tr>
|
|
5795
|
+
<td class="with-icons is-vcentered"
|
|
5796
|
+
id="base-spacingNeg075"
|
|
5797
|
+
title="theme: base; category: spacing; variant: neg075; ">
|
|
5798
|
+
spacingNeg075
|
|
5799
|
+
<a href="#base-spacingNeg075"
|
|
5800
|
+
title="permalink"
|
|
5801
|
+
class="permalink">
|
|
5802
|
+
🔗
|
|
5803
|
+
</a>
|
|
5804
|
+
</td>
|
|
5805
|
+
<td class="is-vcentered">
|
|
5806
|
+
<pre>-6px</pre>
|
|
5807
|
+
</td>
|
|
5808
|
+
<td class="is-vcentered">
|
|
5809
|
+
<div class="table__spacing-preview"
|
|
5810
|
+
style="width: -6px">
|
|
5811
|
+
</div>
|
|
5812
|
+
|
|
5729
5813
|
</td>
|
|
5730
5814
|
</tr>
|
|
5731
5815
|
</table>
|
|
@@ -6811,7 +6895,7 @@
|
|
|
6811
6895
|
</a>
|
|
6812
6896
|
</td>
|
|
6813
6897
|
<td class="is-vcentered">
|
|
6814
|
-
<pre>
|
|
6898
|
+
<pre>500 14px/150% Sage UI</pre>
|
|
6815
6899
|
</td>
|
|
6816
6900
|
<td class="is-vcentered">
|
|
6817
6901
|
<div class="table__typography-preview">
|
|
@@ -7261,6 +7345,27 @@
|
|
|
7261
7345
|
|
|
7262
7346
|
</td>
|
|
7263
7347
|
</tr>
|
|
7348
|
+
<tr>
|
|
7349
|
+
<td class="with-icons is-vcentered"
|
|
7350
|
+
id="base-typographyDialogSubtitle"
|
|
7351
|
+
title="theme: base; category: typography; name: dialog; variant: subtitle; ">
|
|
7352
|
+
typographyDialogSubtitle
|
|
7353
|
+
<a href="#base-typographyDialogSubtitle"
|
|
7354
|
+
title="permalink"
|
|
7355
|
+
class="permalink">
|
|
7356
|
+
🔗
|
|
7357
|
+
</a>
|
|
7358
|
+
</td>
|
|
7359
|
+
<td class="is-vcentered">
|
|
7360
|
+
<pre>400 16px/150% Sage UI</pre>
|
|
7361
|
+
</td>
|
|
7362
|
+
<td class="is-vcentered">
|
|
7363
|
+
<div class="table__typography-preview">
|
|
7364
|
+
n/a
|
|
7365
|
+
</div>
|
|
7366
|
+
|
|
7367
|
+
</td>
|
|
7368
|
+
</tr>
|
|
7264
7369
|
<tr>
|
|
7265
7370
|
<td class="with-icons is-vcentered"
|
|
7266
7371
|
id="base-typographyDialogParagraphXs"
|
package/ios/base.h
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
//
|
|
5
5
|
|
|
6
6
|
// Do not edit directly
|
|
7
|
-
// Generated on
|
|
7
|
+
// Generated on Tue, 06 Sep 2022 13:51:10 GMT
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
#import <Foundation/Foundation.h>
|
|
@@ -96,10 +96,10 @@
|
|
|
96
96
|
#define colorsSemanticPositiveYin065 #000000a6
|
|
97
97
|
#define colorsSemanticPositiveYin090 #000000e6
|
|
98
98
|
#define colorsSemanticPositiveYang100 #ffffffff
|
|
99
|
-
#define colorsSemanticNegative350 #
|
|
100
|
-
#define colorsSemanticNegative450 #
|
|
101
|
-
#define colorsSemanticNegative500 #
|
|
102
|
-
#define colorsSemanticNegative600 #
|
|
99
|
+
#define colorsSemanticNegative350 #db7380ff
|
|
100
|
+
#define colorsSemanticNegative450 #d04b5cff
|
|
101
|
+
#define colorsSemanticNegative500 #cb374aff
|
|
102
|
+
#define colorsSemanticNegative600 #a22c3bff
|
|
103
103
|
#define colorsSemanticNegativeTransparent #00000000
|
|
104
104
|
#define colorsSemanticNegativeYin030 #0000004d
|
|
105
105
|
#define colorsSemanticNegativeYin055 #0000008c
|
|
@@ -269,6 +269,10 @@
|
|
|
269
269
|
#define spacing050 4px
|
|
270
270
|
#define spacing060 5px
|
|
271
271
|
#define spacing075 6px
|
|
272
|
+
#define spacingNeg010 -1px
|
|
273
|
+
#define spacingNeg025 -2px
|
|
274
|
+
#define spacingNeg050 -4px
|
|
275
|
+
#define spacingNeg075 -6px
|
|
272
276
|
#define borderWidth100 1px
|
|
273
277
|
#define borderWidth200 2px
|
|
274
278
|
#define borderWidth300 3px
|
|
@@ -311,7 +315,7 @@
|
|
|
311
315
|
#define typographyAccordionTitleM Bold 20px/125% Sage UI
|
|
312
316
|
#define typographyAccordionSubtitleM Regular 14px/150% Sage UI
|
|
313
317
|
#define typographyAccordionParagraphM Regular 14px/150% Sage UI
|
|
314
|
-
#define typographyActionPopoverMenuItemM
|
|
318
|
+
#define typographyActionPopoverMenuItemM Medium 14px/150% Sage UI
|
|
315
319
|
#define typographyAnchorNavLabelM Medium 14px/150% Sage UI
|
|
316
320
|
#define typographyBadgeLabelM Medium 12px/150% Sage UI
|
|
317
321
|
#define typographyButtonLabelS Medium 14px/150% Sage UI
|
|
@@ -333,6 +337,7 @@
|
|
|
333
337
|
#define typographyDialogTitleL Bold 24px/125% Sage UI
|
|
334
338
|
#define typographyDialogTitleXl Bold 24px/125% Sage UI
|
|
335
339
|
#define typographyDialogTitleXxl Bold 24px/125% Sage UI
|
|
340
|
+
#define typographyDialogSubtitle Regular 16px/150% Sage UI
|
|
336
341
|
#define typographyDialogParagraphXs Regular 14px/150% Sage UI
|
|
337
342
|
#define typographyDialogParagraphS Regular 14px/150% Sage UI
|
|
338
343
|
#define typographyDialogParagraphMs Regular 14px/150% Sage UI
|
package/js/base/common.d.ts
CHANGED
|
@@ -257,6 +257,10 @@ export const spacing025: string;
|
|
|
257
257
|
export const spacing050: string;
|
|
258
258
|
export const spacing060: string;
|
|
259
259
|
export const spacing075: string;
|
|
260
|
+
export const spacingNeg010: string;
|
|
261
|
+
export const spacingNeg025: string;
|
|
262
|
+
export const spacingNeg050: string;
|
|
263
|
+
export const spacingNeg075: string;
|
|
260
264
|
export const borderWidth100: string;
|
|
261
265
|
export const borderWidth200: string;
|
|
262
266
|
export const borderWidth300: string;
|
|
@@ -321,6 +325,7 @@ export const typographyDialogTitleMl: string;
|
|
|
321
325
|
export const typographyDialogTitleL: string;
|
|
322
326
|
export const typographyDialogTitleXl: string;
|
|
323
327
|
export const typographyDialogTitleXxl: string;
|
|
328
|
+
export const typographyDialogSubtitle: string;
|
|
324
329
|
export const typographyDialogParagraphXs: string;
|
|
325
330
|
export const typographyDialogParagraphS: string;
|
|
326
331
|
export const typographyDialogParagraphMs: string;
|
package/js/base/common.js
CHANGED
|
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Do not edit directly
|
|
7
|
-
* Generated on
|
|
7
|
+
* Generated on Tue, 06 Sep 2022 13:51:10 GMT
|
|
8
8
|
*/
|
|
9
9
|
|
|
10
10
|
module.exports = {
|
|
@@ -94,10 +94,10 @@ module.exports = {
|
|
|
94
94
|
colorsSemanticPositiveYin065: '#000000a6',
|
|
95
95
|
colorsSemanticPositiveYin090: '#000000e6',
|
|
96
96
|
colorsSemanticPositiveYang100: '#ffffffff',
|
|
97
|
-
colorsSemanticNegative350: '#
|
|
98
|
-
colorsSemanticNegative450: '#
|
|
99
|
-
colorsSemanticNegative500: '#
|
|
100
|
-
colorsSemanticNegative600: '#
|
|
97
|
+
colorsSemanticNegative350: '#db7380ff',
|
|
98
|
+
colorsSemanticNegative450: '#d04b5cff',
|
|
99
|
+
colorsSemanticNegative500: '#cb374aff',
|
|
100
|
+
colorsSemanticNegative600: '#a22c3bff',
|
|
101
101
|
colorsSemanticNegativeTransparent: '#00000000',
|
|
102
102
|
colorsSemanticNegativeYin030: '#0000004d',
|
|
103
103
|
colorsSemanticNegativeYin055: '#0000008c',
|
|
@@ -267,6 +267,10 @@ module.exports = {
|
|
|
267
267
|
spacing050: '4px',
|
|
268
268
|
spacing060: '5px',
|
|
269
269
|
spacing075: '6px',
|
|
270
|
+
spacingNeg010: '-1px',
|
|
271
|
+
spacingNeg025: '-2px',
|
|
272
|
+
spacingNeg050: '-4px',
|
|
273
|
+
spacingNeg075: '-6px',
|
|
270
274
|
borderWidth100: '1px',
|
|
271
275
|
borderWidth200: '2px',
|
|
272
276
|
borderWidth300: '3px',
|
|
@@ -309,7 +313,7 @@ module.exports = {
|
|
|
309
313
|
typographyAccordionTitleM: '700 20px/125% Sage UI',
|
|
310
314
|
typographyAccordionSubtitleM: '400 14px/150% Sage UI',
|
|
311
315
|
typographyAccordionParagraphM: '400 14px/150% Sage UI',
|
|
312
|
-
typographyActionPopoverMenuItemM: '
|
|
316
|
+
typographyActionPopoverMenuItemM: '500 14px/150% Sage UI',
|
|
313
317
|
typographyAnchorNavLabelM: '500 14px/150% Sage UI',
|
|
314
318
|
typographyBadgeLabelM: '500 12px/150% Sage UI',
|
|
315
319
|
typographyButtonLabelS: '500 14px/150% Sage UI',
|
|
@@ -331,6 +335,7 @@ module.exports = {
|
|
|
331
335
|
typographyDialogTitleL: '700 24px/125% Sage UI',
|
|
332
336
|
typographyDialogTitleXl: '700 24px/125% Sage UI',
|
|
333
337
|
typographyDialogTitleXxl: '700 24px/125% Sage UI',
|
|
338
|
+
typographyDialogSubtitle: '400 16px/150% Sage UI',
|
|
334
339
|
typographyDialogParagraphXs: '400 14px/150% Sage UI',
|
|
335
340
|
typographyDialogParagraphS: '400 14px/150% Sage UI',
|
|
336
341
|
typographyDialogParagraphMs: '400 14px/150% Sage UI',
|
package/js/base/es6.d.ts
CHANGED
|
@@ -258,6 +258,10 @@ declare namespace _default {
|
|
|
258
258
|
const spacing050: string;
|
|
259
259
|
const spacing060: string;
|
|
260
260
|
const spacing075: string;
|
|
261
|
+
const spacingNeg010: string;
|
|
262
|
+
const spacingNeg025: string;
|
|
263
|
+
const spacingNeg050: string;
|
|
264
|
+
const spacingNeg075: string;
|
|
261
265
|
const borderWidth100: string;
|
|
262
266
|
const borderWidth200: string;
|
|
263
267
|
const borderWidth300: string;
|
|
@@ -322,6 +326,7 @@ declare namespace _default {
|
|
|
322
326
|
const typographyDialogTitleL: string;
|
|
323
327
|
const typographyDialogTitleXl: string;
|
|
324
328
|
const typographyDialogTitleXxl: string;
|
|
329
|
+
const typographyDialogSubtitle: string;
|
|
325
330
|
const typographyDialogParagraphXs: string;
|
|
326
331
|
const typographyDialogParagraphS: string;
|
|
327
332
|
const typographyDialogParagraphMs: string;
|
package/js/base/es6.js
CHANGED
|
@@ -89,10 +89,10 @@ export default {
|
|
|
89
89
|
colorsSemanticPositiveYin065: '#000000a6',
|
|
90
90
|
colorsSemanticPositiveYin090: '#000000e6',
|
|
91
91
|
colorsSemanticPositiveYang100: '#ffffffff',
|
|
92
|
-
colorsSemanticNegative350: '#
|
|
93
|
-
colorsSemanticNegative450: '#
|
|
94
|
-
colorsSemanticNegative500: '#
|
|
95
|
-
colorsSemanticNegative600: '#
|
|
92
|
+
colorsSemanticNegative350: '#db7380ff',
|
|
93
|
+
colorsSemanticNegative450: '#d04b5cff',
|
|
94
|
+
colorsSemanticNegative500: '#cb374aff',
|
|
95
|
+
colorsSemanticNegative600: '#a22c3bff',
|
|
96
96
|
colorsSemanticNegativeTransparent: '#00000000',
|
|
97
97
|
colorsSemanticNegativeYin030: '#0000004d',
|
|
98
98
|
colorsSemanticNegativeYin055: '#0000008c',
|
|
@@ -262,6 +262,10 @@ export default {
|
|
|
262
262
|
spacing050: '4px',
|
|
263
263
|
spacing060: '5px',
|
|
264
264
|
spacing075: '6px',
|
|
265
|
+
spacingNeg010: '-1px',
|
|
266
|
+
spacingNeg025: '-2px',
|
|
267
|
+
spacingNeg050: '-4px',
|
|
268
|
+
spacingNeg075: '-6px',
|
|
265
269
|
borderWidth100: '1px',
|
|
266
270
|
borderWidth200: '2px',
|
|
267
271
|
borderWidth300: '3px',
|
|
@@ -304,7 +308,7 @@ export default {
|
|
|
304
308
|
typographyAccordionTitleM: '700 20px/125% Sage UI',
|
|
305
309
|
typographyAccordionSubtitleM: '400 14px/150% Sage UI',
|
|
306
310
|
typographyAccordionParagraphM: '400 14px/150% Sage UI',
|
|
307
|
-
typographyActionPopoverMenuItemM: '
|
|
311
|
+
typographyActionPopoverMenuItemM: '500 14px/150% Sage UI',
|
|
308
312
|
typographyAnchorNavLabelM: '500 14px/150% Sage UI',
|
|
309
313
|
typographyBadgeLabelM: '500 12px/150% Sage UI',
|
|
310
314
|
typographyButtonLabelS: '500 14px/150% Sage UI',
|
|
@@ -326,6 +330,7 @@ export default {
|
|
|
326
330
|
typographyDialogTitleL: '700 24px/125% Sage UI',
|
|
327
331
|
typographyDialogTitleXl: '700 24px/125% Sage UI',
|
|
328
332
|
typographyDialogTitleXxl: '700 24px/125% Sage UI',
|
|
333
|
+
typographyDialogSubtitle: '400 16px/150% Sage UI',
|
|
329
334
|
typographyDialogParagraphXs: '400 14px/150% Sage UI',
|
|
330
335
|
typographyDialogParagraphS: '400 14px/150% Sage UI',
|
|
331
336
|
typographyDialogParagraphMs: '400 14px/150% Sage UI',
|
package/package.json
CHANGED
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
},
|
|
11
11
|
"description": "Design tokens for the Sage Design System.",
|
|
12
12
|
"author": "The Sage Group plc",
|
|
13
|
-
"version": "2.
|
|
13
|
+
"version": "2.41.0",
|
|
14
14
|
"license": "SEE LICENSE IN https://github.com/Sage/design-tokens/blob/master/license",
|
|
15
15
|
"tags": [
|
|
16
16
|
"design tokens",
|
|
Binary file
|
package/scss/base.scss
CHANGED
|
@@ -4,7 +4,7 @@ Copyright © 2021 The Sage Group plc or its licensors. All Rights reserved
|
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
// Do not edit directly
|
|
7
|
-
// Generated on
|
|
7
|
+
// Generated on Tue, 06 Sep 2022 13:51:10 GMT
|
|
8
8
|
|
|
9
9
|
$metaName: Base Theme;
|
|
10
10
|
$metaPublic: true;
|
|
@@ -92,10 +92,10 @@ $colorsSemanticPositiveYin055: #0000008c;
|
|
|
92
92
|
$colorsSemanticPositiveYin065: #000000a6;
|
|
93
93
|
$colorsSemanticPositiveYin090: #000000e6;
|
|
94
94
|
$colorsSemanticPositiveYang100: #ffffffff;
|
|
95
|
-
$colorsSemanticNegative350: #
|
|
96
|
-
$colorsSemanticNegative450: #
|
|
97
|
-
$colorsSemanticNegative500: #
|
|
98
|
-
$colorsSemanticNegative600: #
|
|
95
|
+
$colorsSemanticNegative350: #db7380ff;
|
|
96
|
+
$colorsSemanticNegative450: #d04b5cff;
|
|
97
|
+
$colorsSemanticNegative500: #cb374aff;
|
|
98
|
+
$colorsSemanticNegative600: #a22c3bff;
|
|
99
99
|
$colorsSemanticNegativeTransparent: #00000000;
|
|
100
100
|
$colorsSemanticNegativeYin030: #0000004d;
|
|
101
101
|
$colorsSemanticNegativeYin055: #0000008c;
|
|
@@ -265,6 +265,10 @@ $spacing025: 2px;
|
|
|
265
265
|
$spacing050: 4px;
|
|
266
266
|
$spacing060: 5px;
|
|
267
267
|
$spacing075: 6px;
|
|
268
|
+
$spacingNeg010: -1px;
|
|
269
|
+
$spacingNeg025: -2px;
|
|
270
|
+
$spacingNeg050: -4px;
|
|
271
|
+
$spacingNeg075: -6px;
|
|
268
272
|
$borderWidth100: 1px;
|
|
269
273
|
$borderWidth200: 2px;
|
|
270
274
|
$borderWidth300: 3px;
|
|
@@ -307,7 +311,7 @@ $borderRadiusCircle: 50%;
|
|
|
307
311
|
$typographyAccordionTitleM: 700 20px/125% Sage UI;
|
|
308
312
|
$typographyAccordionSubtitleM: 400 14px/150% Sage UI;
|
|
309
313
|
$typographyAccordionParagraphM: 400 14px/150% Sage UI;
|
|
310
|
-
$typographyActionPopoverMenuItemM:
|
|
314
|
+
$typographyActionPopoverMenuItemM: 500 14px/150% Sage UI;
|
|
311
315
|
$typographyAnchorNavLabelM: 500 14px/150% Sage UI;
|
|
312
316
|
$typographyBadgeLabelM: 500 12px/150% Sage UI;
|
|
313
317
|
$typographyButtonLabelS: 500 14px/150% Sage UI;
|
|
@@ -329,6 +333,7 @@ $typographyDialogTitleMl: 700 24px/125% Sage UI;
|
|
|
329
333
|
$typographyDialogTitleL: 700 24px/125% Sage UI;
|
|
330
334
|
$typographyDialogTitleXl: 700 24px/125% Sage UI;
|
|
331
335
|
$typographyDialogTitleXxl: 700 24px/125% Sage UI;
|
|
336
|
+
$typographyDialogSubtitle: 400 16px/150% Sage UI;
|
|
332
337
|
$typographyDialogParagraphXs: 400 14px/150% Sage UI;
|
|
333
338
|
$typographyDialogParagraphS: 400 14px/150% Sage UI;
|
|
334
339
|
$typographyDialogParagraphMs: 400 14px/150% Sage UI;
|
|
Binary file
|