@navikt/ds-tokens 7.1.2 → 7.2.1

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.
@@ -104,30 +104,19 @@
104
104
  --a-accent-200: #152436;
105
105
  --a-accent-100: #101d2d;
106
106
  --a-neutral-000: black;
107
- --a-neutral-1000: #c5c9ce;
108
- --a-neutral-900: #a6acb4;
109
- --a-neutral-800: #959ca5;
110
- --a-neutral-700: #8c929d;
111
- --a-neutral-600: #787e89;
112
- --a-neutral-500: #666d77;
113
- --a-neutral-400: #33363a;
114
- --a-neutral-300: #282b2f;
115
- --a-neutral-200: #202327;
116
- --a-neutral-100: #1a1d21;
107
+ --a-neutral-1000: #c4c9d0;
108
+ --a-neutral-900: #a5acb6;
109
+ --a-neutral-800: #949ba8;
110
+ --a-neutral-700: #8a92a0;
111
+ --a-neutral-600: #767e8c;
112
+ --a-neutral-500: #656d7b;
113
+ --a-neutral-400: #2e3641;
114
+ --a-neutral-300: #242b37;
115
+ --a-neutral-200: #1c232f;
116
+ --a-neutral-100: #161d28;
117
117
  --a-bg-overlay: rgba(2, 20, 49, 0.49);
118
118
  --a-bg-sunken: #07090d;
119
119
  --a-bg-default: #0e151f;
120
- --a-contrast-data-two: var(--a-neutral-000);
121
- --a-contrast-data-one: var(--a-neutral-000);
122
- --a-contrast-brand-three: var(--a-neutral-000);
123
- --a-contrast-brand-two: var(--a-neutral-000);
124
- --a-contrast-brand-one: var(--a-neutral-000);
125
- --a-contrast-warning: var(--a-neutral-000);
126
- --a-contrast-success: var(--a-neutral-000);
127
- --a-contrast-info: var(--a-neutral-000);
128
- --a-contrast-danger: var(--a-neutral-000);
129
- --a-contrast-neutral: var(--a-neutral-000);
130
- --a-contrast-accent: var(--a-neutral-000);
131
120
  --a-border-focus: var(--a-accent-700);
132
121
  --a-border-strong: var(--a-neutral-600);
133
122
  --a-border-subtle: var(--a-neutral-400);
@@ -168,6 +157,17 @@
168
157
  --a-text-icon: var(--a-neutral-600);
169
158
  --a-text-subtle: var(--a-neutral-900);
170
159
  --a-text-default: var(--a-neutral-1000);
160
+ --a-text-data-two-contrast: var(--a-neutral-000);
161
+ --a-text-data-one-contrast: var(--a-neutral-000);
162
+ --a-text-brand-three-contrast: var(--a-neutral-000);
163
+ --a-text-brand-two-contrast: var(--a-neutral-000);
164
+ --a-text-brand-one-contrast: var(--a-neutral-000);
165
+ --a-text-warning-contrast: var(--a-neutral-000);
166
+ --a-text-success-contrast: var(--a-neutral-000);
167
+ --a-text-info-contrast: var(--a-neutral-000);
168
+ --a-text-danger-contrast: var(--a-neutral-000);
169
+ --a-text-neutral-contrast: var(--a-neutral-000);
170
+ --a-text-accent-contrast: var(--a-neutral-000);
171
171
  --a-text-data-two-icon: var(--a-data-two-600);
172
172
  --a-text-data-two-strong: var(--a-data-two-900);
173
173
  --a-text-data-two: var(--a-data-two-700);
@@ -64,15 +64,15 @@
64
64
  --a-info-200: #e3eff7;
65
65
  --a-info-100: #eef6fc;
66
66
  --a-danger-1000: #560000;
67
- --a-danger-900: #a60000;
68
- --a-danger-800: #bd0015;
69
- --a-danger-700: #cc0023;
70
- --a-danger-600: #e81c3b;
71
- --a-danger-500: #fa4256;
67
+ --a-danger-900: #a60017;
68
+ --a-danger-800: #bc002a;
69
+ --a-danger-700: #cb0035;
70
+ --a-danger-600: #e22a49;
71
+ --a-danger-500: #ec526e;
72
72
  --a-danger-400: #ffc2d7;
73
- --a-danger-300: #ffdae6;
74
- --a-danger-200: #ffe9f0;
75
- --a-danger-100: #fff3f7;
73
+ --a-danger-300: #ffd9e6;
74
+ --a-danger-200: #ffe8f0;
75
+ --a-danger-100: #fff2f7;
76
76
  --a-warning-1000: #481700;
77
77
  --a-warning-900: #8c3500;
78
78
  --a-warning-800: #a03e00;
@@ -115,17 +115,6 @@
115
115
  --a-neutral-200: #ecedef;
116
116
  --a-neutral-100: #f5f6f7;
117
117
  --a-bg-overlay: rgba(2, 20, 49, 0.49);
118
- --a-contrast-data-two: var(--a-neutral-000);
119
- --a-contrast-data-one: var(--a-neutral-000);
120
- --a-contrast-brand-three: var(--a-neutral-000);
121
- --a-contrast-brand-two: var(--a-neutral-000);
122
- --a-contrast-brand-one: var(--a-neutral-000);
123
- --a-contrast-warning: var(--a-neutral-000);
124
- --a-contrast-success: var(--a-neutral-000);
125
- --a-contrast-info: var(--a-neutral-000);
126
- --a-contrast-danger: var(--a-neutral-000);
127
- --a-contrast-neutral: var(--a-neutral-000);
128
- --a-contrast-accent: var(--a-neutral-000);
129
118
  --a-border-focus: var(--a-accent-700);
130
119
  --a-border-strong: var(--a-neutral-600);
131
120
  --a-border-subtle: var(--a-neutral-400);
@@ -166,6 +155,17 @@
166
155
  --a-text-icon: var(--a-neutral-600);
167
156
  --a-text-subtle: var(--a-neutral-900);
168
157
  --a-text-default: var(--a-neutral-1000);
158
+ --a-text-data-two-contrast: var(--a-neutral-000);
159
+ --a-text-data-one-contrast: var(--a-neutral-000);
160
+ --a-text-brand-three-contrast: var(--a-neutral-000);
161
+ --a-text-brand-two-contrast: var(--a-neutral-000);
162
+ --a-text-brand-one-contrast: var(--a-neutral-000);
163
+ --a-text-warning-contrast: var(--a-neutral-000);
164
+ --a-text-success-contrast: var(--a-neutral-000);
165
+ --a-text-info-contrast: var(--a-neutral-000);
166
+ --a-text-danger-contrast: var(--a-neutral-000);
167
+ --a-text-neutral-contrast: var(--a-neutral-000);
168
+ --a-text-accent-contrast: var(--a-neutral-000);
169
169
  --a-text-data-two-icon: var(--a-data-two-600);
170
170
  --a-text-data-two-strong: var(--a-data-two-900);
171
171
  --a-text-data-two: var(--a-data-two-700);
@@ -162,6 +162,17 @@ module.exports = {
162
162
  "TextDataTwo": "var(--a-text-data-two)",
163
163
  "TextDataTwoStrong": "var(--a-text-data-two-strong)",
164
164
  "TextDataTwoIcon": "var(--a-text-data-two-icon)",
165
+ "TextAccentContrast": "var(--a-text-accent-contrast)",
166
+ "TextNeutralContrast": "var(--a-text-neutral-contrast)",
167
+ "TextDangerContrast": "var(--a-text-danger-contrast)",
168
+ "TextInfoContrast": "var(--a-text-info-contrast)",
169
+ "TextSuccessContrast": "var(--a-text-success-contrast)",
170
+ "TextWarningContrast": "var(--a-text-warning-contrast)",
171
+ "TextBrandOneContrast": "var(--a-text-brand-one-contrast)",
172
+ "TextBrandTwoContrast": "var(--a-text-brand-two-contrast)",
173
+ "TextBrandThreeContrast": "var(--a-text-brand-three-contrast)",
174
+ "TextDataOneContrast": "var(--a-text-data-one-contrast)",
175
+ "TextDataTwoContrast": "var(--a-text-data-two-contrast)",
165
176
  "TextDefault": "var(--a-text-default)",
166
177
  "TextSubtle": "var(--a-text-subtle)",
167
178
  "TextIcon": "var(--a-text-icon)",
@@ -202,17 +213,6 @@ module.exports = {
202
213
  "BorderSubtle": "var(--a-border-subtle)",
203
214
  "BorderStrong": "var(--a-border-strong)",
204
215
  "BorderFocus": "var(--a-border-focus)",
205
- "ContrastAccent": "var(--a-contrast-accent)",
206
- "ContrastNeutral": "var(--a-contrast-neutral)",
207
- "ContrastDanger": "var(--a-contrast-danger)",
208
- "ContrastInfo": "var(--a-contrast-info)",
209
- "ContrastSuccess": "var(--a-contrast-success)",
210
- "ContrastWarning": "var(--a-contrast-warning)",
211
- "ContrastBrandOne": "var(--a-contrast-brand-one)",
212
- "ContrastBrandTwo": "var(--a-contrast-brand-two)",
213
- "ContrastBrandThree": "var(--a-contrast-brand-three)",
214
- "ContrastDataOne": "var(--a-contrast-data-one)",
215
- "ContrastDataTwo": "var(--a-contrast-data-two)",
216
216
  "Neutral100": "var(--a-neutral-100)",
217
217
  "Neutral200": "var(--a-neutral-200)",
218
218
  "Neutral300": "var(--a-neutral-300)",
@@ -60,15 +60,15 @@
60
60
  --a-info-200: #e3eff7;
61
61
  --a-info-100: #eef6fc;
62
62
  --a-danger-1000: #560000;
63
- --a-danger-900: #a60000;
64
- --a-danger-800: #bd0015;
65
- --a-danger-700: #cc0023;
66
- --a-danger-600: #e81c3b;
67
- --a-danger-500: #fa4256;
63
+ --a-danger-900: #a60017;
64
+ --a-danger-800: #bc002a;
65
+ --a-danger-700: #cb0035;
66
+ --a-danger-600: #e22a49;
67
+ --a-danger-500: #ec526e;
68
68
  --a-danger-400: #ffc2d7;
69
- --a-danger-300: #ffdae6;
70
- --a-danger-200: #ffe9f0;
71
- --a-danger-100: #fff3f7;
69
+ --a-danger-300: #ffd9e6;
70
+ --a-danger-200: #ffe8f0;
71
+ --a-danger-100: #fff2f7;
72
72
  --a-warning-1000: #481700;
73
73
  --a-warning-900: #8c3500;
74
74
  --a-warning-800: #a03e00;
@@ -111,17 +111,6 @@
111
111
  --a-neutral-200: #ecedef;
112
112
  --a-neutral-100: #f5f6f7;
113
113
  --a-bg-overlay: #0214317d;
114
- --a-contrast-data-two: var(--a-neutral-000);
115
- --a-contrast-data-one: var(--a-neutral-000);
116
- --a-contrast-brand-three: var(--a-neutral-000);
117
- --a-contrast-brand-two: var(--a-neutral-000);
118
- --a-contrast-brand-one: var(--a-neutral-000);
119
- --a-contrast-warning: var(--a-neutral-000);
120
- --a-contrast-success: var(--a-neutral-000);
121
- --a-contrast-info: var(--a-neutral-000);
122
- --a-contrast-danger: var(--a-neutral-000);
123
- --a-contrast-neutral: var(--a-neutral-000);
124
- --a-contrast-accent: var(--a-neutral-000);
125
114
  --a-border-focus: var(--a-accent-700);
126
115
  --a-border-strong: var(--a-neutral-600);
127
116
  --a-border-subtle: var(--a-neutral-400);
@@ -162,6 +151,17 @@
162
151
  --a-text-icon: var(--a-neutral-600);
163
152
  --a-text-subtle: var(--a-neutral-900);
164
153
  --a-text-default: var(--a-neutral-1000);
154
+ --a-text-data-two-contrast: var(--a-neutral-000);
155
+ --a-text-data-one-contrast: var(--a-neutral-000);
156
+ --a-text-brand-three-contrast: var(--a-neutral-000);
157
+ --a-text-brand-two-contrast: var(--a-neutral-000);
158
+ --a-text-brand-one-contrast: var(--a-neutral-000);
159
+ --a-text-warning-contrast: var(--a-neutral-000);
160
+ --a-text-success-contrast: var(--a-neutral-000);
161
+ --a-text-info-contrast: var(--a-neutral-000);
162
+ --a-text-danger-contrast: var(--a-neutral-000);
163
+ --a-text-neutral-contrast: var(--a-neutral-000);
164
+ --a-text-accent-contrast: var(--a-neutral-000);
165
165
  --a-text-data-two-icon: var(--a-data-two-600);
166
166
  --a-text-data-two-strong: var(--a-data-two-900);
167
167
  --a-text-data-two: var(--a-data-two-700);
@@ -424,30 +424,19 @@
424
424
  --a-accent-200: #152436;
425
425
  --a-accent-100: #101d2d;
426
426
  --a-neutral-000: black;
427
- --a-neutral-1000: #c5c9ce;
428
- --a-neutral-900: #a6acb4;
429
- --a-neutral-800: #959ca5;
430
- --a-neutral-700: #8c929d;
431
- --a-neutral-600: #787e89;
432
- --a-neutral-500: #666d77;
433
- --a-neutral-400: #33363a;
434
- --a-neutral-300: #282b2f;
435
- --a-neutral-200: #202327;
436
- --a-neutral-100: #1a1d21;
427
+ --a-neutral-1000: #c4c9d0;
428
+ --a-neutral-900: #a5acb6;
429
+ --a-neutral-800: #949ba8;
430
+ --a-neutral-700: #8a92a0;
431
+ --a-neutral-600: #767e8c;
432
+ --a-neutral-500: #656d7b;
433
+ --a-neutral-400: #2e3641;
434
+ --a-neutral-300: #242b37;
435
+ --a-neutral-200: #1c232f;
436
+ --a-neutral-100: #161d28;
437
437
  --a-bg-overlay: #0214317d;
438
438
  --a-bg-sunken: #07090d;
439
439
  --a-bg-default: #0e151f;
440
- --a-contrast-data-two: var(--a-neutral-000);
441
- --a-contrast-data-one: var(--a-neutral-000);
442
- --a-contrast-brand-three: var(--a-neutral-000);
443
- --a-contrast-brand-two: var(--a-neutral-000);
444
- --a-contrast-brand-one: var(--a-neutral-000);
445
- --a-contrast-warning: var(--a-neutral-000);
446
- --a-contrast-success: var(--a-neutral-000);
447
- --a-contrast-info: var(--a-neutral-000);
448
- --a-contrast-danger: var(--a-neutral-000);
449
- --a-contrast-neutral: var(--a-neutral-000);
450
- --a-contrast-accent: var(--a-neutral-000);
451
440
  --a-border-focus: var(--a-accent-700);
452
441
  --a-border-strong: var(--a-neutral-600);
453
442
  --a-border-subtle: var(--a-neutral-400);
@@ -488,6 +477,17 @@
488
477
  --a-text-icon: var(--a-neutral-600);
489
478
  --a-text-subtle: var(--a-neutral-900);
490
479
  --a-text-default: var(--a-neutral-1000);
480
+ --a-text-data-two-contrast: var(--a-neutral-000);
481
+ --a-text-data-one-contrast: var(--a-neutral-000);
482
+ --a-text-brand-three-contrast: var(--a-neutral-000);
483
+ --a-text-brand-two-contrast: var(--a-neutral-000);
484
+ --a-text-brand-one-contrast: var(--a-neutral-000);
485
+ --a-text-warning-contrast: var(--a-neutral-000);
486
+ --a-text-success-contrast: var(--a-neutral-000);
487
+ --a-text-info-contrast: var(--a-neutral-000);
488
+ --a-text-danger-contrast: var(--a-neutral-000);
489
+ --a-text-neutral-contrast: var(--a-neutral-000);
490
+ --a-text-accent-contrast: var(--a-neutral-000);
491
491
  --a-text-data-two-icon: var(--a-data-two-600);
492
492
  --a-text-data-two-strong: var(--a-data-two-900);
493
493
  --a-text-data-two: var(--a-data-two-700);
@@ -161,6 +161,17 @@ export const TextDataOneIcon = "var(--a-text-data-one-icon)";
161
161
  export const TextDataTwo = "var(--a-text-data-two)";
162
162
  export const TextDataTwoStrong = "var(--a-text-data-two-strong)";
163
163
  export const TextDataTwoIcon = "var(--a-text-data-two-icon)";
164
+ export const TextAccentContrast = "var(--a-text-accent-contrast)";
165
+ export const TextNeutralContrast = "var(--a-text-neutral-contrast)";
166
+ export const TextDangerContrast = "var(--a-text-danger-contrast)";
167
+ export const TextInfoContrast = "var(--a-text-info-contrast)";
168
+ export const TextSuccessContrast = "var(--a-text-success-contrast)";
169
+ export const TextWarningContrast = "var(--a-text-warning-contrast)";
170
+ export const TextBrandOneContrast = "var(--a-text-brand-one-contrast)";
171
+ export const TextBrandTwoContrast = "var(--a-text-brand-two-contrast)";
172
+ export const TextBrandThreeContrast = "var(--a-text-brand-three-contrast)";
173
+ export const TextDataOneContrast = "var(--a-text-data-one-contrast)";
174
+ export const TextDataTwoContrast = "var(--a-text-data-two-contrast)";
164
175
  export const TextDefault = "var(--a-text-default)";
165
176
  export const TextSubtle = "var(--a-text-subtle)";
166
177
  export const TextIcon = "var(--a-text-icon)";
@@ -201,17 +212,6 @@ export const BorderDefault = "var(--a-border-default)";
201
212
  export const BorderSubtle = "var(--a-border-subtle)";
202
213
  export const BorderStrong = "var(--a-border-strong)";
203
214
  export const BorderFocus = "var(--a-border-focus)";
204
- export const ContrastAccent = "var(--a-contrast-accent)";
205
- export const ContrastNeutral = "var(--a-contrast-neutral)";
206
- export const ContrastDanger = "var(--a-contrast-danger)";
207
- export const ContrastInfo = "var(--a-contrast-info)";
208
- export const ContrastSuccess = "var(--a-contrast-success)";
209
- export const ContrastWarning = "var(--a-contrast-warning)";
210
- export const ContrastBrandOne = "var(--a-contrast-brand-one)";
211
- export const ContrastBrandTwo = "var(--a-contrast-brand-two)";
212
- export const ContrastBrandThree = "var(--a-contrast-brand-three)";
213
- export const ContrastDataOne = "var(--a-contrast-data-one)";
214
- export const ContrastDataTwo = "var(--a-contrast-data-two)";
215
215
  export const Neutral100 = "var(--a-neutral-100)";
216
216
  export const Neutral200 = "var(--a-neutral-200)";
217
217
  export const Neutral300 = "var(--a-neutral-300)";
@@ -161,6 +161,17 @@ export const TextDataOneIcon = "var(--a-text-data-one-icon)";
161
161
  export const TextDataTwo = "var(--a-text-data-two)";
162
162
  export const TextDataTwoStrong = "var(--a-text-data-two-strong)";
163
163
  export const TextDataTwoIcon = "var(--a-text-data-two-icon)";
164
+ export const TextAccentContrast = "var(--a-text-accent-contrast)";
165
+ export const TextNeutralContrast = "var(--a-text-neutral-contrast)";
166
+ export const TextDangerContrast = "var(--a-text-danger-contrast)";
167
+ export const TextInfoContrast = "var(--a-text-info-contrast)";
168
+ export const TextSuccessContrast = "var(--a-text-success-contrast)";
169
+ export const TextWarningContrast = "var(--a-text-warning-contrast)";
170
+ export const TextBrandOneContrast = "var(--a-text-brand-one-contrast)";
171
+ export const TextBrandTwoContrast = "var(--a-text-brand-two-contrast)";
172
+ export const TextBrandThreeContrast = "var(--a-text-brand-three-contrast)";
173
+ export const TextDataOneContrast = "var(--a-text-data-one-contrast)";
174
+ export const TextDataTwoContrast = "var(--a-text-data-two-contrast)";
164
175
  export const TextDefault = "var(--a-text-default)";
165
176
  export const TextSubtle = "var(--a-text-subtle)";
166
177
  export const TextIcon = "var(--a-text-icon)";
@@ -201,17 +212,6 @@ export const BorderDefault = "var(--a-border-default)";
201
212
  export const BorderSubtle = "var(--a-border-subtle)";
202
213
  export const BorderStrong = "var(--a-border-strong)";
203
214
  export const BorderFocus = "var(--a-border-focus)";
204
- export const ContrastAccent = "var(--a-contrast-accent)";
205
- export const ContrastNeutral = "var(--a-contrast-neutral)";
206
- export const ContrastDanger = "var(--a-contrast-danger)";
207
- export const ContrastInfo = "var(--a-contrast-info)";
208
- export const ContrastSuccess = "var(--a-contrast-success)";
209
- export const ContrastWarning = "var(--a-contrast-warning)";
210
- export const ContrastBrandOne = "var(--a-contrast-brand-one)";
211
- export const ContrastBrandTwo = "var(--a-contrast-brand-two)";
212
- export const ContrastBrandThree = "var(--a-contrast-brand-three)";
213
- export const ContrastDataOne = "var(--a-contrast-data-one)";
214
- export const ContrastDataTwo = "var(--a-contrast-data-two)";
215
215
  export const Neutral100 = "var(--a-neutral-100)";
216
216
  export const Neutral200 = "var(--a-neutral-200)";
217
217
  export const Neutral300 = "var(--a-neutral-300)";
package/dist/tokens.css CHANGED
@@ -3,7 +3,7 @@
3
3
  */
4
4
 
5
5
  :root, :host {
6
- --a-version: "7.1.2";
6
+ --a-version: "7.2.1";
7
7
  --a-spacing-1-alt: 0.375rem;
8
8
  --a-spacing-05: 0.125rem;
9
9
  --a-spacing-32: 8rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@navikt/ds-tokens",
3
- "version": "7.1.2",
3
+ "version": "7.2.1",
4
4
  "description": "Design-tokens for NAV designsystem",
5
5
  "author": "Aksel | NAV designsystem team",
6
6
  "keywords": [