@sage/design-tokens 2.9.0 → 2.12.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 +28 -11
- package/css/base.css +28 -11
- package/data/tokens.json +210 -61
- package/docs/tokens/base/box-shadow/index.html +42 -0
- package/docs/tokens/base/colors/index.html +314 -20
- package/docs/tokens/base/index.html +377 -20
- package/docs/tokens/base/typography/index.html +21 -0
- package/docs/tokens/index.html +377 -20
- package/ios/base.h +28 -11
- package/js/base/common.d.ts +17 -0
- package/js/base/common.js +28 -11
- package/js/base/es6.d.ts +17 -0
- package/js/base/es6.js +27 -10
- package/package.json +1 -1
- package/sage-design-tokens-2.12.0.tgz +0 -0
- package/scss/base.scss +28 -11
- package/sage-design-tokens-2.9.0.tgz +0 -0
package/js/base/common.d.ts
CHANGED
|
@@ -10,6 +10,8 @@ export const colorsYin090: string;
|
|
|
10
10
|
export const colorsYang100: string;
|
|
11
11
|
export const colorsYang030: string;
|
|
12
12
|
export const colorsYang080: string;
|
|
13
|
+
export const colorsGray700: string;
|
|
14
|
+
export const colorsGray750: string;
|
|
13
15
|
export const colorsGray850: string;
|
|
14
16
|
export const colorsGray900: string;
|
|
15
17
|
export const colorsGray1000: string;
|
|
@@ -29,19 +31,29 @@ export const colorsComponentsMenuSpringParent700: string;
|
|
|
29
31
|
export const colorsComponentsMenuSpringChild400: string;
|
|
30
32
|
export const colorsComponentsMenuSpringChild500: string;
|
|
31
33
|
export const colorsComponentsMenuSpringChild600: string;
|
|
34
|
+
export const colorsComponentsMenuSpringChildAlt400: string;
|
|
32
35
|
export const colorsComponentsMenuSpringChildAlt500: string;
|
|
33
36
|
export const colorsComponentsMenuSpringChildAlt600: string;
|
|
37
|
+
export const colorsComponentsMenuSummerStandard400: string;
|
|
34
38
|
export const colorsComponentsMenuSummerStandard500: string;
|
|
35
39
|
export const colorsComponentsMenuSummerStandard600: string;
|
|
36
40
|
export const colorsComponentsMenuSummerStandard700: string;
|
|
41
|
+
export const colorsComponentsMenuSummerStandard800: string;
|
|
37
42
|
export const colorsComponentsMenuSummerParent500: string;
|
|
38
43
|
export const colorsComponentsMenuSummerParent600: string;
|
|
39
44
|
export const colorsComponentsMenuSummerParent700: string;
|
|
45
|
+
export const colorsComponentsMenuSummerChild300: string;
|
|
40
46
|
export const colorsComponentsMenuSummerChild400: string;
|
|
41
47
|
export const colorsComponentsMenuSummerChild500: string;
|
|
42
48
|
export const colorsComponentsMenuSummerChild600: string;
|
|
49
|
+
export const colorsComponentsMenuSummerChild700: string;
|
|
50
|
+
export const colorsComponentsMenuSummerChild800: string;
|
|
51
|
+
export const colorsComponentsMenuSummerChildAlt300: string;
|
|
52
|
+
export const colorsComponentsMenuSummerChildAlt400: string;
|
|
43
53
|
export const colorsComponentsMenuSummerChildAlt500: string;
|
|
44
54
|
export const colorsComponentsMenuSummerChildAlt600: string;
|
|
55
|
+
export const colorsComponentsMenuSummerChildAlt700: string;
|
|
56
|
+
export const colorsComponentsMenuSummerChildAlt800: string;
|
|
45
57
|
export const colorsComponentsMenuAutumnStandard500: string;
|
|
46
58
|
export const colorsComponentsMenuAutumnStandard600: string;
|
|
47
59
|
export const colorsComponentsMenuAutumnStandard700: string;
|
|
@@ -51,6 +63,7 @@ export const colorsComponentsMenuAutumnParent700: string;
|
|
|
51
63
|
export const colorsComponentsMenuAutumnChild400: string;
|
|
52
64
|
export const colorsComponentsMenuAutumnChild500: string;
|
|
53
65
|
export const colorsComponentsMenuAutumnChild600: string;
|
|
66
|
+
export const colorsComponentsMenuAutumnChildAlt400: string;
|
|
54
67
|
export const colorsComponentsMenuAutumnChildAlt500: string;
|
|
55
68
|
export const colorsComponentsMenuAutumnChildAlt600: string;
|
|
56
69
|
export const colorsComponentsMenuWinterStandard500: string;
|
|
@@ -62,6 +75,7 @@ export const colorsComponentsMenuWinterParent700: string;
|
|
|
62
75
|
export const colorsComponentsMenuWinterChild400: string;
|
|
63
76
|
export const colorsComponentsMenuWinterChild500: string;
|
|
64
77
|
export const colorsComponentsMenuWinterChild600: string;
|
|
78
|
+
export const colorsComponentsMenuWinterChildAlt400: string;
|
|
65
79
|
export const colorsComponentsMenuWinterChildAlt500: string;
|
|
66
80
|
export const colorsComponentsMenuWinterChildAlt600: string;
|
|
67
81
|
export const colorsComponentsMenuYin100: string;
|
|
@@ -249,6 +263,8 @@ export const boxShadow300: string;
|
|
|
249
263
|
export const boxShadow400: string;
|
|
250
264
|
export const boxShadow075: string;
|
|
251
265
|
export const boxShadow050: string;
|
|
266
|
+
export const boxShadow090: string;
|
|
267
|
+
export const boxShadow091: string;
|
|
252
268
|
export const fontWeights400: string;
|
|
253
269
|
export const fontWeights500: string;
|
|
254
270
|
export const fontWeights700: string;
|
|
@@ -317,6 +333,7 @@ export const typographyLinkTextS: string;
|
|
|
317
333
|
export const typographyLinkTextM: string;
|
|
318
334
|
export const typographyLinkTextL: string;
|
|
319
335
|
export const typographyMenuLabelM: string;
|
|
336
|
+
export const typographyMenuLabelL: string;
|
|
320
337
|
export const typographyMenuSegmentTitleM: string;
|
|
321
338
|
export const typographyMessageHeadingM: string;
|
|
322
339
|
export const typographyMessageHeadingL: 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 Fri, 01 Apr 2022 11:37:42 GMT
|
|
8
8
|
*/
|
|
9
9
|
|
|
10
10
|
module.exports = {
|
|
@@ -20,8 +20,10 @@ module.exports = {
|
|
|
20
20
|
colorsYang100: '#ffffffff',
|
|
21
21
|
colorsYang030: '#ffffff4d',
|
|
22
22
|
colorsYang080: '#ffffffcc',
|
|
23
|
+
colorsGray700: '#4d4d4dff',
|
|
24
|
+
colorsGray750: '#404040ff',
|
|
23
25
|
colorsGray850: '#262626ff',
|
|
24
|
-
colorsGray900: '#
|
|
26
|
+
colorsGray900: '#191919ff',
|
|
25
27
|
colorsGray1000: '#000000ff',
|
|
26
28
|
colorsGray000: '#ffffffff',
|
|
27
29
|
colorsDisabled400: '#f2f5f6ff',
|
|
@@ -34,45 +36,57 @@ module.exports = {
|
|
|
34
36
|
colorsComponentsMenuSpringStandard600: '#007e45ff',
|
|
35
37
|
colorsComponentsMenuSpringStandard700: '#d9e0e4ff',
|
|
36
38
|
colorsComponentsMenuSpringParent500: '#e6ebedff',
|
|
37
|
-
colorsComponentsMenuSpringParent600: '#
|
|
39
|
+
colorsComponentsMenuSpringParent600: '#007e45ff',
|
|
38
40
|
colorsComponentsMenuSpringParent700: '#d9e0e4ff',
|
|
39
41
|
colorsComponentsMenuSpringChild400: '#ccd6dbff',
|
|
40
42
|
colorsComponentsMenuSpringChild500: '#ffffffff',
|
|
41
43
|
colorsComponentsMenuSpringChild600: '#007e45ff',
|
|
44
|
+
colorsComponentsMenuSpringChildAlt400: '#ccd6dbff',
|
|
42
45
|
colorsComponentsMenuSpringChildAlt500: '#e6ebedff',
|
|
43
46
|
colorsComponentsMenuSpringChildAlt600: '#007e45ff',
|
|
47
|
+
colorsComponentsMenuSummerStandard400: '#ccd6dbff',
|
|
44
48
|
colorsComponentsMenuSummerStandard500: '#ffffffff',
|
|
45
49
|
colorsComponentsMenuSummerStandard600: '#007e45ff',
|
|
46
|
-
colorsComponentsMenuSummerStandard700: '#
|
|
50
|
+
colorsComponentsMenuSummerStandard700: '#e6ebedff',
|
|
51
|
+
colorsComponentsMenuSummerStandard800: '#e6ebedff',
|
|
47
52
|
colorsComponentsMenuSummerParent500: '#ffffffff',
|
|
48
|
-
colorsComponentsMenuSummerParent600: '#
|
|
49
|
-
colorsComponentsMenuSummerParent700: '#
|
|
50
|
-
|
|
53
|
+
colorsComponentsMenuSummerParent600: '#007e45ff',
|
|
54
|
+
colorsComponentsMenuSummerParent700: '#e6ebedff',
|
|
55
|
+
colorsComponentsMenuSummerChild300: '#b3c2c9ff',
|
|
56
|
+
colorsComponentsMenuSummerChild400: '#ccd6dbff',
|
|
51
57
|
colorsComponentsMenuSummerChild500: '#e6ebedff',
|
|
52
58
|
colorsComponentsMenuSummerChild600: '#007e45ff',
|
|
53
|
-
|
|
59
|
+
colorsComponentsMenuSummerChild700: '#e6ebedff',
|
|
60
|
+
colorsComponentsMenuSummerChild800: '#e6ebedff',
|
|
61
|
+
colorsComponentsMenuSummerChildAlt300: '#b3c2c9ff',
|
|
62
|
+
colorsComponentsMenuSummerChildAlt400: '#ccd6dbff',
|
|
63
|
+
colorsComponentsMenuSummerChildAlt500: '#d9e0e4ff',
|
|
54
64
|
colorsComponentsMenuSummerChildAlt600: '#007e45ff',
|
|
65
|
+
colorsComponentsMenuSummerChildAlt700: '#d9e0e4ff',
|
|
66
|
+
colorsComponentsMenuSummerChildAlt800: '#d9e0e4ff',
|
|
55
67
|
colorsComponentsMenuAutumnStandard500: '#00324cff',
|
|
56
68
|
colorsComponentsMenuAutumnStandard600: '#007e45ff',
|
|
57
69
|
colorsComponentsMenuAutumnStandard700: '#19475eff',
|
|
58
70
|
colorsComponentsMenuAutumnParent500: '#00324cff',
|
|
59
|
-
colorsComponentsMenuAutumnParent600: '#
|
|
71
|
+
colorsComponentsMenuAutumnParent600: '#007e45ff',
|
|
60
72
|
colorsComponentsMenuAutumnParent700: '#19475eff',
|
|
61
73
|
colorsComponentsMenuAutumnChild400: '#19475eff',
|
|
62
74
|
colorsComponentsMenuAutumnChild500: '#001926ff',
|
|
63
75
|
colorsComponentsMenuAutumnChild600: '#007e45ff',
|
|
76
|
+
colorsComponentsMenuAutumnChildAlt400: '#19475eff',
|
|
64
77
|
colorsComponentsMenuAutumnChildAlt500: '#00324cff',
|
|
65
78
|
colorsComponentsMenuAutumnChildAlt600: '#007e45ff',
|
|
66
79
|
colorsComponentsMenuWinterStandard500: '#000000ff',
|
|
67
80
|
colorsComponentsMenuWinterStandard600: '#007e45ff',
|
|
68
81
|
colorsComponentsMenuWinterStandard700: '#262626ff',
|
|
69
82
|
colorsComponentsMenuWinterParent500: '#000000ff',
|
|
70
|
-
colorsComponentsMenuWinterParent600: '#
|
|
83
|
+
colorsComponentsMenuWinterParent600: '#007e45ff',
|
|
71
84
|
colorsComponentsMenuWinterParent700: '#262626ff',
|
|
72
85
|
colorsComponentsMenuWinterChild400: '#262626ff',
|
|
73
86
|
colorsComponentsMenuWinterChild500: '#000000ff',
|
|
74
87
|
colorsComponentsMenuWinterChild600: '#007e45ff',
|
|
75
|
-
|
|
88
|
+
colorsComponentsMenuWinterChildAlt400: '#262626ff',
|
|
89
|
+
colorsComponentsMenuWinterChildAlt500: '#191919ff',
|
|
76
90
|
colorsComponentsMenuWinterChildAlt600: '#007e45ff',
|
|
77
91
|
colorsComponentsMenuYin100: '#000000ff',
|
|
78
92
|
colorsComponentsMenuYin065: '#000000a6',
|
|
@@ -259,6 +273,8 @@ module.exports = {
|
|
|
259
273
|
boxShadow400: '0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a',
|
|
260
274
|
boxShadow075: 'inset 0 6px 4px -4px #00141e0d',
|
|
261
275
|
boxShadow050: '0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26',
|
|
276
|
+
boxShadow090: '0 4px 8px -4px #00141e1a',
|
|
277
|
+
boxShadow091: '4px 0 8px -4px #00141e1a',
|
|
262
278
|
fontWeights400: '400',
|
|
263
279
|
fontWeights500: '500',
|
|
264
280
|
fontWeights700: '700',
|
|
@@ -327,6 +343,7 @@ module.exports = {
|
|
|
327
343
|
typographyLinkTextM: '400 14px/150% Sage UI',
|
|
328
344
|
typographyLinkTextL: 'undefined 16px/150% Sage UI',
|
|
329
345
|
typographyMenuLabelM: '500 14px/150% Sage UI',
|
|
346
|
+
typographyMenuLabelL: '500 16px/150% Sage UI',
|
|
330
347
|
typographyMenuSegmentTitleM: '500 12px/150% Sage UI',
|
|
331
348
|
typographyMessageHeadingM: '700 14px/150% Sage UI',
|
|
332
349
|
typographyMessageHeadingL: '700 16px/150% Sage UI',
|
package/js/base/es6.d.ts
CHANGED
|
@@ -11,6 +11,8 @@ declare namespace _default {
|
|
|
11
11
|
const colorsYang100: string;
|
|
12
12
|
const colorsYang030: string;
|
|
13
13
|
const colorsYang080: string;
|
|
14
|
+
const colorsGray700: string;
|
|
15
|
+
const colorsGray750: string;
|
|
14
16
|
const colorsGray850: string;
|
|
15
17
|
const colorsGray900: string;
|
|
16
18
|
const colorsGray1000: string;
|
|
@@ -30,19 +32,29 @@ declare namespace _default {
|
|
|
30
32
|
const colorsComponentsMenuSpringChild400: string;
|
|
31
33
|
const colorsComponentsMenuSpringChild500: string;
|
|
32
34
|
const colorsComponentsMenuSpringChild600: string;
|
|
35
|
+
const colorsComponentsMenuSpringChildAlt400: string;
|
|
33
36
|
const colorsComponentsMenuSpringChildAlt500: string;
|
|
34
37
|
const colorsComponentsMenuSpringChildAlt600: string;
|
|
38
|
+
const colorsComponentsMenuSummerStandard400: string;
|
|
35
39
|
const colorsComponentsMenuSummerStandard500: string;
|
|
36
40
|
const colorsComponentsMenuSummerStandard600: string;
|
|
37
41
|
const colorsComponentsMenuSummerStandard700: string;
|
|
42
|
+
const colorsComponentsMenuSummerStandard800: string;
|
|
38
43
|
const colorsComponentsMenuSummerParent500: string;
|
|
39
44
|
const colorsComponentsMenuSummerParent600: string;
|
|
40
45
|
const colorsComponentsMenuSummerParent700: string;
|
|
46
|
+
const colorsComponentsMenuSummerChild300: string;
|
|
41
47
|
const colorsComponentsMenuSummerChild400: string;
|
|
42
48
|
const colorsComponentsMenuSummerChild500: string;
|
|
43
49
|
const colorsComponentsMenuSummerChild600: string;
|
|
50
|
+
const colorsComponentsMenuSummerChild700: string;
|
|
51
|
+
const colorsComponentsMenuSummerChild800: string;
|
|
52
|
+
const colorsComponentsMenuSummerChildAlt300: string;
|
|
53
|
+
const colorsComponentsMenuSummerChildAlt400: string;
|
|
44
54
|
const colorsComponentsMenuSummerChildAlt500: string;
|
|
45
55
|
const colorsComponentsMenuSummerChildAlt600: string;
|
|
56
|
+
const colorsComponentsMenuSummerChildAlt700: string;
|
|
57
|
+
const colorsComponentsMenuSummerChildAlt800: string;
|
|
46
58
|
const colorsComponentsMenuAutumnStandard500: string;
|
|
47
59
|
const colorsComponentsMenuAutumnStandard600: string;
|
|
48
60
|
const colorsComponentsMenuAutumnStandard700: string;
|
|
@@ -52,6 +64,7 @@ declare namespace _default {
|
|
|
52
64
|
const colorsComponentsMenuAutumnChild400: string;
|
|
53
65
|
const colorsComponentsMenuAutumnChild500: string;
|
|
54
66
|
const colorsComponentsMenuAutumnChild600: string;
|
|
67
|
+
const colorsComponentsMenuAutumnChildAlt400: string;
|
|
55
68
|
const colorsComponentsMenuAutumnChildAlt500: string;
|
|
56
69
|
const colorsComponentsMenuAutumnChildAlt600: string;
|
|
57
70
|
const colorsComponentsMenuWinterStandard500: string;
|
|
@@ -63,6 +76,7 @@ declare namespace _default {
|
|
|
63
76
|
const colorsComponentsMenuWinterChild400: string;
|
|
64
77
|
const colorsComponentsMenuWinterChild500: string;
|
|
65
78
|
const colorsComponentsMenuWinterChild600: string;
|
|
79
|
+
const colorsComponentsMenuWinterChildAlt400: string;
|
|
66
80
|
const colorsComponentsMenuWinterChildAlt500: string;
|
|
67
81
|
const colorsComponentsMenuWinterChildAlt600: string;
|
|
68
82
|
const colorsComponentsMenuYin100: string;
|
|
@@ -250,6 +264,8 @@ declare namespace _default {
|
|
|
250
264
|
const boxShadow400: string;
|
|
251
265
|
const boxShadow075: string;
|
|
252
266
|
const boxShadow050: string;
|
|
267
|
+
const boxShadow090: string;
|
|
268
|
+
const boxShadow091: string;
|
|
253
269
|
const fontWeights400: string;
|
|
254
270
|
const fontWeights500: string;
|
|
255
271
|
const fontWeights700: string;
|
|
@@ -318,6 +334,7 @@ declare namespace _default {
|
|
|
318
334
|
const typographyLinkTextM: string;
|
|
319
335
|
const typographyLinkTextL: string;
|
|
320
336
|
const typographyMenuLabelM: string;
|
|
337
|
+
const typographyMenuLabelL: string;
|
|
321
338
|
const typographyMenuSegmentTitleM: string;
|
|
322
339
|
const typographyMessageHeadingM: string;
|
|
323
340
|
const typographyMessageHeadingL: string;
|
package/js/base/es6.js
CHANGED
|
@@ -15,8 +15,10 @@ export default {
|
|
|
15
15
|
colorsYang100: '#ffffffff',
|
|
16
16
|
colorsYang030: '#ffffff4d',
|
|
17
17
|
colorsYang080: '#ffffffcc',
|
|
18
|
+
colorsGray700: '#4d4d4dff',
|
|
19
|
+
colorsGray750: '#404040ff',
|
|
18
20
|
colorsGray850: '#262626ff',
|
|
19
|
-
colorsGray900: '#
|
|
21
|
+
colorsGray900: '#191919ff',
|
|
20
22
|
colorsGray1000: '#000000ff',
|
|
21
23
|
colorsGray000: '#ffffffff',
|
|
22
24
|
colorsDisabled400: '#f2f5f6ff',
|
|
@@ -29,45 +31,57 @@ export default {
|
|
|
29
31
|
colorsComponentsMenuSpringStandard600: '#007e45ff',
|
|
30
32
|
colorsComponentsMenuSpringStandard700: '#d9e0e4ff',
|
|
31
33
|
colorsComponentsMenuSpringParent500: '#e6ebedff',
|
|
32
|
-
colorsComponentsMenuSpringParent600: '#
|
|
34
|
+
colorsComponentsMenuSpringParent600: '#007e45ff',
|
|
33
35
|
colorsComponentsMenuSpringParent700: '#d9e0e4ff',
|
|
34
36
|
colorsComponentsMenuSpringChild400: '#ccd6dbff',
|
|
35
37
|
colorsComponentsMenuSpringChild500: '#ffffffff',
|
|
36
38
|
colorsComponentsMenuSpringChild600: '#007e45ff',
|
|
39
|
+
colorsComponentsMenuSpringChildAlt400: '#ccd6dbff',
|
|
37
40
|
colorsComponentsMenuSpringChildAlt500: '#e6ebedff',
|
|
38
41
|
colorsComponentsMenuSpringChildAlt600: '#007e45ff',
|
|
42
|
+
colorsComponentsMenuSummerStandard400: '#ccd6dbff',
|
|
39
43
|
colorsComponentsMenuSummerStandard500: '#ffffffff',
|
|
40
44
|
colorsComponentsMenuSummerStandard600: '#007e45ff',
|
|
41
|
-
colorsComponentsMenuSummerStandard700: '#
|
|
45
|
+
colorsComponentsMenuSummerStandard700: '#e6ebedff',
|
|
46
|
+
colorsComponentsMenuSummerStandard800: '#e6ebedff',
|
|
42
47
|
colorsComponentsMenuSummerParent500: '#ffffffff',
|
|
43
|
-
colorsComponentsMenuSummerParent600: '#
|
|
44
|
-
colorsComponentsMenuSummerParent700: '#
|
|
45
|
-
|
|
48
|
+
colorsComponentsMenuSummerParent600: '#007e45ff',
|
|
49
|
+
colorsComponentsMenuSummerParent700: '#e6ebedff',
|
|
50
|
+
colorsComponentsMenuSummerChild300: '#b3c2c9ff',
|
|
51
|
+
colorsComponentsMenuSummerChild400: '#ccd6dbff',
|
|
46
52
|
colorsComponentsMenuSummerChild500: '#e6ebedff',
|
|
47
53
|
colorsComponentsMenuSummerChild600: '#007e45ff',
|
|
48
|
-
|
|
54
|
+
colorsComponentsMenuSummerChild700: '#e6ebedff',
|
|
55
|
+
colorsComponentsMenuSummerChild800: '#e6ebedff',
|
|
56
|
+
colorsComponentsMenuSummerChildAlt300: '#b3c2c9ff',
|
|
57
|
+
colorsComponentsMenuSummerChildAlt400: '#ccd6dbff',
|
|
58
|
+
colorsComponentsMenuSummerChildAlt500: '#d9e0e4ff',
|
|
49
59
|
colorsComponentsMenuSummerChildAlt600: '#007e45ff',
|
|
60
|
+
colorsComponentsMenuSummerChildAlt700: '#d9e0e4ff',
|
|
61
|
+
colorsComponentsMenuSummerChildAlt800: '#d9e0e4ff',
|
|
50
62
|
colorsComponentsMenuAutumnStandard500: '#00324cff',
|
|
51
63
|
colorsComponentsMenuAutumnStandard600: '#007e45ff',
|
|
52
64
|
colorsComponentsMenuAutumnStandard700: '#19475eff',
|
|
53
65
|
colorsComponentsMenuAutumnParent500: '#00324cff',
|
|
54
|
-
colorsComponentsMenuAutumnParent600: '#
|
|
66
|
+
colorsComponentsMenuAutumnParent600: '#007e45ff',
|
|
55
67
|
colorsComponentsMenuAutumnParent700: '#19475eff',
|
|
56
68
|
colorsComponentsMenuAutumnChild400: '#19475eff',
|
|
57
69
|
colorsComponentsMenuAutumnChild500: '#001926ff',
|
|
58
70
|
colorsComponentsMenuAutumnChild600: '#007e45ff',
|
|
71
|
+
colorsComponentsMenuAutumnChildAlt400: '#19475eff',
|
|
59
72
|
colorsComponentsMenuAutumnChildAlt500: '#00324cff',
|
|
60
73
|
colorsComponentsMenuAutumnChildAlt600: '#007e45ff',
|
|
61
74
|
colorsComponentsMenuWinterStandard500: '#000000ff',
|
|
62
75
|
colorsComponentsMenuWinterStandard600: '#007e45ff',
|
|
63
76
|
colorsComponentsMenuWinterStandard700: '#262626ff',
|
|
64
77
|
colorsComponentsMenuWinterParent500: '#000000ff',
|
|
65
|
-
colorsComponentsMenuWinterParent600: '#
|
|
78
|
+
colorsComponentsMenuWinterParent600: '#007e45ff',
|
|
66
79
|
colorsComponentsMenuWinterParent700: '#262626ff',
|
|
67
80
|
colorsComponentsMenuWinterChild400: '#262626ff',
|
|
68
81
|
colorsComponentsMenuWinterChild500: '#000000ff',
|
|
69
82
|
colorsComponentsMenuWinterChild600: '#007e45ff',
|
|
70
|
-
|
|
83
|
+
colorsComponentsMenuWinterChildAlt400: '#262626ff',
|
|
84
|
+
colorsComponentsMenuWinterChildAlt500: '#191919ff',
|
|
71
85
|
colorsComponentsMenuWinterChildAlt600: '#007e45ff',
|
|
72
86
|
colorsComponentsMenuYin100: '#000000ff',
|
|
73
87
|
colorsComponentsMenuYin065: '#000000a6',
|
|
@@ -254,6 +268,8 @@ export default {
|
|
|
254
268
|
boxShadow400: '0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a',
|
|
255
269
|
boxShadow075: 'inset 0 6px 4px -4px #00141e0d',
|
|
256
270
|
boxShadow050: '0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26',
|
|
271
|
+
boxShadow090: '0 4px 8px -4px #00141e1a',
|
|
272
|
+
boxShadow091: '4px 0 8px -4px #00141e1a',
|
|
257
273
|
fontWeights400: '400',
|
|
258
274
|
fontWeights500: '500',
|
|
259
275
|
fontWeights700: '700',
|
|
@@ -322,6 +338,7 @@ export default {
|
|
|
322
338
|
typographyLinkTextM: '400 14px/150% Sage UI',
|
|
323
339
|
typographyLinkTextL: 'undefined 16px/150% Sage UI',
|
|
324
340
|
typographyMenuLabelM: '500 14px/150% Sage UI',
|
|
341
|
+
typographyMenuLabelL: '500 16px/150% Sage UI',
|
|
325
342
|
typographyMenuSegmentTitleM: '500 12px/150% Sage UI',
|
|
326
343
|
typographyMessageHeadingM: '700 14px/150% Sage UI',
|
|
327
344
|
typographyMessageHeadingL: '700 16px/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.12.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 Fri, 01 Apr 2022 11:37:42 GMT
|
|
8
8
|
|
|
9
9
|
$metaName: Base Theme;
|
|
10
10
|
$metaPublic: true;
|
|
@@ -18,8 +18,10 @@ $colorsYin090: #000000e6;
|
|
|
18
18
|
$colorsYang100: #ffffffff;
|
|
19
19
|
$colorsYang030: #ffffff4d;
|
|
20
20
|
$colorsYang080: #ffffffcc;
|
|
21
|
+
$colorsGray700: #4d4d4dff;
|
|
22
|
+
$colorsGray750: #404040ff;
|
|
21
23
|
$colorsGray850: #262626ff;
|
|
22
|
-
$colorsGray900: #
|
|
24
|
+
$colorsGray900: #191919ff;
|
|
23
25
|
$colorsGray1000: #000000ff;
|
|
24
26
|
$colorsGray000: #ffffffff;
|
|
25
27
|
$colorsDisabled400: #f2f5f6ff;
|
|
@@ -32,45 +34,57 @@ $colorsComponentsMenuSpringStandard500: #e6ebedff;
|
|
|
32
34
|
$colorsComponentsMenuSpringStandard600: #007e45ff;
|
|
33
35
|
$colorsComponentsMenuSpringStandard700: #d9e0e4ff;
|
|
34
36
|
$colorsComponentsMenuSpringParent500: #e6ebedff;
|
|
35
|
-
$colorsComponentsMenuSpringParent600: #
|
|
37
|
+
$colorsComponentsMenuSpringParent600: #007e45ff;
|
|
36
38
|
$colorsComponentsMenuSpringParent700: #d9e0e4ff;
|
|
37
39
|
$colorsComponentsMenuSpringChild400: #ccd6dbff;
|
|
38
40
|
$colorsComponentsMenuSpringChild500: #ffffffff;
|
|
39
41
|
$colorsComponentsMenuSpringChild600: #007e45ff;
|
|
42
|
+
$colorsComponentsMenuSpringChildAlt400: #ccd6dbff;
|
|
40
43
|
$colorsComponentsMenuSpringChildAlt500: #e6ebedff;
|
|
41
44
|
$colorsComponentsMenuSpringChildAlt600: #007e45ff;
|
|
45
|
+
$colorsComponentsMenuSummerStandard400: #ccd6dbff;
|
|
42
46
|
$colorsComponentsMenuSummerStandard500: #ffffffff;
|
|
43
47
|
$colorsComponentsMenuSummerStandard600: #007e45ff;
|
|
44
|
-
$colorsComponentsMenuSummerStandard700: #
|
|
48
|
+
$colorsComponentsMenuSummerStandard700: #e6ebedff;
|
|
49
|
+
$colorsComponentsMenuSummerStandard800: #e6ebedff;
|
|
45
50
|
$colorsComponentsMenuSummerParent500: #ffffffff;
|
|
46
|
-
$colorsComponentsMenuSummerParent600: #
|
|
47
|
-
$colorsComponentsMenuSummerParent700: #
|
|
48
|
-
$
|
|
51
|
+
$colorsComponentsMenuSummerParent600: #007e45ff;
|
|
52
|
+
$colorsComponentsMenuSummerParent700: #e6ebedff;
|
|
53
|
+
$colorsComponentsMenuSummerChild300: #b3c2c9ff;
|
|
54
|
+
$colorsComponentsMenuSummerChild400: #ccd6dbff;
|
|
49
55
|
$colorsComponentsMenuSummerChild500: #e6ebedff;
|
|
50
56
|
$colorsComponentsMenuSummerChild600: #007e45ff;
|
|
51
|
-
$
|
|
57
|
+
$colorsComponentsMenuSummerChild700: #e6ebedff;
|
|
58
|
+
$colorsComponentsMenuSummerChild800: #e6ebedff;
|
|
59
|
+
$colorsComponentsMenuSummerChildAlt300: #b3c2c9ff;
|
|
60
|
+
$colorsComponentsMenuSummerChildAlt400: #ccd6dbff;
|
|
61
|
+
$colorsComponentsMenuSummerChildAlt500: #d9e0e4ff;
|
|
52
62
|
$colorsComponentsMenuSummerChildAlt600: #007e45ff;
|
|
63
|
+
$colorsComponentsMenuSummerChildAlt700: #d9e0e4ff;
|
|
64
|
+
$colorsComponentsMenuSummerChildAlt800: #d9e0e4ff;
|
|
53
65
|
$colorsComponentsMenuAutumnStandard500: #00324cff;
|
|
54
66
|
$colorsComponentsMenuAutumnStandard600: #007e45ff;
|
|
55
67
|
$colorsComponentsMenuAutumnStandard700: #19475eff;
|
|
56
68
|
$colorsComponentsMenuAutumnParent500: #00324cff;
|
|
57
|
-
$colorsComponentsMenuAutumnParent600: #
|
|
69
|
+
$colorsComponentsMenuAutumnParent600: #007e45ff;
|
|
58
70
|
$colorsComponentsMenuAutumnParent700: #19475eff;
|
|
59
71
|
$colorsComponentsMenuAutumnChild400: #19475eff;
|
|
60
72
|
$colorsComponentsMenuAutumnChild500: #001926ff;
|
|
61
73
|
$colorsComponentsMenuAutumnChild600: #007e45ff;
|
|
74
|
+
$colorsComponentsMenuAutumnChildAlt400: #19475eff;
|
|
62
75
|
$colorsComponentsMenuAutumnChildAlt500: #00324cff;
|
|
63
76
|
$colorsComponentsMenuAutumnChildAlt600: #007e45ff;
|
|
64
77
|
$colorsComponentsMenuWinterStandard500: #000000ff;
|
|
65
78
|
$colorsComponentsMenuWinterStandard600: #007e45ff;
|
|
66
79
|
$colorsComponentsMenuWinterStandard700: #262626ff;
|
|
67
80
|
$colorsComponentsMenuWinterParent500: #000000ff;
|
|
68
|
-
$colorsComponentsMenuWinterParent600: #
|
|
81
|
+
$colorsComponentsMenuWinterParent600: #007e45ff;
|
|
69
82
|
$colorsComponentsMenuWinterParent700: #262626ff;
|
|
70
83
|
$colorsComponentsMenuWinterChild400: #262626ff;
|
|
71
84
|
$colorsComponentsMenuWinterChild500: #000000ff;
|
|
72
85
|
$colorsComponentsMenuWinterChild600: #007e45ff;
|
|
73
|
-
$
|
|
86
|
+
$colorsComponentsMenuWinterChildAlt400: #262626ff;
|
|
87
|
+
$colorsComponentsMenuWinterChildAlt500: #191919ff;
|
|
74
88
|
$colorsComponentsMenuWinterChildAlt600: #007e45ff;
|
|
75
89
|
$colorsComponentsMenuYin100: #000000ff;
|
|
76
90
|
$colorsComponentsMenuYin065: #000000a6;
|
|
@@ -257,6 +271,8 @@ $boxShadow300: 0 10px 30px 0 #00141e1a, 0 30px 60px 0 #00141e1a;
|
|
|
257
271
|
$boxShadow400: 0 10px 40px 0 #00141e0a, 0 50px 80px 0 #00141e1a;
|
|
258
272
|
$boxShadow075: inset 0 6px 4px -4px #00141e0d;
|
|
259
273
|
$boxShadow050: 0 3px 3px 0 #00141e33, 0 2px 4px 0 #00141e26;
|
|
274
|
+
$boxShadow090: 0 4px 8px -4px #00141e1a;
|
|
275
|
+
$boxShadow091: 4px 0 8px -4px #00141e1a;
|
|
260
276
|
$fontWeights400: 400;
|
|
261
277
|
$fontWeights500: 500;
|
|
262
278
|
$fontWeights700: 700;
|
|
@@ -325,6 +341,7 @@ $typographyLinkTextS: 400 12px/150% Sage UI;
|
|
|
325
341
|
$typographyLinkTextM: 400 14px/150% Sage UI;
|
|
326
342
|
$typographyLinkTextL: undefined 16px/150% Sage UI;
|
|
327
343
|
$typographyMenuLabelM: 500 14px/150% Sage UI;
|
|
344
|
+
$typographyMenuLabelL: 500 16px/150% Sage UI;
|
|
328
345
|
$typographyMenuSegmentTitleM: 500 12px/150% Sage UI;
|
|
329
346
|
$typographyMessageHeadingM: 700 14px/150% Sage UI;
|
|
330
347
|
$typographyMessageHeadingL: 700 16px/150% Sage UI;
|
|
Binary file
|