@navikt/ds-tokens 7.5.2 → 7.6.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/darkside/dark-tokens.css +2 -0
- package/dist/darkside/light-tokens.css +2 -0
- package/dist/darkside/tokens-cjs.js +5 -0
- package/dist/darkside/tokens.css +4 -0
- package/dist/darkside/tokens.d.ts +5 -0
- package/dist/darkside/tokens.js +5 -0
- package/dist/tokens.css +1 -1
- package/package.json +1 -1
|
@@ -158,6 +158,7 @@
|
|
|
158
158
|
--ax-neutral-300: #242b37;
|
|
159
159
|
--ax-neutral-200: #1c232f;
|
|
160
160
|
--ax-neutral-100: #161d28;
|
|
161
|
+
--ax-shadow-dialog: 0px 0px 1px 0px rgba(7 9 13 / 0.00), 0px 2px 5px 0px rgba(7 9 13 / 0.35), 0px 5px 12px 0px rgba(7 9 13 / 0.50); /* Used for dialog elements like modals and popovers. */
|
|
161
162
|
--ax-bg-overlay: rgba(2, 20, 49, 0.49);
|
|
162
163
|
--ax-bg-sunken: #07090d;
|
|
163
164
|
--ax-bg-input: rgba(14, 21, 31, 0.5);
|
|
@@ -211,6 +212,7 @@
|
|
|
211
212
|
--ax-border-neutral-subtleA: var(--ax-neutral-400A);
|
|
212
213
|
--ax-border-neutral-subtle: var(--ax-neutral-400);
|
|
213
214
|
--ax-border-neutral: var(--ax-neutral-500);
|
|
215
|
+
--ax-text-logo: var(--ax-neutral-1000);
|
|
214
216
|
--ax-text-icon: var(--ax-neutral-600);
|
|
215
217
|
--ax-text-subtle: var(--ax-neutral-900);
|
|
216
218
|
--ax-text-default: var(--ax-neutral-1000);
|
|
@@ -158,6 +158,8 @@
|
|
|
158
158
|
--ax-neutral-300: #e1e3e7;
|
|
159
159
|
--ax-neutral-200: #ecedef;
|
|
160
160
|
--ax-neutral-100: #f5f6f7;
|
|
161
|
+
--ax-shadow-dialog: 0px 0px 1px 0px rgba(7 9 13 / 0.02), 0px 2px 5px 0px rgba(7 9 13 / 0.10), 0px 5px 12px 0px rgba(7 9 13 / 0.12); /* Used for dialog elements like modals and popovers. */
|
|
162
|
+
--ax-text-logo: #c30000;
|
|
161
163
|
--ax-bg-overlay: rgba(2, 20, 49, 0.49);
|
|
162
164
|
--ax-bg-input: rgba(255, 255, 255, 0.85);
|
|
163
165
|
--ax-bg-default: #ffffff;
|
|
@@ -209,6 +209,7 @@ module.exports = {
|
|
|
209
209
|
"TextDefault": "var(--ax-text-default)",
|
|
210
210
|
"TextSubtle": "var(--ax-text-subtle)",
|
|
211
211
|
"TextIcon": "var(--ax-text-icon)",
|
|
212
|
+
"TextLogo": "var(--ax-text-logo)",
|
|
212
213
|
"BorderNeutral": "var(--ax-border-neutral)",
|
|
213
214
|
"BorderNeutralSubtle": "var(--ax-border-neutral-subtle)",
|
|
214
215
|
"BorderNeutralSubtleA": "var(--ax-border-neutral-subtleA)",
|
|
@@ -258,6 +259,10 @@ module.exports = {
|
|
|
258
259
|
"BorderSubtleA": "var(--ax-border-subtleA)",
|
|
259
260
|
"BorderStrong": "var(--ax-border-strong)",
|
|
260
261
|
"BorderFocus": "var(--ax-border-focus)",
|
|
262
|
+
/**
|
|
263
|
+
* Used for dialog elements like modals and popovers.
|
|
264
|
+
*/
|
|
265
|
+
"ShadowDialog": "var(--ax-shadow-dialog)",
|
|
261
266
|
"Neutral100": "var(--ax-neutral-100)",
|
|
262
267
|
"Neutral200": "var(--ax-neutral-200)",
|
|
263
268
|
"Neutral300": "var(--ax-neutral-300)",
|
package/dist/darkside/tokens.css
CHANGED
|
@@ -154,6 +154,8 @@
|
|
|
154
154
|
--ax-neutral-300: #e1e3e7;
|
|
155
155
|
--ax-neutral-200: #ecedef;
|
|
156
156
|
--ax-neutral-100: #f5f6f7;
|
|
157
|
+
--ax-shadow-dialog: 0px 0px 1px 0px #07090d05, 0px 2px 5px 0px #07090d1a, 0px 5px 12px 0px #07090d1f;
|
|
158
|
+
--ax-text-logo: #c30000;
|
|
157
159
|
--ax-bg-overlay: #0214317d;
|
|
158
160
|
--ax-bg-input: #ffffffd9;
|
|
159
161
|
--ax-bg-default: #fff;
|
|
@@ -567,6 +569,7 @@
|
|
|
567
569
|
--ax-neutral-300: #242b37;
|
|
568
570
|
--ax-neutral-200: #1c232f;
|
|
569
571
|
--ax-neutral-100: #161d28;
|
|
572
|
+
--ax-shadow-dialog: 0px 0px 1px 0px #07090d00, 0px 2px 5px 0px #07090d59, 0px 5px 12px 0px #07090d80;
|
|
570
573
|
--ax-bg-overlay: #0214317d;
|
|
571
574
|
--ax-bg-sunken: #07090d;
|
|
572
575
|
--ax-bg-input: #0e151f80;
|
|
@@ -620,6 +623,7 @@
|
|
|
620
623
|
--ax-border-neutral-subtleA: var(--ax-neutral-400A);
|
|
621
624
|
--ax-border-neutral-subtle: var(--ax-neutral-400);
|
|
622
625
|
--ax-border-neutral: var(--ax-neutral-500);
|
|
626
|
+
--ax-text-logo: var(--ax-neutral-1000);
|
|
623
627
|
--ax-text-icon: var(--ax-neutral-600);
|
|
624
628
|
--ax-text-subtle: var(--ax-neutral-900);
|
|
625
629
|
--ax-text-default: var(--ax-neutral-1000);
|
|
@@ -208,6 +208,7 @@ export const TextDataTwoContrast = "var(--ax-text-data-two-contrast)";
|
|
|
208
208
|
export const TextDefault = "var(--ax-text-default)";
|
|
209
209
|
export const TextSubtle = "var(--ax-text-subtle)";
|
|
210
210
|
export const TextIcon = "var(--ax-text-icon)";
|
|
211
|
+
export const TextLogo = "var(--ax-text-logo)";
|
|
211
212
|
export const BorderNeutral = "var(--ax-border-neutral)";
|
|
212
213
|
export const BorderNeutralSubtle = "var(--ax-border-neutral-subtle)";
|
|
213
214
|
export const BorderNeutralSubtleA = "var(--ax-border-neutral-subtleA)";
|
|
@@ -257,6 +258,10 @@ export const BorderSubtle = "var(--ax-border-subtle)";
|
|
|
257
258
|
export const BorderSubtleA = "var(--ax-border-subtleA)";
|
|
258
259
|
export const BorderStrong = "var(--ax-border-strong)";
|
|
259
260
|
export const BorderFocus = "var(--ax-border-focus)";
|
|
261
|
+
/**
|
|
262
|
+
* Used for dialog elements like modals and popovers.
|
|
263
|
+
*/
|
|
264
|
+
export const ShadowDialog = "var(--ax-shadow-dialog)";
|
|
260
265
|
export const Neutral100 = "var(--ax-neutral-100)";
|
|
261
266
|
export const Neutral200 = "var(--ax-neutral-200)";
|
|
262
267
|
export const Neutral300 = "var(--ax-neutral-300)";
|
package/dist/darkside/tokens.js
CHANGED
|
@@ -208,6 +208,7 @@ export const TextDataTwoContrast = "var(--ax-text-data-two-contrast)";
|
|
|
208
208
|
export const TextDefault = "var(--ax-text-default)";
|
|
209
209
|
export const TextSubtle = "var(--ax-text-subtle)";
|
|
210
210
|
export const TextIcon = "var(--ax-text-icon)";
|
|
211
|
+
export const TextLogo = "var(--ax-text-logo)";
|
|
211
212
|
export const BorderNeutral = "var(--ax-border-neutral)";
|
|
212
213
|
export const BorderNeutralSubtle = "var(--ax-border-neutral-subtle)";
|
|
213
214
|
export const BorderNeutralSubtleA = "var(--ax-border-neutral-subtleA)";
|
|
@@ -257,6 +258,10 @@ export const BorderSubtle = "var(--ax-border-subtle)";
|
|
|
257
258
|
export const BorderSubtleA = "var(--ax-border-subtleA)";
|
|
258
259
|
export const BorderStrong = "var(--ax-border-strong)";
|
|
259
260
|
export const BorderFocus = "var(--ax-border-focus)";
|
|
261
|
+
/**
|
|
262
|
+
* Used for dialog elements like modals and popovers.
|
|
263
|
+
*/
|
|
264
|
+
export const ShadowDialog = "var(--ax-shadow-dialog)";
|
|
260
265
|
export const Neutral100 = "var(--ax-neutral-100)";
|
|
261
266
|
export const Neutral200 = "var(--ax-neutral-200)";
|
|
262
267
|
export const Neutral300 = "var(--ax-neutral-300)";
|
package/dist/tokens.css
CHANGED