@transferwise/neptune-tokens 5.0.0 → 7.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 +29 -8
- package/colors-base.css +2 -2
- package/colors-base.less +2 -2
- package/colors.json +79 -154
- package/package.json +1 -1
- package/themes/dark/tokens.css +3 -3
- package/themes/dark/tokens.less +4 -4
- package/themes/light/tokens.css +3 -3
- package/themes/light/tokens.less +4 -4
- package/themes/navy/tokens.css +3 -3
- package/themes/navy/tokens.less +4 -4
- package/tokens.css +3 -45
- package/tokens.less +46 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,23 +1,44 @@
|
|
|
1
|
+
# v7.0.0
|
|
2
|
+
|
|
3
|
+
## Remove disabled colour tokens
|
|
4
|
+
|
|
5
|
+
Disabled colours were simulating transparency and desaturation, and were encouraging us to create a larger palette than we needed, and more prone to mistakes. We're now removing those tokens and encouraging consumers to use opacity and blend modes to achieve the same effect.
|
|
6
|
+
|
|
7
|
+
# v6.1.0
|
|
8
|
+
|
|
9
|
+
## Add tertiary content token
|
|
10
|
+
|
|
11
|
+
We're adding a new tertiary content token for text that should be deemphasised further than secondary, like placeholders in inputs and inactive components.
|
|
12
|
+
|
|
13
|
+
# v6.0.0
|
|
14
|
+
|
|
15
|
+
## Remove themed CSS custom properties (variables) from :root
|
|
16
|
+
|
|
17
|
+
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.
|
|
18
|
+
|
|
19
|
+
# v5.1.0
|
|
20
|
+
|
|
21
|
+
## Add font-family token
|
|
22
|
+
|
|
1
23
|
# v5.0.0
|
|
2
24
|
|
|
3
25
|
## Add Navy color tokens to default bundle
|
|
4
26
|
|
|
5
|
-
Navy tokens
|
|
27
|
+
Navy tokens added with `-navy-` part in file, e.g
|
|
6
28
|
|
|
7
29
|
```css
|
|
8
|
-
|
|
9
|
-
|
|
30
|
+
--color-navy-content-primary: #...;
|
|
31
|
+
--color-navy-content-secondary: #...;
|
|
10
32
|
```
|
|
11
33
|
|
|
12
|
-
|
|
13
34
|
## and make path to default bundle same as in v1 (breaking change)
|
|
14
35
|
|
|
15
|
-
```
|
|
36
|
+
```css
|
|
16
37
|
// old
|
|
17
|
-
@transferwise/neptune-tokens/themes/default/tokens.css
|
|
38
|
+
@import "@transferwise/neptune-tokens/themes/default/tokens.css";
|
|
18
39
|
|
|
19
40
|
// new
|
|
20
|
-
@transferwise/neptune-tokens/tokens.css
|
|
41
|
+
@import "@transferwise/neptune-tokens/tokens.css";
|
|
21
42
|
```
|
|
22
43
|
|
|
23
|
-
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.
|
|
44
|
+
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
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
--color-base-navy-dark: #253655;
|
|
30
30
|
--color-base-navy-fade: #849cc51a;
|
|
31
31
|
--color-base-grey-light: #829ca9;
|
|
32
|
-
--color-base-grey-mid: #
|
|
32
|
+
--color-base-grey-mid: #768e9c;
|
|
33
33
|
--color-base-grey-dark: #5d7079;
|
|
34
34
|
--color-base-grey-fade: #829ca91a;
|
|
35
35
|
--color-base-white-light: #ffffff;
|
package/colors-base.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
|
|
5
5
|
@color-base-blue-light: #00b9ff;
|
|
6
6
|
@color-base-blue-mid: #00a2dd;
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
@color-base-navy-dark: #253655;
|
|
28
28
|
@color-base-navy-fade: #849cc51a;
|
|
29
29
|
@color-base-grey-light: #829ca9;
|
|
30
|
-
@color-base-grey-mid: #
|
|
30
|
+
@color-base-grey-mid: #768e9c;
|
|
31
31
|
@color-base-grey-dark: #5d7079;
|
|
32
32
|
@color-base-grey-fade: #829ca91a;
|
|
33
33
|
@color-base-white-light: #ffffff;
|
package/colors.json
CHANGED
|
@@ -703,15 +703,15 @@
|
|
|
703
703
|
},
|
|
704
704
|
"mid": {
|
|
705
705
|
"value": {
|
|
706
|
-
"r": 0.
|
|
707
|
-
"g": 0.
|
|
708
|
-
"b": 0.
|
|
706
|
+
"r": 0.4627450980392157,
|
|
707
|
+
"g": 0.5568627450980392,
|
|
708
|
+
"b": 0.611764705882353
|
|
709
709
|
},
|
|
710
710
|
"filePath": "tokens/colors/base.json",
|
|
711
711
|
"isSource": true,
|
|
712
712
|
"original": {
|
|
713
713
|
"value": {
|
|
714
|
-
"hex": "#
|
|
714
|
+
"hex": "#768e9c"
|
|
715
715
|
}
|
|
716
716
|
},
|
|
717
717
|
"name": "baseGreyMid",
|
|
@@ -1145,6 +1145,31 @@
|
|
|
1145
1145
|
"secondary"
|
|
1146
1146
|
]
|
|
1147
1147
|
},
|
|
1148
|
+
"tertiary": {
|
|
1149
|
+
"value": {
|
|
1150
|
+
"r": 0.6588235294117647,
|
|
1151
|
+
"g": 0.6666666666666666,
|
|
1152
|
+
"b": 0.6745098039215687
|
|
1153
|
+
},
|
|
1154
|
+
"filePath": "tokens/colors/themes/dark.json",
|
|
1155
|
+
"isSource": true,
|
|
1156
|
+
"original": {
|
|
1157
|
+
"value": "{color.base.smoke.dark.value}"
|
|
1158
|
+
},
|
|
1159
|
+
"name": "darkContentTertiary",
|
|
1160
|
+
"attributes": {
|
|
1161
|
+
"category": "color",
|
|
1162
|
+
"type": "dark",
|
|
1163
|
+
"item": "content",
|
|
1164
|
+
"subitem": "tertiary"
|
|
1165
|
+
},
|
|
1166
|
+
"path": [
|
|
1167
|
+
"color",
|
|
1168
|
+
"dark",
|
|
1169
|
+
"content",
|
|
1170
|
+
"tertiary"
|
|
1171
|
+
]
|
|
1172
|
+
},
|
|
1148
1173
|
"accent": {
|
|
1149
1174
|
"value": {
|
|
1150
1175
|
"r": 0,
|
|
@@ -1244,31 +1269,6 @@
|
|
|
1244
1269
|
"content",
|
|
1245
1270
|
"warning"
|
|
1246
1271
|
]
|
|
1247
|
-
},
|
|
1248
|
-
"disabled": {
|
|
1249
|
-
"value": {
|
|
1250
|
-
"r": 0.6588235294117647,
|
|
1251
|
-
"g": 0.6666666666666666,
|
|
1252
|
-
"b": 0.6745098039215687
|
|
1253
|
-
},
|
|
1254
|
-
"filePath": "tokens/colors/themes/dark.json",
|
|
1255
|
-
"isSource": true,
|
|
1256
|
-
"original": {
|
|
1257
|
-
"value": "{color.base.smoke.dark.value}"
|
|
1258
|
-
},
|
|
1259
|
-
"name": "darkContentDisabled",
|
|
1260
|
-
"attributes": {
|
|
1261
|
-
"category": "color",
|
|
1262
|
-
"type": "dark",
|
|
1263
|
-
"item": "content",
|
|
1264
|
-
"subitem": "disabled"
|
|
1265
|
-
},
|
|
1266
|
-
"path": [
|
|
1267
|
-
"color",
|
|
1268
|
-
"dark",
|
|
1269
|
-
"content",
|
|
1270
|
-
"disabled"
|
|
1271
|
-
]
|
|
1272
1272
|
}
|
|
1273
1273
|
},
|
|
1274
1274
|
"interactive": {
|
|
@@ -1396,31 +1396,6 @@
|
|
|
1396
1396
|
"interactive",
|
|
1397
1397
|
"secondary"
|
|
1398
1398
|
]
|
|
1399
|
-
},
|
|
1400
|
-
"disabled": {
|
|
1401
|
-
"value": {
|
|
1402
|
-
"r": 0.6588235294117647,
|
|
1403
|
-
"g": 0.6666666666666666,
|
|
1404
|
-
"b": 0.6745098039215687
|
|
1405
|
-
},
|
|
1406
|
-
"filePath": "tokens/colors/themes/dark.json",
|
|
1407
|
-
"isSource": true,
|
|
1408
|
-
"original": {
|
|
1409
|
-
"value": "{color.base.smoke.dark.value}"
|
|
1410
|
-
},
|
|
1411
|
-
"name": "darkInteractiveDisabled",
|
|
1412
|
-
"attributes": {
|
|
1413
|
-
"category": "color",
|
|
1414
|
-
"type": "dark",
|
|
1415
|
-
"item": "interactive",
|
|
1416
|
-
"subitem": "disabled"
|
|
1417
|
-
},
|
|
1418
|
-
"path": [
|
|
1419
|
-
"color",
|
|
1420
|
-
"dark",
|
|
1421
|
-
"interactive",
|
|
1422
|
-
"disabled"
|
|
1423
|
-
]
|
|
1424
1399
|
}
|
|
1425
1400
|
},
|
|
1426
1401
|
"background": {
|
|
@@ -1765,6 +1740,31 @@
|
|
|
1765
1740
|
"secondary"
|
|
1766
1741
|
]
|
|
1767
1742
|
},
|
|
1743
|
+
"tertiary": {
|
|
1744
|
+
"value": {
|
|
1745
|
+
"r": 0.4627450980392157,
|
|
1746
|
+
"g": 0.5568627450980392,
|
|
1747
|
+
"b": 0.611764705882353
|
|
1748
|
+
},
|
|
1749
|
+
"filePath": "tokens/colors/themes/light.json",
|
|
1750
|
+
"isSource": true,
|
|
1751
|
+
"original": {
|
|
1752
|
+
"value": "{color.base.grey.mid.value}"
|
|
1753
|
+
},
|
|
1754
|
+
"name": "lightContentTertiary",
|
|
1755
|
+
"attributes": {
|
|
1756
|
+
"category": "color",
|
|
1757
|
+
"type": "light",
|
|
1758
|
+
"item": "content",
|
|
1759
|
+
"subitem": "tertiary"
|
|
1760
|
+
},
|
|
1761
|
+
"path": [
|
|
1762
|
+
"color",
|
|
1763
|
+
"light",
|
|
1764
|
+
"content",
|
|
1765
|
+
"tertiary"
|
|
1766
|
+
]
|
|
1767
|
+
},
|
|
1768
1768
|
"accent": {
|
|
1769
1769
|
"value": {
|
|
1770
1770
|
"r": 0,
|
|
@@ -1864,31 +1864,6 @@
|
|
|
1864
1864
|
"content",
|
|
1865
1865
|
"warning"
|
|
1866
1866
|
]
|
|
1867
|
-
},
|
|
1868
|
-
"disabled": {
|
|
1869
|
-
"value": {
|
|
1870
|
-
"r": 0.6588235294117647,
|
|
1871
|
-
"g": 0.6666666666666666,
|
|
1872
|
-
"b": 0.6745098039215687
|
|
1873
|
-
},
|
|
1874
|
-
"filePath": "tokens/colors/themes/light.json",
|
|
1875
|
-
"isSource": true,
|
|
1876
|
-
"original": {
|
|
1877
|
-
"value": "{color.base.smoke.dark.value}"
|
|
1878
|
-
},
|
|
1879
|
-
"name": "lightContentDisabled",
|
|
1880
|
-
"attributes": {
|
|
1881
|
-
"category": "color",
|
|
1882
|
-
"type": "light",
|
|
1883
|
-
"item": "content",
|
|
1884
|
-
"subitem": "disabled"
|
|
1885
|
-
},
|
|
1886
|
-
"path": [
|
|
1887
|
-
"color",
|
|
1888
|
-
"light",
|
|
1889
|
-
"content",
|
|
1890
|
-
"disabled"
|
|
1891
|
-
]
|
|
1892
1867
|
}
|
|
1893
1868
|
},
|
|
1894
1869
|
"interactive": {
|
|
@@ -2016,31 +1991,6 @@
|
|
|
2016
1991
|
"interactive",
|
|
2017
1992
|
"secondary"
|
|
2018
1993
|
]
|
|
2019
|
-
},
|
|
2020
|
-
"disabled": {
|
|
2021
|
-
"value": {
|
|
2022
|
-
"r": 0.6588235294117647,
|
|
2023
|
-
"g": 0.6666666666666666,
|
|
2024
|
-
"b": 0.6745098039215687
|
|
2025
|
-
},
|
|
2026
|
-
"filePath": "tokens/colors/themes/light.json",
|
|
2027
|
-
"isSource": true,
|
|
2028
|
-
"original": {
|
|
2029
|
-
"value": "{color.base.smoke.dark.value}"
|
|
2030
|
-
},
|
|
2031
|
-
"name": "lightInteractiveDisabled",
|
|
2032
|
-
"attributes": {
|
|
2033
|
-
"category": "color",
|
|
2034
|
-
"type": "light",
|
|
2035
|
-
"item": "interactive",
|
|
2036
|
-
"subitem": "disabled"
|
|
2037
|
-
},
|
|
2038
|
-
"path": [
|
|
2039
|
-
"color",
|
|
2040
|
-
"light",
|
|
2041
|
-
"interactive",
|
|
2042
|
-
"disabled"
|
|
2043
|
-
]
|
|
2044
1994
|
}
|
|
2045
1995
|
},
|
|
2046
1996
|
"background": {
|
|
@@ -2385,6 +2335,31 @@
|
|
|
2385
2335
|
"secondary"
|
|
2386
2336
|
]
|
|
2387
2337
|
},
|
|
2338
|
+
"tertiary": {
|
|
2339
|
+
"value": {
|
|
2340
|
+
"r": 0.6588235294117647,
|
|
2341
|
+
"g": 0.6666666666666666,
|
|
2342
|
+
"b": 0.6745098039215687
|
|
2343
|
+
},
|
|
2344
|
+
"filePath": "tokens/colors/themes/navy.json",
|
|
2345
|
+
"isSource": true,
|
|
2346
|
+
"original": {
|
|
2347
|
+
"value": "{color.base.smoke.dark.value}"
|
|
2348
|
+
},
|
|
2349
|
+
"name": "navyContentTertiary",
|
|
2350
|
+
"attributes": {
|
|
2351
|
+
"category": "color",
|
|
2352
|
+
"type": "navy",
|
|
2353
|
+
"item": "content",
|
|
2354
|
+
"subitem": "tertiary"
|
|
2355
|
+
},
|
|
2356
|
+
"path": [
|
|
2357
|
+
"color",
|
|
2358
|
+
"navy",
|
|
2359
|
+
"content",
|
|
2360
|
+
"tertiary"
|
|
2361
|
+
]
|
|
2362
|
+
},
|
|
2388
2363
|
"accent": {
|
|
2389
2364
|
"value": {
|
|
2390
2365
|
"r": 0,
|
|
@@ -2484,31 +2459,6 @@
|
|
|
2484
2459
|
"content",
|
|
2485
2460
|
"warning"
|
|
2486
2461
|
]
|
|
2487
|
-
},
|
|
2488
|
-
"disabled": {
|
|
2489
|
-
"value": {
|
|
2490
|
-
"r": 0.6588235294117647,
|
|
2491
|
-
"g": 0.6666666666666666,
|
|
2492
|
-
"b": 0.6745098039215687
|
|
2493
|
-
},
|
|
2494
|
-
"filePath": "tokens/colors/themes/navy.json",
|
|
2495
|
-
"isSource": true,
|
|
2496
|
-
"original": {
|
|
2497
|
-
"value": "{color.base.smoke.dark.value}"
|
|
2498
|
-
},
|
|
2499
|
-
"name": "navyContentDisabled",
|
|
2500
|
-
"attributes": {
|
|
2501
|
-
"category": "color",
|
|
2502
|
-
"type": "navy",
|
|
2503
|
-
"item": "content",
|
|
2504
|
-
"subitem": "disabled"
|
|
2505
|
-
},
|
|
2506
|
-
"path": [
|
|
2507
|
-
"color",
|
|
2508
|
-
"navy",
|
|
2509
|
-
"content",
|
|
2510
|
-
"disabled"
|
|
2511
|
-
]
|
|
2512
2462
|
}
|
|
2513
2463
|
},
|
|
2514
2464
|
"interactive": {
|
|
@@ -2636,31 +2586,6 @@
|
|
|
2636
2586
|
"interactive",
|
|
2637
2587
|
"secondary"
|
|
2638
2588
|
]
|
|
2639
|
-
},
|
|
2640
|
-
"disabled": {
|
|
2641
|
-
"value": {
|
|
2642
|
-
"r": 0.6588235294117647,
|
|
2643
|
-
"g": 0.6666666666666666,
|
|
2644
|
-
"b": 0.6745098039215687
|
|
2645
|
-
},
|
|
2646
|
-
"filePath": "tokens/colors/themes/navy.json",
|
|
2647
|
-
"isSource": true,
|
|
2648
|
-
"original": {
|
|
2649
|
-
"value": "{color.base.smoke.dark.value}"
|
|
2650
|
-
},
|
|
2651
|
-
"name": "navyInteractiveDisabled",
|
|
2652
|
-
"attributes": {
|
|
2653
|
-
"category": "color",
|
|
2654
|
-
"type": "navy",
|
|
2655
|
-
"item": "interactive",
|
|
2656
|
-
"subitem": "disabled"
|
|
2657
|
-
},
|
|
2658
|
-
"path": [
|
|
2659
|
-
"color",
|
|
2660
|
-
"navy",
|
|
2661
|
-
"interactive",
|
|
2662
|
-
"disabled"
|
|
2663
|
-
]
|
|
2664
2589
|
}
|
|
2665
2590
|
},
|
|
2666
2591
|
"background": {
|
package/package.json
CHANGED
package/themes/dark/tokens.css
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-dark {
|
|
7
7
|
--color-content-primary: #e2e6e8;
|
|
8
8
|
--color-content-secondary: #c9cbce;
|
|
9
|
+
--color-content-tertiary: #a8aaac;
|
|
9
10
|
--color-content-accent: #00b9ff;
|
|
10
11
|
--color-content-accent-hover: #00a6ea;
|
|
11
12
|
--color-content-accent-active: #0097db;
|
|
@@ -18,7 +19,6 @@
|
|
|
18
19
|
--color-content-warning: #ffd184;
|
|
19
20
|
--color-content-warning-hover: #e9bd71;
|
|
20
21
|
--color-content-warning-active: #daae63;
|
|
21
|
-
--color-content-disabled: #a8aaac;
|
|
22
22
|
--color-interactive-accent: #00a2dd;
|
|
23
23
|
--color-interactive-accent-hover: #008fc9;
|
|
24
24
|
--color-interactive-accent-active: #0081ba;
|
|
@@ -34,7 +34,6 @@
|
|
|
34
34
|
--color-interactive-secondary: #a8aaac;
|
|
35
35
|
--color-interactive-secondary-hover: #959799;
|
|
36
36
|
--color-interactive-secondary-active: #87898b;
|
|
37
|
-
--color-interactive-disabled: #a8aaac;
|
|
38
37
|
--color-background-screen: #181818;
|
|
39
38
|
--color-background-elevated: #202020;
|
|
40
39
|
--color-background-neutral: #86a7bd1a;
|
|
@@ -79,4 +78,5 @@
|
|
|
79
78
|
--font-weight-regular: 500;
|
|
80
79
|
--font-weight-semi-bold: 600;
|
|
81
80
|
--font-weight-bold: 800;
|
|
81
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
82
|
}
|
package/themes/dark/tokens.less
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #e2e6e8;
|
|
6
6
|
@color-content-secondary: #c9cbce;
|
|
7
|
+
@color-content-tertiary: #a8aaac;
|
|
7
8
|
@color-content-accent: #00b9ff;
|
|
8
9
|
@color-content-accent-hover: #00a6ea;
|
|
9
10
|
@color-content-accent-active: #0097db;
|
|
@@ -16,7 +17,6 @@
|
|
|
16
17
|
@color-content-warning: #ffd184;
|
|
17
18
|
@color-content-warning-hover: #e9bd71;
|
|
18
19
|
@color-content-warning-active: #daae63;
|
|
19
|
-
@color-content-disabled: #a8aaac;
|
|
20
20
|
@color-interactive-accent: #00a2dd;
|
|
21
21
|
@color-interactive-accent-hover: #008fc9;
|
|
22
22
|
@color-interactive-accent-active: #0081ba;
|
|
@@ -32,7 +32,6 @@
|
|
|
32
32
|
@color-interactive-secondary: #a8aaac;
|
|
33
33
|
@color-interactive-secondary-hover: #959799;
|
|
34
34
|
@color-interactive-secondary-active: #87898b;
|
|
35
|
-
@color-interactive-disabled: #a8aaac;
|
|
36
35
|
@color-background-screen: #181818;
|
|
37
36
|
@color-background-elevated: #202020;
|
|
38
37
|
@color-background-neutral: #86a7bd1a;
|
|
@@ -76,4 +75,5 @@
|
|
|
76
75
|
@line-height-control: 1.2;
|
|
77
76
|
@font-weight-regular: 500;
|
|
78
77
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
78
|
+
@font-weight-bold: 800;
|
|
79
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/themes/light/tokens.css
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-light {
|
|
7
7
|
--color-content-primary: #37517e;
|
|
8
8
|
--color-content-secondary: #5d7079;
|
|
9
|
+
--color-content-tertiary: #768e9c;
|
|
9
10
|
--color-content-accent: #0097c7;
|
|
10
11
|
--color-content-accent-hover: #0084b3;
|
|
11
12
|
--color-content-accent-active: #0077a5;
|
|
@@ -18,7 +19,6 @@
|
|
|
18
19
|
--color-content-warning: #9a6500;
|
|
19
20
|
--color-content-warning-hover: #855400;
|
|
20
21
|
--color-content-warning-active: #764700;
|
|
21
|
-
--color-content-disabled: #a8aaac;
|
|
22
22
|
--color-interactive-accent: #00a2dd;
|
|
23
23
|
--color-interactive-accent-hover: #008fc9;
|
|
24
24
|
--color-interactive-accent-active: #0081ba;
|
|
@@ -34,7 +34,6 @@
|
|
|
34
34
|
--color-interactive-secondary: #c9cbce;
|
|
35
35
|
--color-interactive-secondary-hover: #b5b7ba;
|
|
36
36
|
--color-interactive-secondary-active: #a7a9ab;
|
|
37
|
-
--color-interactive-disabled: #a8aaac;
|
|
38
37
|
--color-background-screen: #ffffff;
|
|
39
38
|
--color-background-elevated: #ffffff;
|
|
40
39
|
--color-background-neutral: #86a7bd1a;
|
|
@@ -79,4 +78,5 @@
|
|
|
79
78
|
--font-weight-regular: 500;
|
|
80
79
|
--font-weight-semi-bold: 600;
|
|
81
80
|
--font-weight-bold: 800;
|
|
81
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
82
|
}
|
package/themes/light/tokens.less
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #37517e;
|
|
6
6
|
@color-content-secondary: #5d7079;
|
|
7
|
+
@color-content-tertiary: #768e9c;
|
|
7
8
|
@color-content-accent: #0097c7;
|
|
8
9
|
@color-content-accent-hover: #0084b3;
|
|
9
10
|
@color-content-accent-active: #0077a5;
|
|
@@ -16,7 +17,6 @@
|
|
|
16
17
|
@color-content-warning: #9a6500;
|
|
17
18
|
@color-content-warning-hover: #855400;
|
|
18
19
|
@color-content-warning-active: #764700;
|
|
19
|
-
@color-content-disabled: #a8aaac;
|
|
20
20
|
@color-interactive-accent: #00a2dd;
|
|
21
21
|
@color-interactive-accent-hover: #008fc9;
|
|
22
22
|
@color-interactive-accent-active: #0081ba;
|
|
@@ -32,7 +32,6 @@
|
|
|
32
32
|
@color-interactive-secondary: #c9cbce;
|
|
33
33
|
@color-interactive-secondary-hover: #b5b7ba;
|
|
34
34
|
@color-interactive-secondary-active: #a7a9ab;
|
|
35
|
-
@color-interactive-disabled: #a8aaac;
|
|
36
35
|
@color-background-screen: #ffffff;
|
|
37
36
|
@color-background-elevated: #ffffff;
|
|
38
37
|
@color-background-neutral: #86a7bd1a;
|
|
@@ -76,4 +75,5 @@
|
|
|
76
75
|
@line-height-control: 1.2;
|
|
77
76
|
@font-weight-regular: 500;
|
|
78
77
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
78
|
+
@font-weight-bold: 800;
|
|
79
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/themes/navy/tokens.css
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
.np-theme-navy {
|
|
7
7
|
--color-content-primary: #ffffff;
|
|
8
8
|
--color-content-secondary: #c9cbce;
|
|
9
|
+
--color-content-tertiary: #a8aaac;
|
|
9
10
|
--color-content-accent: #00b9ff;
|
|
10
11
|
--color-content-accent-hover: #00a6ea;
|
|
11
12
|
--color-content-accent-active: #0097db;
|
|
@@ -18,7 +19,6 @@
|
|
|
18
19
|
--color-content-warning: #ffd184;
|
|
19
20
|
--color-content-warning-hover: #e9bd71;
|
|
20
21
|
--color-content-warning-active: #daae63;
|
|
21
|
-
--color-content-disabled: #a8aaac;
|
|
22
22
|
--color-interactive-accent: #00a2dd;
|
|
23
23
|
--color-interactive-accent-hover: #008fc9;
|
|
24
24
|
--color-interactive-accent-active: #0081ba;
|
|
@@ -34,7 +34,6 @@
|
|
|
34
34
|
--color-interactive-secondary: #a8aaac;
|
|
35
35
|
--color-interactive-secondary-hover: #959799;
|
|
36
36
|
--color-interactive-secondary-active: #87898b;
|
|
37
|
-
--color-interactive-disabled: #a8aaac;
|
|
38
37
|
--color-background-screen: #2e4369;
|
|
39
38
|
--color-background-elevated: #37517e;
|
|
40
39
|
--color-background-neutral: #86a7bd1a;
|
|
@@ -79,4 +78,5 @@
|
|
|
79
78
|
--font-weight-regular: 500;
|
|
80
79
|
--font-weight-semi-bold: 600;
|
|
81
80
|
--font-weight-bold: 800;
|
|
81
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
82
82
|
}
|
package/themes/navy/tokens.less
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
|
|
5
5
|
@color-content-primary: #ffffff;
|
|
6
6
|
@color-content-secondary: #c9cbce;
|
|
7
|
+
@color-content-tertiary: #a8aaac;
|
|
7
8
|
@color-content-accent: #00b9ff;
|
|
8
9
|
@color-content-accent-hover: #00a6ea;
|
|
9
10
|
@color-content-accent-active: #0097db;
|
|
@@ -16,7 +17,6 @@
|
|
|
16
17
|
@color-content-warning: #ffd184;
|
|
17
18
|
@color-content-warning-hover: #e9bd71;
|
|
18
19
|
@color-content-warning-active: #daae63;
|
|
19
|
-
@color-content-disabled: #a8aaac;
|
|
20
20
|
@color-interactive-accent: #00a2dd;
|
|
21
21
|
@color-interactive-accent-hover: #008fc9;
|
|
22
22
|
@color-interactive-accent-active: #0081ba;
|
|
@@ -32,7 +32,6 @@
|
|
|
32
32
|
@color-interactive-secondary: #a8aaac;
|
|
33
33
|
@color-interactive-secondary-hover: #959799;
|
|
34
34
|
@color-interactive-secondary-active: #87898b;
|
|
35
|
-
@color-interactive-disabled: #a8aaac;
|
|
36
35
|
@color-background-screen: #2e4369;
|
|
37
36
|
@color-background-elevated: #37517e;
|
|
38
37
|
@color-background-neutral: #86a7bd1a;
|
|
@@ -76,4 +75,5 @@
|
|
|
76
75
|
@line-height-control: 1.2;
|
|
77
76
|
@font-weight-regular: 500;
|
|
78
77
|
@font-weight-semi-bold: 600;
|
|
79
|
-
@font-weight-bold: 800;
|
|
78
|
+
@font-weight-bold: 800;
|
|
79
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
package/tokens.css
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
7
7
|
--color-content-primary: #37517e;
|
|
8
8
|
--color-content-secondary: #5d7079;
|
|
9
|
+
--color-content-tertiary: #768e9c;
|
|
9
10
|
--color-content-accent: #0097c7;
|
|
10
11
|
--color-content-accent-hover: #0084b3;
|
|
11
12
|
--color-content-accent-active: #0077a5;
|
|
@@ -18,7 +19,6 @@
|
|
|
18
19
|
--color-content-warning: #9a6500;
|
|
19
20
|
--color-content-warning-hover: #855400;
|
|
20
21
|
--color-content-warning-active: #764700;
|
|
21
|
-
--color-content-disabled: #a8aaac;
|
|
22
22
|
--color-interactive-accent: #00a2dd;
|
|
23
23
|
--color-interactive-accent-hover: #008fc9;
|
|
24
24
|
--color-interactive-accent-active: #0081ba;
|
|
@@ -34,7 +34,6 @@
|
|
|
34
34
|
--color-interactive-secondary: #c9cbce;
|
|
35
35
|
--color-interactive-secondary-hover: #b5b7ba;
|
|
36
36
|
--color-interactive-secondary-active: #a7a9ab;
|
|
37
|
-
--color-interactive-disabled: #a8aaac;
|
|
38
37
|
--color-background-screen: #ffffff;
|
|
39
38
|
--color-background-elevated: #ffffff;
|
|
40
39
|
--color-background-neutral: #86a7bd1a;
|
|
@@ -46,48 +45,6 @@
|
|
|
46
45
|
--color-border-neutral: #0000001a;
|
|
47
46
|
--color-border-overlay: #0000001a;
|
|
48
47
|
--color-core-contrast: #000000;
|
|
49
|
-
--color-navy-content-primary: #ffffff;
|
|
50
|
-
--color-navy-content-secondary: #c9cbce;
|
|
51
|
-
--color-navy-content-accent: #00b9ff;
|
|
52
|
-
--color-navy-content-accent-hover: #00a6ea;
|
|
53
|
-
--color-navy-content-accent-active: #0097db;
|
|
54
|
-
--color-navy-content-positive: #6fd698;
|
|
55
|
-
--color-navy-content-positive-hover: #5ac285;
|
|
56
|
-
--color-navy-content-positive-active: #4bb377;
|
|
57
|
-
--color-navy-content-negative: #ffa6a9;
|
|
58
|
-
--color-navy-content-negative-hover: #ea9396;
|
|
59
|
-
--color-navy-content-negative-active: #da8488;
|
|
60
|
-
--color-navy-content-warning: #ffd184;
|
|
61
|
-
--color-navy-content-warning-hover: #e9bd71;
|
|
62
|
-
--color-navy-content-warning-active: #daae63;
|
|
63
|
-
--color-navy-content-disabled: #a8aaac;
|
|
64
|
-
--color-navy-interactive-accent: #00a2dd;
|
|
65
|
-
--color-navy-interactive-accent-hover: #008fc9;
|
|
66
|
-
--color-navy-interactive-accent-active: #0081ba;
|
|
67
|
-
--color-navy-interactive-positive: #2ead4b;
|
|
68
|
-
--color-navy-interactive-positive-hover: #069939;
|
|
69
|
-
--color-navy-interactive-positive-active: #008b2b;
|
|
70
|
-
--color-navy-interactive-negative: #e74848;
|
|
71
|
-
--color-navy-interactive-negative-hover: #d03238;
|
|
72
|
-
--color-navy-interactive-negative-active: #bf1e2c;
|
|
73
|
-
--color-navy-interactive-warning: #df8700;
|
|
74
|
-
--color-navy-interactive-warning-hover: #c97500;
|
|
75
|
-
--color-navy-interactive-warning-active: #b86700;
|
|
76
|
-
--color-navy-interactive-secondary: #a8aaac;
|
|
77
|
-
--color-navy-interactive-secondary-hover: #959799;
|
|
78
|
-
--color-navy-interactive-secondary-active: #87898b;
|
|
79
|
-
--color-navy-interactive-disabled: #a8aaac;
|
|
80
|
-
--color-navy-background-screen: #2e4369;
|
|
81
|
-
--color-navy-background-elevated: #37517e;
|
|
82
|
-
--color-navy-background-neutral: #86a7bd1a;
|
|
83
|
-
--color-navy-background-accent: #38c8ff1a;
|
|
84
|
-
--color-navy-background-positive: #36c7971a;
|
|
85
|
-
--color-navy-background-negative: #ff87871a;
|
|
86
|
-
--color-navy-background-warning: #ffac001a;
|
|
87
|
-
--color-navy-background-overlay: #ffffff1a;
|
|
88
|
-
--color-navy-border-neutral: #ffffff1a;
|
|
89
|
-
--color-navy-border-overlay: #ffffff1a;
|
|
90
|
-
--color-navy-core-contrast: #ffffff;
|
|
91
48
|
--radius-small: 3px;
|
|
92
49
|
--radius-medium: 10px;
|
|
93
50
|
--size-4: 4px;
|
|
@@ -121,4 +78,5 @@
|
|
|
121
78
|
--font-weight-regular: 500;
|
|
122
79
|
--font-weight-semi-bold: 600;
|
|
123
80
|
--font-weight-bold: 800;
|
|
81
|
+
--font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|
|
124
82
|
}
|
package/tokens.less
CHANGED
|
@@ -1,9 +1,51 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Mon, 17 Jan 2022 12:49:22 GMT
|
|
4
4
|
|
|
5
|
+
@color-dark-content-primary: #e2e6e8;
|
|
6
|
+
@color-dark-content-secondary: #c9cbce;
|
|
7
|
+
@color-dark-content-tertiary: #a8aaac;
|
|
8
|
+
@color-dark-content-accent: #00b9ff;
|
|
9
|
+
@color-dark-content-accent-hover: #00a6ea;
|
|
10
|
+
@color-dark-content-accent-active: #0097db;
|
|
11
|
+
@color-dark-content-positive: #6fd698;
|
|
12
|
+
@color-dark-content-positive-hover: #5ac285;
|
|
13
|
+
@color-dark-content-positive-active: #4bb377;
|
|
14
|
+
@color-dark-content-negative: #ffa6a9;
|
|
15
|
+
@color-dark-content-negative-hover: #ea9396;
|
|
16
|
+
@color-dark-content-negative-active: #da8488;
|
|
17
|
+
@color-dark-content-warning: #ffd184;
|
|
18
|
+
@color-dark-content-warning-hover: #e9bd71;
|
|
19
|
+
@color-dark-content-warning-active: #daae63;
|
|
20
|
+
@color-dark-interactive-accent: #00a2dd;
|
|
21
|
+
@color-dark-interactive-accent-hover: #008fc9;
|
|
22
|
+
@color-dark-interactive-accent-active: #0081ba;
|
|
23
|
+
@color-dark-interactive-positive: #2ead4b;
|
|
24
|
+
@color-dark-interactive-positive-hover: #069939;
|
|
25
|
+
@color-dark-interactive-positive-active: #008b2b;
|
|
26
|
+
@color-dark-interactive-negative: #e74848;
|
|
27
|
+
@color-dark-interactive-negative-hover: #d03238;
|
|
28
|
+
@color-dark-interactive-negative-active: #bf1e2c;
|
|
29
|
+
@color-dark-interactive-warning: #df8700;
|
|
30
|
+
@color-dark-interactive-warning-hover: #c97500;
|
|
31
|
+
@color-dark-interactive-warning-active: #b86700;
|
|
32
|
+
@color-dark-interactive-secondary: #a8aaac;
|
|
33
|
+
@color-dark-interactive-secondary-hover: #959799;
|
|
34
|
+
@color-dark-interactive-secondary-active: #87898b;
|
|
35
|
+
@color-dark-background-screen: #181818;
|
|
36
|
+
@color-dark-background-elevated: #202020;
|
|
37
|
+
@color-dark-background-neutral: #86a7bd1a;
|
|
38
|
+
@color-dark-background-accent: #38c8ff1a;
|
|
39
|
+
@color-dark-background-positive: #36c7971a;
|
|
40
|
+
@color-dark-background-negative: #ff87871a;
|
|
41
|
+
@color-dark-background-warning: #ffac001a;
|
|
42
|
+
@color-dark-background-overlay: #ffffff1a;
|
|
43
|
+
@color-dark-border-neutral: #ffffff1a;
|
|
44
|
+
@color-dark-border-overlay: #ffffff1a;
|
|
45
|
+
@color-dark-core-contrast: #ffffff;
|
|
5
46
|
@color-content-primary: #37517e;
|
|
6
47
|
@color-content-secondary: #5d7079;
|
|
48
|
+
@color-content-tertiary: #768e9c;
|
|
7
49
|
@color-content-accent: #0097c7;
|
|
8
50
|
@color-content-accent-hover: #0084b3;
|
|
9
51
|
@color-content-accent-active: #0077a5;
|
|
@@ -16,7 +58,6 @@
|
|
|
16
58
|
@color-content-warning: #9a6500;
|
|
17
59
|
@color-content-warning-hover: #855400;
|
|
18
60
|
@color-content-warning-active: #764700;
|
|
19
|
-
@color-content-disabled: #a8aaac;
|
|
20
61
|
@color-interactive-accent: #00a2dd;
|
|
21
62
|
@color-interactive-accent-hover: #008fc9;
|
|
22
63
|
@color-interactive-accent-active: #0081ba;
|
|
@@ -32,7 +73,6 @@
|
|
|
32
73
|
@color-interactive-secondary: #c9cbce;
|
|
33
74
|
@color-interactive-secondary-hover: #b5b7ba;
|
|
34
75
|
@color-interactive-secondary-active: #a7a9ab;
|
|
35
|
-
@color-interactive-disabled: #a8aaac;
|
|
36
76
|
@color-background-screen: #ffffff;
|
|
37
77
|
@color-background-elevated: #ffffff;
|
|
38
78
|
@color-background-neutral: #86a7bd1a;
|
|
@@ -46,6 +86,7 @@
|
|
|
46
86
|
@color-core-contrast: #000000;
|
|
47
87
|
@color-navy-content-primary: #ffffff;
|
|
48
88
|
@color-navy-content-secondary: #c9cbce;
|
|
89
|
+
@color-navy-content-tertiary: #a8aaac;
|
|
49
90
|
@color-navy-content-accent: #00b9ff;
|
|
50
91
|
@color-navy-content-accent-hover: #00a6ea;
|
|
51
92
|
@color-navy-content-accent-active: #0097db;
|
|
@@ -58,7 +99,6 @@
|
|
|
58
99
|
@color-navy-content-warning: #ffd184;
|
|
59
100
|
@color-navy-content-warning-hover: #e9bd71;
|
|
60
101
|
@color-navy-content-warning-active: #daae63;
|
|
61
|
-
@color-navy-content-disabled: #a8aaac;
|
|
62
102
|
@color-navy-interactive-accent: #00a2dd;
|
|
63
103
|
@color-navy-interactive-accent-hover: #008fc9;
|
|
64
104
|
@color-navy-interactive-accent-active: #0081ba;
|
|
@@ -74,7 +114,6 @@
|
|
|
74
114
|
@color-navy-interactive-secondary: #a8aaac;
|
|
75
115
|
@color-navy-interactive-secondary-hover: #959799;
|
|
76
116
|
@color-navy-interactive-secondary-active: #87898b;
|
|
77
|
-
@color-navy-interactive-disabled: #a8aaac;
|
|
78
117
|
@color-navy-background-screen: #2e4369;
|
|
79
118
|
@color-navy-background-elevated: #37517e;
|
|
80
119
|
@color-navy-background-neutral: #86a7bd1a;
|
|
@@ -118,4 +157,5 @@
|
|
|
118
157
|
@line-height-control: 1.2;
|
|
119
158
|
@font-weight-regular: 500;
|
|
120
159
|
@font-weight-semi-bold: 600;
|
|
121
|
-
@font-weight-bold: 800;
|
|
160
|
+
@font-weight-bold: 800;
|
|
161
|
+
@font-family-regular: Averta, Avenir W02, Avenir, Helvetica, Arial, sans-serif;
|