@navikt/ds-tokens 3.4.2 → 4.1.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/dist/tokens-cjs.js +21 -3
- package/dist/tokens.css +21 -3
- package/dist/tokens.d.ts +19 -1
- package/dist/tokens.js +21 -3
- package/dist/tokens.less +21 -3
- package/dist/tokens.scss +21 -3
- package/docs.json +78 -2
- package/package.json +1 -1
- package/src/data-colors.json +52 -0
- package/src/semantic-colors.json +2 -2
package/dist/tokens-cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
module.exports = {
|
|
@@ -63,6 +63,24 @@ module.exports = {
|
|
|
63
63
|
"ABorderAlt1": "rgba(130, 105, 162, 1)",
|
|
64
64
|
"ABorderAlt2": "rgba(127, 137, 0, 1)",
|
|
65
65
|
"ABorderAlt3": "rgba(0, 91, 130, 1)",
|
|
66
|
+
"ADataSurface1": "rgba(51, 134, 224, 1)",
|
|
67
|
+
"ADataSurface1Subtle": "rgba(204, 225, 255, 1)",
|
|
68
|
+
"ADataSurface2": "rgba(0, 91, 130, 1)",
|
|
69
|
+
"ADataSurface2Subtle": "rgba(153, 196, 221, 1)",
|
|
70
|
+
"ADataSurface3": "rgba(199, 115, 0, 1)",
|
|
71
|
+
"ADataSurface3Subtle": "rgba(255, 193, 102, 1)",
|
|
72
|
+
"ADataSurface4": "rgba(54, 141, 168, 1)",
|
|
73
|
+
"ADataSurface4Subtle": "rgba(102, 203, 236, 1)",
|
|
74
|
+
"ADataSurface5": "rgba(51, 170, 95, 1)",
|
|
75
|
+
"ADataSurface5Subtle": "rgba(153, 222, 173, 1)",
|
|
76
|
+
"ADataSurface6": "rgba(130, 105, 162, 1)",
|
|
77
|
+
"ADataSurface6Subtle": "rgba(192, 178, 210, 1)",
|
|
78
|
+
"ADataBorder1": "rgba(51, 134, 224, 1)",
|
|
79
|
+
"ADataBorder2": "rgba(0, 91, 130, 1)",
|
|
80
|
+
"ADataBorder3": "rgba(199, 115, 0, 1)",
|
|
81
|
+
"ADataBorder4": "rgba(54, 141, 168, 1)",
|
|
82
|
+
"ADataBorder5": "rgba(51, 170, 95, 1)",
|
|
83
|
+
"ADataBorder6": "rgba(130, 105, 162, 1)",
|
|
66
84
|
"ATransparent": "rgba(255, 255, 255, 0)",
|
|
67
85
|
"AWhite": "rgba(255, 255, 255, 1)",
|
|
68
86
|
"ANavRed": "rgba(195, 0, 0, 1)",
|
|
@@ -167,7 +185,7 @@ module.exports = {
|
|
|
167
185
|
"APurple800": "rgba(48, 31, 70, 1)",
|
|
168
186
|
"APurple900": "rgba(31, 20, 47, 1)",
|
|
169
187
|
"ATextDefault": "rgba(38, 38, 38, 1)",
|
|
170
|
-
"ATextSubtle": "rgba(0, 0, 0, 0.
|
|
188
|
+
"ATextSubtle": "rgba(0, 0, 0, 0.65)",
|
|
171
189
|
"ATextVisited": "rgba(99, 70, 137, 1)",
|
|
172
190
|
"ATextDanger": "rgba(195, 0, 0, 1)",
|
|
173
191
|
"ATextActionSelected": "rgba(0, 91, 130, 1)",
|
|
@@ -239,7 +257,7 @@ module.exports = {
|
|
|
239
257
|
"ASurfaceAlt3Strong": "rgba(0, 52, 83, 1)",
|
|
240
258
|
"ASurfaceAlt3": "rgba(0, 91, 130, 1)",
|
|
241
259
|
"AIconDefault": "rgba(38, 38, 38, 1)",
|
|
242
|
-
"AIconSubtle": "rgba(
|
|
260
|
+
"AIconSubtle": "rgba(0, 0, 0, 0.65)",
|
|
243
261
|
"AIconActionSelected": "rgba(0, 91, 130, 1)",
|
|
244
262
|
"AIconActionOnActionSubtle": "rgba(0, 86, 180, 1)",
|
|
245
263
|
"AIconAction": "rgba(0, 103, 197, 1)",
|
package/dist/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root, :host {
|
|
@@ -189,7 +189,7 @@
|
|
|
189
189
|
--a-icon-action: var(--a-blue-500);
|
|
190
190
|
--a-icon-action-on-action-subtle: var(--a-blue-600);
|
|
191
191
|
--a-icon-action-selected: var(--a-deepblue-500);
|
|
192
|
-
--a-icon-subtle: var(--a-
|
|
192
|
+
--a-icon-subtle: var(--a-grayalpha-700);
|
|
193
193
|
--a-icon-default: var(--a-gray-900);
|
|
194
194
|
--a-surface-alt-3: var(--a-deepblue-500);
|
|
195
195
|
--a-surface-alt-3-strong: var(--a-deepblue-800);
|
|
@@ -261,8 +261,26 @@
|
|
|
261
261
|
--a-text-action-selected: var(--a-deepblue-500);
|
|
262
262
|
--a-text-danger: var(--a-red-500);
|
|
263
263
|
--a-text-visited: var(--a-purple-500);
|
|
264
|
-
--a-text-subtle: var(--a-grayalpha-
|
|
264
|
+
--a-text-subtle: var(--a-grayalpha-700);
|
|
265
265
|
--a-text-default: var(--a-gray-900);
|
|
266
|
+
--a-data-border-6: var(--a-purple-400);
|
|
267
|
+
--a-data-border-5: var(--a-green-400);
|
|
268
|
+
--a-data-border-4: var(--a-lightblue-700);
|
|
269
|
+
--a-data-border-3: var(--a-orange-600);
|
|
270
|
+
--a-data-border-2: var(--a-deepblue-500);
|
|
271
|
+
--a-data-border-1: var(--a-blue-400);
|
|
272
|
+
--a-data-surface-6-subtle: var(--a-purple-200);
|
|
273
|
+
--a-data-surface-6: var(--a-purple-400);
|
|
274
|
+
--a-data-surface-5-subtle: var(--a-green-200);
|
|
275
|
+
--a-data-surface-5: var(--a-green-400);
|
|
276
|
+
--a-data-surface-4-subtle: var(--a-lightblue-500);
|
|
277
|
+
--a-data-surface-4: var(--a-lightblue-700);
|
|
278
|
+
--a-data-surface-3-subtle: var(--a-orange-300);
|
|
279
|
+
--a-data-surface-3: var(--a-orange-600);
|
|
280
|
+
--a-data-surface-2-subtle: var(--a-deepblue-200);
|
|
281
|
+
--a-data-surface-2: var(--a-deepblue-500);
|
|
282
|
+
--a-data-surface-1-subtle: var(--a-blue-100);
|
|
283
|
+
--a-data-surface-1: var(--a-blue-400);
|
|
266
284
|
--a-border-alt-3: var(--a-deepblue-500);
|
|
267
285
|
--a-border-alt-2: var(--a-limegreen-700);
|
|
268
286
|
--a-border-alt-1: var(--a-purple-400);
|
package/dist/tokens.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const ABreakpointXs : string;
|
|
@@ -62,6 +62,24 @@ export const ABorderOnInvertedSubtle : string;
|
|
|
62
62
|
export const ABorderAlt1 : string;
|
|
63
63
|
export const ABorderAlt2 : string;
|
|
64
64
|
export const ABorderAlt3 : string;
|
|
65
|
+
export const ADataSurface1 : string;
|
|
66
|
+
export const ADataSurface1Subtle : string;
|
|
67
|
+
export const ADataSurface2 : string;
|
|
68
|
+
export const ADataSurface2Subtle : string;
|
|
69
|
+
export const ADataSurface3 : string;
|
|
70
|
+
export const ADataSurface3Subtle : string;
|
|
71
|
+
export const ADataSurface4 : string;
|
|
72
|
+
export const ADataSurface4Subtle : string;
|
|
73
|
+
export const ADataSurface5 : string;
|
|
74
|
+
export const ADataSurface5Subtle : string;
|
|
75
|
+
export const ADataSurface6 : string;
|
|
76
|
+
export const ADataSurface6Subtle : string;
|
|
77
|
+
export const ADataBorder1 : string;
|
|
78
|
+
export const ADataBorder2 : string;
|
|
79
|
+
export const ADataBorder3 : string;
|
|
80
|
+
export const ADataBorder4 : string;
|
|
81
|
+
export const ADataBorder5 : string;
|
|
82
|
+
export const ADataBorder6 : string;
|
|
65
83
|
export const ATransparent : string;
|
|
66
84
|
export const AWhite : string;
|
|
67
85
|
export const ANavRed : string;
|
package/dist/tokens.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const ABreakpointXs = "0";
|
|
@@ -62,6 +62,24 @@ export const ABorderOnInvertedSubtle = "rgba(89, 89, 89, 1)";
|
|
|
62
62
|
export const ABorderAlt1 = "rgba(130, 105, 162, 1)";
|
|
63
63
|
export const ABorderAlt2 = "rgba(127, 137, 0, 1)";
|
|
64
64
|
export const ABorderAlt3 = "rgba(0, 91, 130, 1)";
|
|
65
|
+
export const ADataSurface1 = "rgba(51, 134, 224, 1)";
|
|
66
|
+
export const ADataSurface1Subtle = "rgba(204, 225, 255, 1)";
|
|
67
|
+
export const ADataSurface2 = "rgba(0, 91, 130, 1)";
|
|
68
|
+
export const ADataSurface2Subtle = "rgba(153, 196, 221, 1)";
|
|
69
|
+
export const ADataSurface3 = "rgba(199, 115, 0, 1)";
|
|
70
|
+
export const ADataSurface3Subtle = "rgba(255, 193, 102, 1)";
|
|
71
|
+
export const ADataSurface4 = "rgba(54, 141, 168, 1)";
|
|
72
|
+
export const ADataSurface4Subtle = "rgba(102, 203, 236, 1)";
|
|
73
|
+
export const ADataSurface5 = "rgba(51, 170, 95, 1)";
|
|
74
|
+
export const ADataSurface5Subtle = "rgba(153, 222, 173, 1)";
|
|
75
|
+
export const ADataSurface6 = "rgba(130, 105, 162, 1)";
|
|
76
|
+
export const ADataSurface6Subtle = "rgba(192, 178, 210, 1)";
|
|
77
|
+
export const ADataBorder1 = "rgba(51, 134, 224, 1)";
|
|
78
|
+
export const ADataBorder2 = "rgba(0, 91, 130, 1)";
|
|
79
|
+
export const ADataBorder3 = "rgba(199, 115, 0, 1)";
|
|
80
|
+
export const ADataBorder4 = "rgba(54, 141, 168, 1)";
|
|
81
|
+
export const ADataBorder5 = "rgba(51, 170, 95, 1)";
|
|
82
|
+
export const ADataBorder6 = "rgba(130, 105, 162, 1)";
|
|
65
83
|
export const ATransparent = "rgba(255, 255, 255, 0)";
|
|
66
84
|
export const AWhite = "rgba(255, 255, 255, 1)";
|
|
67
85
|
export const ANavRed = "rgba(195, 0, 0, 1)";
|
|
@@ -166,7 +184,7 @@ export const APurple700 = "rgba(65, 43, 93, 1)";
|
|
|
166
184
|
export const APurple800 = "rgba(48, 31, 70, 1)";
|
|
167
185
|
export const APurple900 = "rgba(31, 20, 47, 1)";
|
|
168
186
|
export const ATextDefault = "rgba(38, 38, 38, 1)";
|
|
169
|
-
export const ATextSubtle = "rgba(0, 0, 0, 0.
|
|
187
|
+
export const ATextSubtle = "rgba(0, 0, 0, 0.65)";
|
|
170
188
|
export const ATextVisited = "rgba(99, 70, 137, 1)";
|
|
171
189
|
export const ATextDanger = "rgba(195, 0, 0, 1)";
|
|
172
190
|
export const ATextActionSelected = "rgba(0, 91, 130, 1)";
|
|
@@ -238,7 +256,7 @@ export const ASurfaceAlt3Moderate = "rgba(153, 196, 221, 1)";
|
|
|
238
256
|
export const ASurfaceAlt3Strong = "rgba(0, 52, 83, 1)";
|
|
239
257
|
export const ASurfaceAlt3 = "rgba(0, 91, 130, 1)";
|
|
240
258
|
export const AIconDefault = "rgba(38, 38, 38, 1)";
|
|
241
|
-
export const AIconSubtle = "rgba(
|
|
259
|
+
export const AIconSubtle = "rgba(0, 0, 0, 0.65)";
|
|
242
260
|
export const AIconActionSelected = "rgba(0, 91, 130, 1)";
|
|
243
261
|
export const AIconActionOnActionSubtle = "rgba(0, 86, 180, 1)";
|
|
244
262
|
export const AIconAction = "rgba(0, 103, 197, 1)";
|
package/dist/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
|
|
5
5
|
@a-breakpoint-xs: 0;
|
|
6
6
|
@a-breakpoint-sm: 480px;
|
|
@@ -61,6 +61,24 @@
|
|
|
61
61
|
@a-border-alt-1: rgba(130, 105, 162, 1);
|
|
62
62
|
@a-border-alt-2: rgba(127, 137, 0, 1);
|
|
63
63
|
@a-border-alt-3: rgba(0, 91, 130, 1);
|
|
64
|
+
@a-data-surface-1: rgba(51, 134, 224, 1);
|
|
65
|
+
@a-data-surface-1-subtle: rgba(204, 225, 255, 1);
|
|
66
|
+
@a-data-surface-2: rgba(0, 91, 130, 1);
|
|
67
|
+
@a-data-surface-2-subtle: rgba(153, 196, 221, 1);
|
|
68
|
+
@a-data-surface-3: rgba(199, 115, 0, 1);
|
|
69
|
+
@a-data-surface-3-subtle: rgba(255, 193, 102, 1);
|
|
70
|
+
@a-data-surface-4: rgba(54, 141, 168, 1);
|
|
71
|
+
@a-data-surface-4-subtle: rgba(102, 203, 236, 1);
|
|
72
|
+
@a-data-surface-5: rgba(51, 170, 95, 1);
|
|
73
|
+
@a-data-surface-5-subtle: rgba(153, 222, 173, 1);
|
|
74
|
+
@a-data-surface-6: rgba(130, 105, 162, 1);
|
|
75
|
+
@a-data-surface-6-subtle: rgba(192, 178, 210, 1);
|
|
76
|
+
@a-data-border-1: rgba(51, 134, 224, 1);
|
|
77
|
+
@a-data-border-2: rgba(0, 91, 130, 1);
|
|
78
|
+
@a-data-border-3: rgba(199, 115, 0, 1);
|
|
79
|
+
@a-data-border-4: rgba(54, 141, 168, 1);
|
|
80
|
+
@a-data-border-5: rgba(51, 170, 95, 1);
|
|
81
|
+
@a-data-border-6: rgba(130, 105, 162, 1);
|
|
64
82
|
@a-transparent: rgba(255, 255, 255, 0);
|
|
65
83
|
@a-white: rgba(255, 255, 255, 1);
|
|
66
84
|
@a-nav-red: rgba(195, 0, 0, 1);
|
|
@@ -165,7 +183,7 @@
|
|
|
165
183
|
@a-purple-800: rgba(48, 31, 70, 1);
|
|
166
184
|
@a-purple-900: rgba(31, 20, 47, 1);
|
|
167
185
|
@a-text-default: rgba(38, 38, 38, 1);
|
|
168
|
-
@a-text-subtle: rgba(0, 0, 0, 0.
|
|
186
|
+
@a-text-subtle: rgba(0, 0, 0, 0.65);
|
|
169
187
|
@a-text-visited: rgba(99, 70, 137, 1);
|
|
170
188
|
@a-text-danger: rgba(195, 0, 0, 1);
|
|
171
189
|
@a-text-action-selected: rgba(0, 91, 130, 1);
|
|
@@ -237,7 +255,7 @@
|
|
|
237
255
|
@a-surface-alt-3-strong: rgba(0, 52, 83, 1);
|
|
238
256
|
@a-surface-alt-3: rgba(0, 91, 130, 1);
|
|
239
257
|
@a-icon-default: rgba(38, 38, 38, 1);
|
|
240
|
-
@a-icon-subtle: rgba(
|
|
258
|
+
@a-icon-subtle: rgba(0, 0, 0, 0.65);
|
|
241
259
|
@a-icon-action-selected: rgba(0, 91, 130, 1);
|
|
242
260
|
@a-icon-action-on-action-subtle: rgba(0, 86, 180, 1);
|
|
243
261
|
@a-icon-action: rgba(0, 103, 197, 1);
|
package/dist/tokens.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Thu, 08 Jun 2023 12:52:00 GMT
|
|
4
4
|
|
|
5
5
|
$a-breakpoint-xs: 0;
|
|
6
6
|
$a-breakpoint-sm: 480px;
|
|
@@ -61,6 +61,24 @@ $a-border-on-inverted-subtle: rgba(89, 89, 89, 1);
|
|
|
61
61
|
$a-border-alt-1: rgba(130, 105, 162, 1);
|
|
62
62
|
$a-border-alt-2: rgba(127, 137, 0, 1);
|
|
63
63
|
$a-border-alt-3: rgba(0, 91, 130, 1);
|
|
64
|
+
$a-data-surface-1: rgba(51, 134, 224, 1);
|
|
65
|
+
$a-data-surface-1-subtle: rgba(204, 225, 255, 1);
|
|
66
|
+
$a-data-surface-2: rgba(0, 91, 130, 1);
|
|
67
|
+
$a-data-surface-2-subtle: rgba(153, 196, 221, 1);
|
|
68
|
+
$a-data-surface-3: rgba(199, 115, 0, 1);
|
|
69
|
+
$a-data-surface-3-subtle: rgba(255, 193, 102, 1);
|
|
70
|
+
$a-data-surface-4: rgba(54, 141, 168, 1);
|
|
71
|
+
$a-data-surface-4-subtle: rgba(102, 203, 236, 1);
|
|
72
|
+
$a-data-surface-5: rgba(51, 170, 95, 1);
|
|
73
|
+
$a-data-surface-5-subtle: rgba(153, 222, 173, 1);
|
|
74
|
+
$a-data-surface-6: rgba(130, 105, 162, 1);
|
|
75
|
+
$a-data-surface-6-subtle: rgba(192, 178, 210, 1);
|
|
76
|
+
$a-data-border-1: rgba(51, 134, 224, 1);
|
|
77
|
+
$a-data-border-2: rgba(0, 91, 130, 1);
|
|
78
|
+
$a-data-border-3: rgba(199, 115, 0, 1);
|
|
79
|
+
$a-data-border-4: rgba(54, 141, 168, 1);
|
|
80
|
+
$a-data-border-5: rgba(51, 170, 95, 1);
|
|
81
|
+
$a-data-border-6: rgba(130, 105, 162, 1);
|
|
64
82
|
$a-transparent: rgba(255, 255, 255, 0);
|
|
65
83
|
$a-white: rgba(255, 255, 255, 1);
|
|
66
84
|
$a-nav-red: rgba(195, 0, 0, 1);
|
|
@@ -165,7 +183,7 @@ $a-purple-700: rgba(65, 43, 93, 1);
|
|
|
165
183
|
$a-purple-800: rgba(48, 31, 70, 1);
|
|
166
184
|
$a-purple-900: rgba(31, 20, 47, 1);
|
|
167
185
|
$a-text-default: rgba(38, 38, 38, 1);
|
|
168
|
-
$a-text-subtle: rgba(0, 0, 0, 0.
|
|
186
|
+
$a-text-subtle: rgba(0, 0, 0, 0.65);
|
|
169
187
|
$a-text-visited: rgba(99, 70, 137, 1);
|
|
170
188
|
$a-text-danger: rgba(195, 0, 0, 1);
|
|
171
189
|
$a-text-action-selected: rgba(0, 91, 130, 1);
|
|
@@ -237,7 +255,7 @@ $a-surface-alt-3-moderate: rgba(153, 196, 221, 1);
|
|
|
237
255
|
$a-surface-alt-3-strong: rgba(0, 52, 83, 1);
|
|
238
256
|
$a-surface-alt-3: rgba(0, 91, 130, 1);
|
|
239
257
|
$a-icon-default: rgba(38, 38, 38, 1);
|
|
240
|
-
$a-icon-subtle: rgba(
|
|
258
|
+
$a-icon-subtle: rgba(0, 0, 0, 0.65);
|
|
241
259
|
$a-icon-action-selected: rgba(0, 91, 130, 1);
|
|
242
260
|
$a-icon-action-on-action-subtle: rgba(0, 86, 180, 1);
|
|
243
261
|
$a-icon-action: rgba(0, 103, 197, 1);
|
package/docs.json
CHANGED
|
@@ -221,7 +221,7 @@
|
|
|
221
221
|
],
|
|
222
222
|
"semantic-text": [
|
|
223
223
|
{ "name": "--a-text-default", "value": "rgba(38, 38, 38, 1)" },
|
|
224
|
-
{ "name": "--a-text-subtle", "value": "rgba(0, 0, 0, 0.
|
|
224
|
+
{ "name": "--a-text-subtle", "value": "rgba(0, 0, 0, 0.65)" },
|
|
225
225
|
{ "name": "--a-text-visited", "value": "rgba(99, 70, 137, 1)" },
|
|
226
226
|
{ "name": "--a-text-danger", "value": "rgba(195, 0, 0, 1)" },
|
|
227
227
|
{ "name": "--a-text-action", "value": "rgba(0, 103, 197, 1)" },
|
|
@@ -339,7 +339,7 @@
|
|
|
339
339
|
],
|
|
340
340
|
"semantic-icon": [
|
|
341
341
|
{ "name": "--a-icon-default", "value": "rgba(38, 38, 38, 1)" },
|
|
342
|
-
{ "name": "--a-icon-subtle", "value": "rgba(
|
|
342
|
+
{ "name": "--a-icon-subtle", "value": "rgba(0, 0, 0, 0.65)" },
|
|
343
343
|
{ "name": "--a-icon-on-neutral", "value": "rgba(255, 255, 255, 1)" },
|
|
344
344
|
{ "name": "--a-icon-on-inverted", "value": "rgba(255, 255, 255, 1)" },
|
|
345
345
|
{ "name": "--a-icon-action", "value": "rgba(0, 103, 197, 1)" },
|
|
@@ -361,6 +361,82 @@
|
|
|
361
361
|
{ "name": "--a-icon-alt-2", "value": "rgba(127, 137, 0, 1)" },
|
|
362
362
|
{ "name": "--a-icon-alt-3", "value": "rgba(51, 128, 165, 1)" }
|
|
363
363
|
],
|
|
364
|
+
"semantic-data-surface": [
|
|
365
|
+
{
|
|
366
|
+
"name": "--a-data-surface-1",
|
|
367
|
+
"value": "rgba(51, 134, 224, 1)"
|
|
368
|
+
},
|
|
369
|
+
{
|
|
370
|
+
"name": "--a-data-surface-1-subtle",
|
|
371
|
+
"value": "rgba(204, 225, 255, 1)"
|
|
372
|
+
},
|
|
373
|
+
{
|
|
374
|
+
"name": "--a-data-surface-2",
|
|
375
|
+
"value": "rgba(0, 91, 130, 1)"
|
|
376
|
+
},
|
|
377
|
+
{
|
|
378
|
+
"name": "--a-data-surface-2-subtle",
|
|
379
|
+
"value": "rgba(153, 196, 221, 1)"
|
|
380
|
+
},
|
|
381
|
+
{
|
|
382
|
+
"name": "--a-data-surface-3",
|
|
383
|
+
"value": "rgba(199, 115, 0, 1)"
|
|
384
|
+
},
|
|
385
|
+
{
|
|
386
|
+
"name": "--a-data-surface-3-subtle",
|
|
387
|
+
"value": "rgba(255, 193, 102, 1)"
|
|
388
|
+
},
|
|
389
|
+
{
|
|
390
|
+
"name": "--a-data-surface-4",
|
|
391
|
+
"value": "rgba(54, 141, 168, 1)"
|
|
392
|
+
},
|
|
393
|
+
{
|
|
394
|
+
"name": "--a-data-surface-4-subtle",
|
|
395
|
+
"value": "rgba(102, 203, 236, 1)"
|
|
396
|
+
},
|
|
397
|
+
{
|
|
398
|
+
"name": "--a-data-surface-5",
|
|
399
|
+
"value": "rgba(51, 170, 95, 1)"
|
|
400
|
+
},
|
|
401
|
+
{
|
|
402
|
+
"name": "--a-data-surface-5-subtle",
|
|
403
|
+
"value": "rgba(153, 222, 173, 1)"
|
|
404
|
+
},
|
|
405
|
+
{
|
|
406
|
+
"name": "--a-data-surface-6",
|
|
407
|
+
"value": "rgba(130, 105, 162, 1)"
|
|
408
|
+
},
|
|
409
|
+
{
|
|
410
|
+
"name": "--a-data-surface-6-subtle",
|
|
411
|
+
"value": "rgba(192, 178, 210, 1)"
|
|
412
|
+
}
|
|
413
|
+
],
|
|
414
|
+
"semantic-data-border": [
|
|
415
|
+
{
|
|
416
|
+
"name": "--a-data-border-1",
|
|
417
|
+
"value": "rgba(51, 134, 224, 1)"
|
|
418
|
+
},
|
|
419
|
+
{
|
|
420
|
+
"name": "--a-data-border-2",
|
|
421
|
+
"value": "rgba(0, 91, 130, 1)"
|
|
422
|
+
},
|
|
423
|
+
{
|
|
424
|
+
"name": "--a-data-border-3",
|
|
425
|
+
"value": "rgba(199, 115, 0, 1)"
|
|
426
|
+
},
|
|
427
|
+
{
|
|
428
|
+
"name": "--a-data-border-4",
|
|
429
|
+
"value": "rgba(54, 141, 168, 1)"
|
|
430
|
+
},
|
|
431
|
+
{
|
|
432
|
+
"name": "--a-data-border-5",
|
|
433
|
+
"value": "rgba(51, 170, 95, 1)"
|
|
434
|
+
},
|
|
435
|
+
{
|
|
436
|
+
"name": "--a-data-border-6",
|
|
437
|
+
"value": "rgba(130, 105, 162, 1)"
|
|
438
|
+
}
|
|
439
|
+
],
|
|
364
440
|
"radius": [
|
|
365
441
|
{ "name": "--a-border-radius-small", "value": "2px" },
|
|
366
442
|
{ "name": "--a-border-radius-medium", "value": "4px" },
|
package/package.json
CHANGED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
{
|
|
2
|
+
"a": {
|
|
3
|
+
"data": {
|
|
4
|
+
"surface": {
|
|
5
|
+
"1": {
|
|
6
|
+
"@": { "value": "{a.blue.400.value}" },
|
|
7
|
+
"subtle": { "value": "{a.blue.100.value}" }
|
|
8
|
+
},
|
|
9
|
+
"2": {
|
|
10
|
+
"@": { "value": "{a.deepblue.500.value}" },
|
|
11
|
+
"subtle": { "value": "{a.deepblue.200.value}" }
|
|
12
|
+
},
|
|
13
|
+
"3": {
|
|
14
|
+
"@": { "value": "{a.orange.600.value}" },
|
|
15
|
+
"subtle": { "value": "{a.orange.300.value}" }
|
|
16
|
+
},
|
|
17
|
+
"4": {
|
|
18
|
+
"@": { "value": "{a.lightblue.700.value}" },
|
|
19
|
+
"subtle": { "value": "{a.lightblue.500.value}" }
|
|
20
|
+
},
|
|
21
|
+
"5": {
|
|
22
|
+
"@": { "value": "{a.green.400.value}" },
|
|
23
|
+
"subtle": { "value": "{a.green.200.value}" }
|
|
24
|
+
},
|
|
25
|
+
"6": {
|
|
26
|
+
"@": { "value": "{a.purple.400.value}" },
|
|
27
|
+
"subtle": { "value": "{a.purple.200.value}" }
|
|
28
|
+
}
|
|
29
|
+
},
|
|
30
|
+
"border": {
|
|
31
|
+
"1": {
|
|
32
|
+
"value": "{a.blue.400.value}"
|
|
33
|
+
},
|
|
34
|
+
"2": {
|
|
35
|
+
"value": "{a.deepblue.500.value}"
|
|
36
|
+
},
|
|
37
|
+
"3": {
|
|
38
|
+
"value": "{a.orange.600.value}"
|
|
39
|
+
},
|
|
40
|
+
"4": {
|
|
41
|
+
"value": "{a.lightblue.700.value}"
|
|
42
|
+
},
|
|
43
|
+
"5": {
|
|
44
|
+
"value": "{a.green.400.value}"
|
|
45
|
+
},
|
|
46
|
+
"6": {
|
|
47
|
+
"value": "{a.purple.400.value}"
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
}
|
package/src/semantic-colors.json
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
"value": "{a.gray.900.value}"
|
|
6
6
|
},
|
|
7
7
|
"subtle": {
|
|
8
|
-
"value": "{a.grayalpha.
|
|
8
|
+
"value": "{a.grayalpha.700.value}"
|
|
9
9
|
},
|
|
10
10
|
"visited": {
|
|
11
11
|
"value": "{a.purple.500.value}"
|
|
@@ -284,7 +284,7 @@
|
|
|
284
284
|
"value": "{a.gray.900.value}"
|
|
285
285
|
},
|
|
286
286
|
"subtle": {
|
|
287
|
-
"value": "{a.
|
|
287
|
+
"value": "{a.grayalpha.700.value}"
|
|
288
288
|
},
|
|
289
289
|
"action": {
|
|
290
290
|
"selected": { "value": "{a.deepblue.500.value}" },
|