@transferwise/neptune-tokens 4.2.0-beta.2 → 6.0.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/CHANGELOG.md +32 -0
- package/colors-base.css +1 -1
- package/colors-base.less +1 -1
- package/package.json +5 -3
- package/themes/dark/tokens.css +2 -1
- package/themes/dark/tokens.less +3 -2
- package/themes/light/tokens.css +2 -1
- package/themes/light/tokens.less +3 -2
- package/themes/navy/tokens.css +2 -1
- package/themes/navy/tokens.less +3 -2
- package/tokens.css +2 -85
- package/tokens.less +3 -2
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
# v6.0.0
|
|
2
|
+
|
|
3
|
+
## Remove themed CSS custom properties (variables) from :root
|
|
4
|
+
|
|
5
|
+
To avoid further confusion with our upcoming theming changes, we are dropping the color theme name from CSS variables assigned to the `:root` pseudo-class.
|
|
6
|
+
|
|
7
|
+
# v5.1.0
|
|
8
|
+
|
|
9
|
+
## Add font-family token
|
|
10
|
+
|
|
11
|
+
# v5.0.0
|
|
12
|
+
|
|
13
|
+
## Add Navy color tokens to default bundle
|
|
14
|
+
|
|
15
|
+
Navy tokens added with `-navy-` part in file, e.g
|
|
16
|
+
|
|
17
|
+
```css
|
|
18
|
+
--color-navy-content-primary: #...;
|
|
19
|
+
--color-navy-content-secondary: #...;
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## and make path to default bundle same as in v1 (breaking change)
|
|
23
|
+
|
|
24
|
+
```css
|
|
25
|
+
// old
|
|
26
|
+
@import "@transferwise/neptune-tokens/themes/default/tokens.css";
|
|
27
|
+
|
|
28
|
+
// new
|
|
29
|
+
@import "@transferwise/neptune-tokens/tokens.css";
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
This is necessary because most people still use v1 and it will be less of a breaking change in upcoming Neptune release with new colors.
|
package/colors-base.css
CHANGED
package/colors-base.less
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@transferwise/neptune-tokens",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "6.0.0",
|
|
4
4
|
"description": "Design tokens for the Neptune Design System",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"type": "module",
|
|
@@ -15,13 +15,15 @@
|
|
|
15
15
|
"themes/**/*"
|
|
16
16
|
],
|
|
17
17
|
"scripts": {
|
|
18
|
+
"test": "release-to-github-with-changelog-pre-release-checks",
|
|
18
19
|
"build": "node build",
|
|
19
|
-
"prepublishOnly": "
|
|
20
|
+
"prepublishOnly": "yarn build && cp -R dist/* .",
|
|
20
21
|
"postpublish": "git clean -fd"
|
|
21
22
|
},
|
|
22
23
|
"devDependencies": {
|
|
23
24
|
"chroma-js": "^2.1.2",
|
|
24
25
|
"prettier": "^2.3.2",
|
|
25
|
-
"style-dictionary": "^3.0.1"
|
|
26
|
+
"style-dictionary": "^3.0.1",
|
|
27
|
+
"release-to-github-with-changelog": "^1.2.4"
|
|
26
28
|
}
|
|
27
29
|
}
|
package/themes/dark/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-dark {
|
|
@@ -79,4 +79,5 @@
|
|
|
79
79
|
--font-weight-regular: 500;
|
|
80
80
|
--font-weight-semi-bold: 600;
|
|
81
81
|
--font-weight-bold: 800;
|
|
82
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
83
|
}
|
package/themes/dark/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #e2e6e8;
|
|
6
6
|
@color-content-secondary: #c9cbce;
|
|
@@ -76,4 +76,5 @@
|
|
|
76
76
|
@line-height-control: 1.2;
|
|
77
77
|
@font-weight-regular: 500;
|
|
78
78
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
79
|
+
@font-weight-bold: 800;
|
|
80
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/themes/light/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-light {
|
|
@@ -79,4 +79,5 @@
|
|
|
79
79
|
--font-weight-regular: 500;
|
|
80
80
|
--font-weight-semi-bold: 600;
|
|
81
81
|
--font-weight-bold: 800;
|
|
82
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
83
|
}
|
package/themes/light/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #37517e;
|
|
6
6
|
@color-content-secondary: #5d7079;
|
|
@@ -76,4 +76,5 @@
|
|
|
76
76
|
@line-height-control: 1.2;
|
|
77
77
|
@font-weight-regular: 500;
|
|
78
78
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
79
|
+
@font-weight-bold: 800;
|
|
80
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/themes/navy/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-navy {
|
|
@@ -79,4 +79,5 @@
|
|
|
79
79
|
--font-weight-regular: 500;
|
|
80
80
|
--font-weight-semi-bold: 600;
|
|
81
81
|
--font-weight-bold: 800;
|
|
82
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
83
|
}
|
package/themes/navy/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #ffffff;
|
|
6
6
|
@color-content-secondary: #c9cbce;
|
|
@@ -76,4 +76,5 @@
|
|
|
76
76
|
@line-height-control: 1.2;
|
|
77
77
|
@font-weight-regular: 500;
|
|
78
78
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
79
|
+
@font-weight-bold: 800;
|
|
80
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/tokens.css
CHANGED
|
@@ -1,51 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
7
|
-
--color-dark-content-primary: #e2e6e8;
|
|
8
|
-
--color-dark-content-secondary: #c9cbce;
|
|
9
|
-
--color-dark-content-accent: #00b9ff;
|
|
10
|
-
--color-dark-content-accent-hover: #00a6ea;
|
|
11
|
-
--color-dark-content-accent-active: #0097db;
|
|
12
|
-
--color-dark-content-positive: #6fd698;
|
|
13
|
-
--color-dark-content-positive-hover: #5ac285;
|
|
14
|
-
--color-dark-content-positive-active: #4bb377;
|
|
15
|
-
--color-dark-content-negative: #ffa6a9;
|
|
16
|
-
--color-dark-content-negative-hover: #ea9396;
|
|
17
|
-
--color-dark-content-negative-active: #da8488;
|
|
18
|
-
--color-dark-content-warning: #ffd184;
|
|
19
|
-
--color-dark-content-warning-hover: #e9bd71;
|
|
20
|
-
--color-dark-content-warning-active: #daae63;
|
|
21
|
-
--color-dark-content-disabled: #a8aaac;
|
|
22
|
-
--color-dark-interactive-accent: #00a2dd;
|
|
23
|
-
--color-dark-interactive-accent-hover: #008fc9;
|
|
24
|
-
--color-dark-interactive-accent-active: #0081ba;
|
|
25
|
-
--color-dark-interactive-positive: #2ead4b;
|
|
26
|
-
--color-dark-interactive-positive-hover: #069939;
|
|
27
|
-
--color-dark-interactive-positive-active: #008b2b;
|
|
28
|
-
--color-dark-interactive-negative: #e74848;
|
|
29
|
-
--color-dark-interactive-negative-hover: #d03238;
|
|
30
|
-
--color-dark-interactive-negative-active: #bf1e2c;
|
|
31
|
-
--color-dark-interactive-warning: #df8700;
|
|
32
|
-
--color-dark-interactive-warning-hover: #c97500;
|
|
33
|
-
--color-dark-interactive-warning-active: #b86700;
|
|
34
|
-
--color-dark-interactive-secondary: #a8aaac;
|
|
35
|
-
--color-dark-interactive-secondary-hover: #959799;
|
|
36
|
-
--color-dark-interactive-secondary-active: #87898b;
|
|
37
|
-
--color-dark-interactive-disabled: #a8aaac;
|
|
38
|
-
--color-dark-background-screen: #181818;
|
|
39
|
-
--color-dark-background-elevated: #202020;
|
|
40
|
-
--color-dark-background-neutral: #86a7bd1a;
|
|
41
|
-
--color-dark-background-accent: #38c8ff1a;
|
|
42
|
-
--color-dark-background-positive: #36c7971a;
|
|
43
|
-
--color-dark-background-negative: #ff87871a;
|
|
44
|
-
--color-dark-background-warning: #ffac001a;
|
|
45
|
-
--color-dark-background-overlay: #ffffff1a;
|
|
46
|
-
--color-dark-border-neutral: #ffffff1a;
|
|
47
|
-
--color-dark-border-overlay: #ffffff1a;
|
|
48
|
-
--color-dark-core-contrast: #ffffff;
|
|
49
7
|
--color-content-primary: #37517e;
|
|
50
8
|
--color-content-secondary: #5d7079;
|
|
51
9
|
--color-content-accent: #0097c7;
|
|
@@ -88,48 +46,6 @@
|
|
|
88
46
|
--color-border-neutral: #0000001a;
|
|
89
47
|
--color-border-overlay: #0000001a;
|
|
90
48
|
--color-core-contrast: #000000;
|
|
91
|
-
--color-navy-content-primary: #ffffff;
|
|
92
|
-
--color-navy-content-secondary: #c9cbce;
|
|
93
|
-
--color-navy-content-accent: #00b9ff;
|
|
94
|
-
--color-navy-content-accent-hover: #00a6ea;
|
|
95
|
-
--color-navy-content-accent-active: #0097db;
|
|
96
|
-
--color-navy-content-positive: #6fd698;
|
|
97
|
-
--color-navy-content-positive-hover: #5ac285;
|
|
98
|
-
--color-navy-content-positive-active: #4bb377;
|
|
99
|
-
--color-navy-content-negative: #ffa6a9;
|
|
100
|
-
--color-navy-content-negative-hover: #ea9396;
|
|
101
|
-
--color-navy-content-negative-active: #da8488;
|
|
102
|
-
--color-navy-content-warning: #ffd184;
|
|
103
|
-
--color-navy-content-warning-hover: #e9bd71;
|
|
104
|
-
--color-navy-content-warning-active: #daae63;
|
|
105
|
-
--color-navy-content-disabled: #a8aaac;
|
|
106
|
-
--color-navy-interactive-accent: #00a2dd;
|
|
107
|
-
--color-navy-interactive-accent-hover: #008fc9;
|
|
108
|
-
--color-navy-interactive-accent-active: #0081ba;
|
|
109
|
-
--color-navy-interactive-positive: #2ead4b;
|
|
110
|
-
--color-navy-interactive-positive-hover: #069939;
|
|
111
|
-
--color-navy-interactive-positive-active: #008b2b;
|
|
112
|
-
--color-navy-interactive-negative: #e74848;
|
|
113
|
-
--color-navy-interactive-negative-hover: #d03238;
|
|
114
|
-
--color-navy-interactive-negative-active: #bf1e2c;
|
|
115
|
-
--color-navy-interactive-warning: #df8700;
|
|
116
|
-
--color-navy-interactive-warning-hover: #c97500;
|
|
117
|
-
--color-navy-interactive-warning-active: #b86700;
|
|
118
|
-
--color-navy-interactive-secondary: #a8aaac;
|
|
119
|
-
--color-navy-interactive-secondary-hover: #959799;
|
|
120
|
-
--color-navy-interactive-secondary-active: #87898b;
|
|
121
|
-
--color-navy-interactive-disabled: #a8aaac;
|
|
122
|
-
--color-navy-background-screen: #2e4369;
|
|
123
|
-
--color-navy-background-elevated: #37517e;
|
|
124
|
-
--color-navy-background-neutral: #86a7bd1a;
|
|
125
|
-
--color-navy-background-accent: #38c8ff1a;
|
|
126
|
-
--color-navy-background-positive: #36c7971a;
|
|
127
|
-
--color-navy-background-negative: #ff87871a;
|
|
128
|
-
--color-navy-background-warning: #ffac001a;
|
|
129
|
-
--color-navy-background-overlay: #ffffff1a;
|
|
130
|
-
--color-navy-border-neutral: #ffffff1a;
|
|
131
|
-
--color-navy-border-overlay: #ffffff1a;
|
|
132
|
-
--color-navy-core-contrast: #ffffff;
|
|
133
49
|
--radius-small: 3px;
|
|
134
50
|
--radius-medium: 10px;
|
|
135
51
|
--size-4: 4px;
|
|
@@ -163,4 +79,5 @@
|
|
|
163
79
|
--font-weight-regular: 500;
|
|
164
80
|
--font-weight-semi-bold: 600;
|
|
165
81
|
--font-weight-bold: 800;
|
|
82
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
166
83
|
}
|
package/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 24 Nov 2021 13:23:31 GMT
|
|
4
4
|
|
|
5
5
|
@color-dark-content-primary: #e2e6e8;
|
|
6
6
|
@color-dark-content-secondary: #c9cbce;
|
|
@@ -160,4 +160,5 @@
|
|
|
160
160
|
@line-height-control: 1.2;
|
|
161
161
|
@font-weight-regular: 500;
|
|
162
162
|
@font-weight-semi-bold: 600;
|
|
163
|
-
@font-weight-bold: 800;
|
|
163
|
+
@font-weight-bold: 800;
|
|
164
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|