nve-designsystem 4.2.0 → 4.4.2

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.
Files changed (86) hide show
  1. package/chunks/chunk.2PCBEMQZ.js +4 -4
  2. package/chunks/chunk.36O46B5H.js +2 -2
  3. package/chunks/chunk.4TUIT776.js +1 -1
  4. package/chunks/chunk.5JY5FUCG.js +325 -344
  5. package/chunks/chunk.5P45LHIX.js +3 -3
  6. package/chunks/chunk.6CTB5ZDJ.js +16 -4
  7. package/chunks/chunk.B4BZKR24.js +2 -2
  8. package/chunks/chunk.D5YQDJ7X.js +3 -3
  9. package/chunks/chunk.EA437WHD.js +1 -1
  10. package/chunks/chunk.GI7VDIWX.js +1 -1
  11. package/chunks/chunk.GMYPQTFK.js +1 -1
  12. package/chunks/chunk.HVTXQL7M.js +3 -3
  13. package/chunks/chunk.IKV4VH3T.js +3 -3
  14. package/chunks/chunk.IVVHNXMC.js +2 -2
  15. package/chunks/chunk.JHOXTQXA.js +3 -3
  16. package/chunks/chunk.JXOKFADN.js +3 -3
  17. package/chunks/chunk.K7JGTRV7.js +1 -1
  18. package/chunks/chunk.KPLQLAWP.js +3 -3
  19. package/chunks/chunk.LD4M4QGE.js +1 -1
  20. package/chunks/chunk.MSKEYBDI.js +3 -3
  21. package/chunks/chunk.NYIIDP5N.js +1 -1
  22. package/chunks/chunk.RWUUFNUL.js +3 -3
  23. package/chunks/chunk.SAPQLUO4.js +4 -4
  24. package/chunks/chunk.SI4ACBFK.js +1 -1
  25. package/chunks/chunk.TP2GB2HO.js +4 -4
  26. package/chunks/chunk.UDWRA64J.js +3 -3
  27. package/chunks/chunk.URTPIBTY.js +3 -3
  28. package/chunks/chunk.VESXC477.js +1 -1
  29. package/chunks/chunk.XA43ZQPC.js +3 -3
  30. package/chunks/chunk.XQ2OKYYA.js +3 -3
  31. package/chunks/chunk.XZNBUGX7.js +1 -1
  32. package/chunks/chunk.YHLNUJ7P.js +2 -2
  33. package/chunks/chunk.ZH2AND3P.js +8 -8
  34. package/chunks/chunk.ZL53POKZ.js +2 -2
  35. package/chunks/class-map.js +3 -3
  36. package/chunks/decorate.js +11 -11
  37. package/chunks/directive-helpers.js +3 -3
  38. package/chunks/if-defined.js +1 -1
  39. package/chunks/lit.js +88 -86
  40. package/chunks/live.js +8 -8
  41. package/chunks/nve-alert.component.js +9 -9
  42. package/chunks/nve-carousel-item.component.js +1 -1
  43. package/chunks/nve-checkbox-group.component.js +7 -7
  44. package/chunks/nve-label.component.js +1 -1
  45. package/chunks/nve-warning-level.component.js +4 -4
  46. package/chunks/ref.js +4 -4
  47. package/chunks/shoelace.js +771 -771
  48. package/chunks/static-html.js +16 -13
  49. package/chunks/unsafe-html.js +1 -1
  50. package/components/nve-accordion/nve-accordion.component.js +1 -1
  51. package/components/nve-badge/nve-badge.component.js +1 -1
  52. package/components/nve-button/nve-button.component.js +1 -1
  53. package/components/nve-carousel-thumbnail/nve-carousel-thumbnail.component.js +1 -1
  54. package/components/nve-combobox/nve-combobox.component.js +1 -1
  55. package/components/nve-darkmode-switch/nve-darkmode-switch.component.js +3 -2
  56. package/components/nve-heading/nve-heading.component.d.ts +29 -0
  57. package/components/nve-heading/nve-heading.component.js +45 -0
  58. package/components/nve-heading/nve-heading.styles.d.ts +2 -0
  59. package/components/nve-heading/nve-heading.styles.js +41 -0
  60. package/components/nve-icon/nve-icon.component.js +1 -1
  61. package/components/nve-link-card/nve-link-card.component.js +6 -6
  62. package/components/nve-message-card/nve-message-card.component.js +1 -1
  63. package/components/nve-navigation-card/nve-navigation-card.component.js +8 -8
  64. package/components/nve-paragraph/nve-paragraph.component.d.ts +26 -0
  65. package/components/nve-paragraph/nve-paragraph.component.js +26 -0
  66. package/components/nve-paragraph/nve-paragraph.styles.d.ts +2 -0
  67. package/components/nve-paragraph/nve-paragraph.styles.js +105 -0
  68. package/components/nve-stepper/nve-step/nve-step.component.js +21 -21
  69. package/components/nve-stepper/nve-stepper-mobile.component.js +1 -1
  70. package/components/nve-stepper/nve-stepper.component.js +1 -1
  71. package/components/nve-switch/nve-switch.component.js +1 -1
  72. package/components/nve-tab/nve-tab.component.js +1 -1
  73. package/components/nve-tab-group/nve-tab-group.component.js +6 -6
  74. package/components/nve-tab-panel/nve-tab-panel.component.js +1 -1
  75. package/components/nve-tag/nve-tag.component.js +6 -6
  76. package/components/nve-textarea/nve-textarea.component.js +12 -12
  77. package/css/nve.css +54 -45
  78. package/css/nve_dark.css +16 -7
  79. package/css/rme.css +54 -45
  80. package/css/rme_dark.css +16 -7
  81. package/css/varsom.css +54 -45
  82. package/css/varsom_dark.css +16 -7
  83. package/custom-elements.json +170 -1
  84. package/nve-designsystem.d.ts +3 -1
  85. package/nve-designsystem.js +23 -21
  86. package/package.json +15 -7
@@ -1,4 +1,4 @@
1
- import { n as e, s as t, t as n } from "../../chunks/lit.js";
1
+ import { a as e, n as t, t as n } from "../../chunks/lit.js";
2
2
  import { a as r, o as i, s as a, t as o } from "../../chunks/decorate.js";
3
3
  import { t as s } from "../../chunks/class-map.js";
4
4
  import { t as c } from "../../chunks/if-defined.js";
@@ -157,7 +157,7 @@ var d = class extends n {
157
157
  }
158
158
  }
159
159
  render() {
160
- return t`
160
+ return e`
161
161
  <div
162
162
  part="base"
163
163
  class="tab-group"
@@ -175,7 +175,7 @@ var d = class extends n {
175
175
  >
176
176
  <slot name="nav"></slot>
177
177
  </div>
178
- ${this.canScrollBack && this.isOverflow ? t`
178
+ ${this.canScrollBack && this.isOverflow ? e`
179
179
  <div
180
180
  aria-hidden="true"
181
181
  part="button-backward-base"
@@ -185,8 +185,8 @@ var d = class extends n {
185
185
  <nve-icon name="chevron_backward"></nve-icon>
186
186
  </nve-button>
187
187
  </div>
188
- ` : e}
189
- ${this.canScrollForward && this.isOverflow ? t`
188
+ ` : t}
189
+ ${this.canScrollForward && this.isOverflow ? e`
190
190
  <div
191
191
  part="button-forward-base"
192
192
  aria-hidden="true"
@@ -196,7 +196,7 @@ var d = class extends n {
196
196
  <nve-icon name="chevron_forward"></nve-icon>
197
197
  </nve-button>
198
198
  </div>
199
- ` : e}
199
+ ` : t}
200
200
  </div>
201
201
  <slot part="body"></slot>
202
202
  </div>
@@ -1,4 +1,4 @@
1
- import { s as e, t } from "../../chunks/lit.js";
1
+ import { a as e, t } from "../../chunks/lit.js";
2
2
  import { o as n, s as r, t as i } from "../../chunks/decorate.js";
3
3
  import a from "./nve-tab-panel.styles.js";
4
4
  //#region src/components/nve-tab-panel/nve-tab-panel.component.ts
@@ -1,4 +1,4 @@
1
- import { n as e, s as t, t as n } from "../../chunks/lit.js";
1
+ import { a as e, n as t, t as n } from "../../chunks/lit.js";
2
2
  import { o as r, s as i, t as a } from "../../chunks/decorate.js";
3
3
  import { t as o } from "../../chunks/class-map.js";
4
4
  import s from "./nve-tag.styles.js";
@@ -20,7 +20,7 @@ var c = class extends n {
20
20
  this.dispatchEvent(e);
21
21
  }
22
22
  render() {
23
- return t`
23
+ return e`
24
24
  <span
25
25
  part="base"
26
26
  class=${o({
@@ -38,20 +38,20 @@ var c = class extends n {
38
38
  })}
39
39
  >
40
40
  <slot name="prefix"
41
- >${this.dot ? t`<svg width="11" height="10" viewBox="0 0 11 10" fill="none" xmlns="http://www.w3.org/2000/svg">
41
+ >${this.dot ? e`<svg width="11" height="10" viewBox="0 0 11 10" fill="none" xmlns="http://www.w3.org/2000/svg">
42
42
  <circle cx="5.5" cy="5" r="5" fill="currentcolor" />
43
- </svg> ` : e}</slot
43
+ </svg> ` : t}</slot
44
44
  >
45
45
  <slot part="text"></slot>
46
46
  <slot name="extra" part="extra">${this.extraText}</slot>
47
- ${this.closeable ? t`<button
47
+ ${this.closeable ? e`<button
48
48
  part="close"
49
49
  class="tag-close"
50
50
  aria-label="${this.closeAriaLabel}"
51
51
  @click=${this.closeButtonClick}
52
52
  >
53
53
  <nve-icon name="close"></nve-icon>
54
- </button>` : e}
54
+ </button>` : t}
55
55
  </span>
56
56
  `;
57
57
  }
@@ -1,4 +1,4 @@
1
- import { n as e, s as t, t as n } from "../../chunks/lit.js";
1
+ import { a as e, n as t, t as n } from "../../chunks/lit.js";
2
2
  import { a as r, o as i, r as a, s as o, t as s } from "../../chunks/decorate.js";
3
3
  import { t as c } from "../../chunks/class-map.js";
4
4
  import { t as l } from "../../chunks/if-defined.js";
@@ -62,20 +62,20 @@ var f = class extends n {
62
62
  }
63
63
  render() {
64
64
  let n = !!this.querySelector("[slot=\"label\"]");
65
- return t`
65
+ return e`
66
66
  <div part="form-control" class=${c({
67
67
  "form-control": !0,
68
68
  "form-control--has-label": this.label
69
69
  })}>
70
- ${n ? t`<slot name="label"></slot>` : this.label ? t`<nve-label
70
+ ${n ? e`<slot name="label"></slot>` : this.label ? e`<nve-label
71
71
  id="label"
72
72
  value=${this.label}
73
73
  size="small"
74
74
  tooltip=${l(this.tooltip)}
75
- ></nve-label>` : e}
76
- ${this.helpText ? t` <div part="help-text-container" class="textarea__help-text__container">
75
+ ></nve-label>` : t}
76
+ ${this.helpText ? e` <div part="help-text-container" class="textarea__help-text__container">
77
77
  <span class="textarea__help-text" aria-hidden=${this.helpText ? "false" : "true"}>${this.helpText}</span>
78
- </div>` : e}
78
+ </div>` : t}
79
79
 
80
80
  <div part="base" class="textarea__base">
81
81
  <textarea
@@ -105,15 +105,15 @@ var f = class extends n {
105
105
  Må gjøres sånn fordi vi vil ikke begrense textarea__base brede til fit-content (da textarea kan aldri ta så mye plass som er
106
106
  tilgjengelig i nettleseren og man må alltid sette brede på den manuelt. Nei takk.) -->
107
107
  <!-- Foreløpig kan man ha enten 'lock' eller 'error' ikone -->
108
- ${this.disabled || this.showErrorMessage ? t`<div class="textarea__icon__container">
109
- ${this.disabled ? t`<nve-icon name="lock"></nve-icon>` : null}
110
- ${this.showErrorMessage ? t`<nve-icon class="textarea__icon--error" name="error"></nve-icon>` : null}
111
- </div>` : e}
108
+ ${this.disabled || this.showErrorMessage ? e`<div class="textarea__icon__container">
109
+ ${this.disabled ? e`<nve-icon name="lock"></nve-icon>` : null}
110
+ ${this.showErrorMessage ? e`<nve-icon class="textarea__icon--error" name="error"></nve-icon>` : null}
111
+ </div>` : t}
112
112
  </div>
113
113
  <div part="hint-text-container" class="textarea__hint-text__container">
114
114
  <!-- Ikke vis hint dersom feil -->
115
- ${!this.showErrorMessage && this.hint ? t`<span class="textarea__hint" aria-hidden=${this.hint ? "false" : "true"}>${this.hint}</span>` : e}
116
- ${this.showErrorMessage ? t`<span class="textarea__help-text textarea__help-text--error">${this.errorMessage}</span>` : e}
115
+ ${!this.showErrorMessage && this.hint ? e`<span class="textarea__hint" aria-hidden=${this.hint ? "false" : "true"}>${this.hint}</span>` : t}
116
+ ${this.showErrorMessage ? e`<span class="textarea__help-text textarea__help-text--error">${this.errorMessage}</span>` : t}
117
117
  </div>
118
118
  </div>
119
119
  `;
package/css/nve.css CHANGED
@@ -112,6 +112,15 @@
112
112
  --color-shades-functional-red-999: #411616;
113
113
  --color-shades-functional-red-000: #ffebee;
114
114
  --color-shades-functional-red-050: #ffd8de;
115
+ --color-shades-functional-danger-100: #ffb8b8;
116
+ --color-shades-functional-danger-200: #ff8f8f;
117
+ --color-shades-functional-danger-400: #ff3333;
118
+ --color-shades-functional-danger-600: #e50000;
119
+ --color-shades-functional-danger-800: #b20000;
120
+ --color-shades-functional-danger-900: #800000;
121
+ --color-shades-functional-danger-999: #4d0000;
122
+ --color-shades-functional-danger-050: #ffd6d6;
123
+ --color-shades-functional-danger-000: #ffebeb;
115
124
  --color-shades-functional-orange-100: #ffe3c2;
116
125
  --color-shades-functional-orange-150: #ffd9ad;
117
126
  --color-shades-functional-orange-200: #ffc98a;
@@ -253,7 +262,7 @@
253
262
  --box-shadow-none: 0 0 0 0 rgba(0,0,0,0);
254
263
  --box-shadow-soft: -59px 104px 33px 0 rgba(0,0,0,0.00), -38px 67px 31px 0 rgba(0,0,0,0.00), -21px 37px 26px 0 rgba(0,0,0,0.01), -9px 17px 19px 0 rgba(0,0,0,0.02), -2px 4px 11px 0 rgba(0,0,0,0.03);
255
264
  --box-shadow-hard: -45px 80px 26px 0 rgba(0,0,0,0.00), -29px 51px 23px 0 rgba(0,0,0,0.01), -16px 29px 20px 0 rgba(0,0,0,0.02), -7px 13px 15px 0 rgba(0,0,0,0.03), -2px 3px 8px 0 rgba(0,0,0,0.04);
256
- --box-shadow-header: 0 4px 032px 0 rgba(0,0,0,0.02);
265
+ --box-shadow-header: 0 4px 32px 0 rgba(0,0,0,0.02);
257
266
  --box-shadow-dropdown: 0 54px 15px 0 rgba(0,0,0,0.00), 0 35px 14px 0 rgba(0,0,0,0.00), 0 19px 12px 0 rgba(0,0,0,0.02), 0 9px 9px 0 rgba(0,0,0,0.03), 0 2px 5px 0 rgba(0,0,0,0.03);
258
267
  --boolean-brand-nve: true;
259
268
  --boolean-brand-varsom: false;
@@ -389,18 +398,18 @@
389
398
  --color-dangerlevel-background-default-level1: var(--color-shades-functional-green-500);
390
399
  --color-dangerlevel-background-default-level2: var(--color-shades-functional-yellow-500);
391
400
  --color-dangerlevel-background-default-level3: var(--color-shades-functional-orange-400);
392
- --color-dangerlevel-background-default-level4: var(--color-shades-functional-red-500);
393
- --color-dangerlevel-background-default-level5: var(--color-shades-functional-neutralgrey-950);
401
+ --color-dangerlevel-background-default-level4: var(--color-shades-functional-danger-400);
402
+ --color-dangerlevel-background-default-level5: var(--color-shades-functional-danger-900);
394
403
  --color-dangerlevel-background-mute-level1: var(--color-shades-functional-green-150);
395
404
  --color-dangerlevel-background-mute-level2: var(--color-shades-functional-yellow-200);
396
405
  --color-dangerlevel-background-mute-level3: var(--color-shades-functional-orange-150);
397
- --color-dangerlevel-background-mute-level4: var(--color-shades-functional-red-050);
398
- --color-dangerlevel-background-mute-level5: var(--color-shades-functional-neutralgrey-200);
406
+ --color-dangerlevel-background-mute-level4: var(--color-shades-functional-danger-050);
407
+ --color-dangerlevel-background-mute-level5: var(--color-shades-functional-danger-200);
399
408
  --color-dangerlevel-background-subtle-level1: var(--color-shades-functional-green-100);
400
409
  --color-dangerlevel-background-subtle-level2: var(--color-shades-functional-yellow-100);
401
410
  --color-dangerlevel-background-subtle-level3: var(--color-shades-functional-orange-050);
402
- --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-red-000);
403
- --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-neutralgrey-150);
411
+ --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-danger-000);
412
+ --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-danger-200);
404
413
  --color-dangerlevel-foreground-default-level1: var(--color-shades-functional-neutralgrey-999);
405
414
  --color-dangerlevel-foreground-default-level2: var(--color-shades-functional-neutralgrey-999);
406
415
  --color-dangerlevel-foreground-default-level3: var(--color-shades-functional-neutralgrey-999);
@@ -660,48 +669,48 @@
660
669
  --sizing-fixed-sizing-2x-large: var(--dimension-14x);
661
670
  --sizing-fixed-sizing-3x-large: var(--dimension-16x);
662
671
  --typography-heading-x-large: var(--font-weight-semibold) var(--font-size-3x-large)/var(--line-height-0) var(--font-family-primary-family);
663
- --typography-heading-large: var(--font-weight-semibold) var(--font-size-2x-large)/var(--line-height-1) var(--font-family-primary-family);
672
+ --typography-heading-large: var(--font-weight-semibold) var(--font-size-2x-large)/1.2 var(--font-family-primary-family);
664
673
  --typography-heading-medium: var(--font-weight-semibold) var(--font-size-x-large)/var(--line-height-2) var(--font-family-primary-family);
665
- --typography-heading-small: var(--font-weight-semibold) var(--font-size-large)/var(--line-height-3) var(--font-family-primary-family);
666
- --typography-heading-x-small: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-3) var(--font-family-primary-family);
667
- --typography-subheading-large: var(--font-weight-regular) var(--font-size-2x-large)/var(--line-height-1) var(--font-family-primary-family);
674
+ --typography-heading-small: var(--font-weight-semibold) var(--font-size-large)/1.3 var(--font-family-primary-family);
675
+ --typography-heading-x-small: var(--font-weight-semibold) var(--font-size-medium)/1.3 var(--font-family-primary-family);
676
+ --typography-subheading-large: var(--font-weight-regular) var(--font-size-2x-large)/1.2 var(--font-family-primary-family);
668
677
  --typography-subheading-medium: var(--font-weight-regular) var(--font-size-x-large)/var(--line-height-2) var(--font-family-primary-family);
669
- --typography-subheading-small: var(--font-weight-regular) var(--font-size-large)/var(--line-height-3) var(--font-family-primary-family);
670
- --typography-lead-large-regular: var(--font-weight-regular) var(--font-size-large)/var(--line-height-4) var(--font-family-primary-family);
671
- --typography-lead-large-semibold: var(--font-weight-semibold) var(--font-size-large)/var(--line-height-4) var(--font-family-primary-family);
672
- --typography-lead-medium-regular: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
673
- --typography-lead-medium-semibold: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
678
+ --typography-subheading-small: var(--font-weight-regular) var(--font-size-large)/1.3 var(--font-family-primary-family);
679
+ --typography-lead-large-regular: var(--font-weight-regular) var(--font-size-large)/1.4 var(--font-family-primary-family);
680
+ --typography-lead-large-semibold: var(--font-weight-semibold) var(--font-size-large)/1.4 var(--font-family-primary-family);
681
+ --typography-lead-medium-regular: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
682
+ --typography-lead-medium-semibold: var(--font-weight-semibold) var(--font-size-medium)/1.5 var(--font-family-primary-family);
674
683
  --font-size-small: var(--dimension-4-5x); /** 16 px */
675
- --typography-lead-small-regular: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
676
- --typography-lead-small-semibold: var(--font-weight-semibold) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
677
- --typography-body-large: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
678
- --typography-body-large-underline: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
679
- --typography-body-medium: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
680
- --typography-body-medium-underline: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
681
- --typography-body-small: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
682
- --typography-body-small-underline: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
683
- --typography-body-x-small: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
684
- --typography-body-x-small-underline: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
685
- --typography-body-compact-large-compact: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-1) var(--font-family-primary-family);
686
- --typography-body-compact-large-underline-compact: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-1) var(--font-family-primary-family);
687
- --typography-body-compact-medium-compact: var(--font-weight-regular) var(--font-size-small)/var(--line-height-1) var(--font-family-primary-family);
688
- --typography-body-compact-medium-underline-compact: var(--font-weight-regular) var(--font-size-small)/var(--line-height-1) var(--font-family-primary-family);
689
- --typography-body-compact-small-compact: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-1) var(--font-family-primary-family);
690
- --typography-body-compact-small-underline-compact: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-1) var(--font-family-primary-family);
691
- --typography-body-compact-x-small-compact: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-1) var(--font-family-primary-family);
692
- --typography-body-compact-x-small-underline-compact: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-1) var(--font-family-primary-family);
693
- --typography-detailtext-caption: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
694
- --typography-detailtext-caps-large: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
695
- --typography-detailtext-caps-small: var(--font-weight-semibold) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
696
- --typography-label-large: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-6) var(--font-family-primary-family);
697
- --typography-label-large-light: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-6) var(--font-family-primary-family);
698
- --typography-label-medium: var(--font-weight-semibold) var(--font-size-small)/var(--line-height-6) var(--font-family-primary-family);
699
- --typography-label-medium-light: var(--font-weight-regular) var(--font-size-small)/var(--line-height-6) var(--font-family-primary-family);
700
- --typography-label-small: var(--font-weight-semibold) var(--font-size-x-small)/var(--line-height-6) var(--font-family-primary-family);
701
- --typography-label-small-light: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-6) var(--font-family-primary-family);
684
+ --typography-lead-small-regular: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
685
+ --typography-lead-small-semibold: var(--font-weight-semibold) var(--font-size-small)/1.5 var(--font-family-primary-family);
686
+ --typography-body-large: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
687
+ --typography-body-large-underline: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
688
+ --typography-body-medium: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
689
+ --typography-body-medium-underline: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
690
+ --typography-body-small: var(--font-weight-regular) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
691
+ --typography-body-small-underline: var(--font-weight-regular) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
692
+ --typography-body-x-small: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
693
+ --typography-body-x-small-underline: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
694
+ --typography-body-compact-large-compact: var(--font-weight-regular) var(--font-size-medium)/1.2 var(--font-family-primary-family);
695
+ --typography-body-compact-large-underline-compact: var(--font-weight-regular) var(--font-size-medium)/1.2 var(--font-family-primary-family);
696
+ --typography-body-compact-medium-compact: var(--font-weight-regular) var(--font-size-small)/1.2 var(--font-family-primary-family);
697
+ --typography-body-compact-medium-underline-compact: var(--font-weight-regular) var(--font-size-small)/1.2 var(--font-family-primary-family);
698
+ --typography-body-compact-small-compact: var(--font-weight-regular) var(--font-size-x-small)/1.2 var(--font-family-primary-family);
699
+ --typography-body-compact-small-underline-compact: var(--font-weight-regular) var(--font-size-x-small)/1.2 var(--font-family-primary-family);
700
+ --typography-body-compact-x-small-compact: var(--font-weight-regular) var(--font-size-2x-small)/1.2 var(--font-family-primary-family);
701
+ --typography-body-compact-x-small-underline-compact: var(--font-weight-regular) var(--font-size-2x-small)/1.2 var(--font-family-primary-family);
702
+ --typography-detailtext-caption: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
703
+ --typography-detailtext-caps-large: var(--font-weight-semibold) var(--font-size-medium)/1.5 var(--font-family-primary-family);
704
+ --typography-detailtext-caps-small: var(--font-weight-semibold) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
705
+ --typography-label-large: var(--font-weight-semibold) var(--font-size-medium)/1.1 var(--font-family-primary-family);
706
+ --typography-label-large-light: var(--font-weight-regular) var(--font-size-medium)/1.1 var(--font-family-primary-family);
707
+ --typography-label-medium: var(--font-weight-semibold) var(--font-size-small)/1.1 var(--font-family-primary-family);
708
+ --typography-label-medium-light: var(--font-weight-regular) var(--font-size-small)/1.1 var(--font-family-primary-family);
709
+ --typography-label-small: var(--font-weight-semibold) var(--font-size-x-small)/1.1 var(--font-family-primary-family);
710
+ --typography-label-small-light: var(--font-weight-regular) var(--font-size-x-small)/1.1 var(--font-family-primary-family);
702
711
  --font-size-2x-small: var(--dimension-3-5x); /** 12 px */
703
- --typography-label-x-small: var(--font-weight-semibold) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-primary-family);
704
- --typography-label-x-small-light: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-primary-family);
712
+ --typography-label-x-small: var(--font-weight-semibold) var(--font-size-2x-small)/1.1 var(--font-family-primary-family);
713
+ --typography-label-x-small-light: var(--font-weight-regular) var(--font-size-2x-small)/1.1 var(--font-family-primary-family);
705
714
  --font-size-x-small: var(--dimension-4x); /** 14 px */
706
715
  --font-size-medium: var(--dimension-5x); /** 18 px */
707
716
  --font-size-large: var(--dimension-6x); /** 20 px */
package/css/nve_dark.css CHANGED
@@ -112,6 +112,15 @@
112
112
  --color-shades-functional-red-999: #411616;
113
113
  --color-shades-functional-red-000: #ffebee;
114
114
  --color-shades-functional-red-050: #ffd8de;
115
+ --color-shades-functional-danger-100: #ffb8b8;
116
+ --color-shades-functional-danger-200: #ff8f8f;
117
+ --color-shades-functional-danger-400: #ff3333;
118
+ --color-shades-functional-danger-600: #e50000;
119
+ --color-shades-functional-danger-800: #b20000;
120
+ --color-shades-functional-danger-900: #800000;
121
+ --color-shades-functional-danger-999: #4d0000;
122
+ --color-shades-functional-danger-050: #ffd6d6;
123
+ --color-shades-functional-danger-000: #ffebeb;
115
124
  --color-shades-functional-orange-100: #ffe3c2;
116
125
  --color-shades-functional-orange-150: #ffd9ad;
117
126
  --color-shades-functional-orange-200: #ffc98a;
@@ -253,7 +262,7 @@
253
262
  --box-shadow-none: 0 0 0 0 rgba(0,0,0,0);
254
263
  --box-shadow-soft: -59px 104px 33px 0 rgba(0,0,0,0.00), -38px 67px 31px 0 rgba(0,0,0,0.00), -21px 37px 26px 0 rgba(0,0,0,0.01), -9px 17px 19px 0 rgba(0,0,0,0.02), -2px 4px 11px 0 rgba(0,0,0,0.03);
255
264
  --box-shadow-hard: -45px 80px 26px 0 rgba(0,0,0,0.00), -29px 51px 23px 0 rgba(0,0,0,0.01), -16px 29px 20px 0 rgba(0,0,0,0.02), -7px 13px 15px 0 rgba(0,0,0,0.03), -2px 3px 8px 0 rgba(0,0,0,0.04);
256
- --box-shadow-header: 0 4px 032px 0 rgba(0,0,0,0.02);
265
+ --box-shadow-header: 0 4px 32px 0 rgba(0,0,0,0.02);
257
266
  --box-shadow-dropdown: 0 54px 15px 0 rgba(0,0,0,0.00), 0 35px 14px 0 rgba(0,0,0,0.00), 0 19px 12px 0 rgba(0,0,0,0.02), 0 9px 9px 0 rgba(0,0,0,0.03), 0 2px 5px 0 rgba(0,0,0,0.03);
258
267
  --boolean-brand-nve: true;
259
268
  --boolean-brand-varsom: false;
@@ -389,18 +398,18 @@
389
398
  --color-dangerlevel-background-default-level1: var(--color-shades-functional-green-500);
390
399
  --color-dangerlevel-background-default-level2: var(--color-shades-functional-yellow-500);
391
400
  --color-dangerlevel-background-default-level3: var(--color-shades-functional-orange-400);
392
- --color-dangerlevel-background-default-level4: var(--color-shades-functional-red-500);
393
- --color-dangerlevel-background-default-level5: var(--color-shades-functional-neutralgrey-950);
401
+ --color-dangerlevel-background-default-level4: var(--color-shades-functional-danger-400);
402
+ --color-dangerlevel-background-default-level5: var(--color-shades-functional-danger-900);
394
403
  --color-dangerlevel-background-mute-level1: var(--color-shades-functional-green-150);
395
404
  --color-dangerlevel-background-mute-level2: var(--color-shades-functional-yellow-200);
396
405
  --color-dangerlevel-background-mute-level3: var(--color-shades-functional-orange-150);
397
- --color-dangerlevel-background-mute-level4: var(--color-shades-functional-red-050);
398
- --color-dangerlevel-background-mute-level5: var(--color-shades-functional-neutralgrey-200);
406
+ --color-dangerlevel-background-mute-level4: var(--color-shades-functional-danger-050);
407
+ --color-dangerlevel-background-mute-level5: var(--color-shades-functional-danger-200);
399
408
  --color-dangerlevel-background-subtle-level1: var(--color-shades-functional-green-100);
400
409
  --color-dangerlevel-background-subtle-level2: var(--color-shades-functional-yellow-100);
401
410
  --color-dangerlevel-background-subtle-level3: var(--color-shades-functional-orange-050);
402
- --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-red-000);
403
- --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-neutralgrey-150);
411
+ --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-danger-000);
412
+ --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-danger-200);
404
413
  --color-dangerlevel-foreground-default-level1: var(--color-shades-functional-neutralgrey-999);
405
414
  --color-dangerlevel-foreground-default-level2: var(--color-shades-functional-neutralgrey-999);
406
415
  --color-dangerlevel-foreground-default-level3: var(--color-shades-functional-neutralgrey-999);
package/css/rme.css CHANGED
@@ -112,6 +112,15 @@
112
112
  --color-shades-functional-red-999: #411616;
113
113
  --color-shades-functional-red-000: #ffebee;
114
114
  --color-shades-functional-red-050: #ffd8de;
115
+ --color-shades-functional-danger-100: #ffb8b8;
116
+ --color-shades-functional-danger-200: #ff8f8f;
117
+ --color-shades-functional-danger-400: #ff3333;
118
+ --color-shades-functional-danger-600: #e50000;
119
+ --color-shades-functional-danger-800: #b20000;
120
+ --color-shades-functional-danger-900: #800000;
121
+ --color-shades-functional-danger-999: #4d0000;
122
+ --color-shades-functional-danger-050: #ffd6d6;
123
+ --color-shades-functional-danger-000: #ffebeb;
115
124
  --color-shades-functional-orange-100: #ffe3c2;
116
125
  --color-shades-functional-orange-150: #ffd9ad;
117
126
  --color-shades-functional-orange-200: #ffc98a;
@@ -253,7 +262,7 @@
253
262
  --box-shadow-none: 0 0 0 0 rgba(0,0,0,0);
254
263
  --box-shadow-soft: -59px 104px 33px 0 rgba(0,0,0,0.00), -38px 67px 31px 0 rgba(0,0,0,0.00), -21px 37px 26px 0 rgba(0,0,0,0.01), -9px 17px 19px 0 rgba(0,0,0,0.02), -2px 4px 11px 0 rgba(0,0,0,0.03);
255
264
  --box-shadow-hard: -45px 80px 26px 0 rgba(0,0,0,0.00), -29px 51px 23px 0 rgba(0,0,0,0.01), -16px 29px 20px 0 rgba(0,0,0,0.02), -7px 13px 15px 0 rgba(0,0,0,0.03), -2px 3px 8px 0 rgba(0,0,0,0.04);
256
- --box-shadow-header: 0 4px 032px 0 rgba(0,0,0,0.02);
265
+ --box-shadow-header: 0 4px 32px 0 rgba(0,0,0,0.02);
257
266
  --box-shadow-dropdown: 0 54px 15px 0 rgba(0,0,0,0.00), 0 35px 14px 0 rgba(0,0,0,0.00), 0 19px 12px 0 rgba(0,0,0,0.02), 0 9px 9px 0 rgba(0,0,0,0.03), 0 2px 5px 0 rgba(0,0,0,0.03);
258
267
  --boolean-brand-nve: false;
259
268
  --boolean-brand-varsom: false;
@@ -389,18 +398,18 @@
389
398
  --color-dangerlevel-background-default-level1: var(--color-shades-functional-green-500);
390
399
  --color-dangerlevel-background-default-level2: var(--color-shades-functional-yellow-500);
391
400
  --color-dangerlevel-background-default-level3: var(--color-shades-functional-orange-400);
392
- --color-dangerlevel-background-default-level4: var(--color-shades-functional-red-500);
393
- --color-dangerlevel-background-default-level5: var(--color-shades-functional-neutralgrey-950);
401
+ --color-dangerlevel-background-default-level4: var(--color-shades-functional-danger-400);
402
+ --color-dangerlevel-background-default-level5: var(--color-shades-functional-danger-900);
394
403
  --color-dangerlevel-background-mute-level1: var(--color-shades-functional-green-150);
395
404
  --color-dangerlevel-background-mute-level2: var(--color-shades-functional-yellow-200);
396
405
  --color-dangerlevel-background-mute-level3: var(--color-shades-functional-orange-150);
397
- --color-dangerlevel-background-mute-level4: var(--color-shades-functional-red-050);
398
- --color-dangerlevel-background-mute-level5: var(--color-shades-functional-neutralgrey-200);
406
+ --color-dangerlevel-background-mute-level4: var(--color-shades-functional-danger-050);
407
+ --color-dangerlevel-background-mute-level5: var(--color-shades-functional-danger-200);
399
408
  --color-dangerlevel-background-subtle-level1: var(--color-shades-functional-green-100);
400
409
  --color-dangerlevel-background-subtle-level2: var(--color-shades-functional-yellow-100);
401
410
  --color-dangerlevel-background-subtle-level3: var(--color-shades-functional-orange-050);
402
- --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-red-000);
403
- --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-neutralgrey-150);
411
+ --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-danger-000);
412
+ --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-danger-200);
404
413
  --color-dangerlevel-foreground-default-level1: var(--color-shades-functional-neutralgrey-999);
405
414
  --color-dangerlevel-foreground-default-level2: var(--color-shades-functional-neutralgrey-999);
406
415
  --color-dangerlevel-foreground-default-level3: var(--color-shades-functional-neutralgrey-999);
@@ -660,48 +669,48 @@
660
669
  --sizing-fixed-sizing-2x-large: var(--dimension-14x);
661
670
  --sizing-fixed-sizing-3x-large: var(--dimension-16x);
662
671
  --typography-heading-x-large: var(--font-weight-semibold) var(--font-size-3x-large)/var(--line-height-0) var(--font-family-primary-family);
663
- --typography-heading-large: var(--font-weight-semibold) var(--font-size-2x-large)/var(--line-height-1) var(--font-family-primary-family);
672
+ --typography-heading-large: var(--font-weight-semibold) var(--font-size-2x-large)/1.2 var(--font-family-primary-family);
664
673
  --typography-heading-medium: var(--font-weight-semibold) var(--font-size-x-large)/var(--line-height-2) var(--font-family-primary-family);
665
- --typography-heading-small: var(--font-weight-semibold) var(--font-size-large)/var(--line-height-3) var(--font-family-primary-family);
666
- --typography-heading-x-small: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-3) var(--font-family-primary-family);
667
- --typography-subheading-large: var(--font-weight-regular) var(--font-size-2x-large)/var(--line-height-1) var(--font-family-primary-family);
674
+ --typography-heading-small: var(--font-weight-semibold) var(--font-size-large)/1.3 var(--font-family-primary-family);
675
+ --typography-heading-x-small: var(--font-weight-semibold) var(--font-size-medium)/1.3 var(--font-family-primary-family);
676
+ --typography-subheading-large: var(--font-weight-regular) var(--font-size-2x-large)/1.2 var(--font-family-primary-family);
668
677
  --typography-subheading-medium: var(--font-weight-regular) var(--font-size-x-large)/var(--line-height-2) var(--font-family-primary-family);
669
- --typography-subheading-small: var(--font-weight-regular) var(--font-size-large)/var(--line-height-3) var(--font-family-primary-family);
670
- --typography-lead-large-regular: var(--font-weight-regular) var(--font-size-large)/var(--line-height-4) var(--font-family-primary-family);
671
- --typography-lead-large-semibold: var(--font-weight-semibold) var(--font-size-large)/var(--line-height-4) var(--font-family-primary-family);
672
- --typography-lead-medium-regular: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
673
- --typography-lead-medium-semibold: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
678
+ --typography-subheading-small: var(--font-weight-regular) var(--font-size-large)/1.3 var(--font-family-primary-family);
679
+ --typography-lead-large-regular: var(--font-weight-regular) var(--font-size-large)/1.4 var(--font-family-primary-family);
680
+ --typography-lead-large-semibold: var(--font-weight-semibold) var(--font-size-large)/1.4 var(--font-family-primary-family);
681
+ --typography-lead-medium-regular: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
682
+ --typography-lead-medium-semibold: var(--font-weight-semibold) var(--font-size-medium)/1.5 var(--font-family-primary-family);
674
683
  --font-size-small: var(--dimension-4-5x); /** 16 px */
675
- --typography-lead-small-regular: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
676
- --typography-lead-small-semibold: var(--font-weight-semibold) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
677
- --typography-body-large: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
678
- --typography-body-large-underline: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
679
- --typography-body-medium: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
680
- --typography-body-medium-underline: var(--font-weight-regular) var(--font-size-small)/var(--line-height-5) var(--font-family-primary-family);
681
- --typography-body-small: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
682
- --typography-body-small-underline: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
683
- --typography-body-x-small: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
684
- --typography-body-x-small-underline: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
685
- --typography-body-compact-large-compact: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-1) var(--font-family-primary-family);
686
- --typography-body-compact-large-underline-compact: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-1) var(--font-family-primary-family);
687
- --typography-body-compact-medium-compact: var(--font-weight-regular) var(--font-size-small)/var(--line-height-1) var(--font-family-primary-family);
688
- --typography-body-compact-medium-underline-compact: var(--font-weight-regular) var(--font-size-small)/var(--line-height-1) var(--font-family-primary-family);
689
- --typography-body-compact-small-compact: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-1) var(--font-family-primary-family);
690
- --typography-body-compact-small-underline-compact: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-1) var(--font-family-primary-family);
691
- --typography-body-compact-x-small-compact: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-1) var(--font-family-primary-family);
692
- --typography-body-compact-x-small-underline-compact: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-1) var(--font-family-primary-family);
693
- --typography-detailtext-caption: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-5) var(--font-family-primary-family);
694
- --typography-detailtext-caps-large: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-5) var(--font-family-primary-family);
695
- --typography-detailtext-caps-small: var(--font-weight-semibold) var(--font-size-x-small)/var(--line-height-5) var(--font-family-primary-family);
696
- --typography-label-large: var(--font-weight-semibold) var(--font-size-medium)/var(--line-height-6) var(--font-family-primary-family);
697
- --typography-label-large-light: var(--font-weight-regular) var(--font-size-medium)/var(--line-height-6) var(--font-family-primary-family);
698
- --typography-label-medium: var(--font-weight-semibold) var(--font-size-small)/var(--line-height-6) var(--font-family-primary-family);
699
- --typography-label-medium-light: var(--font-weight-regular) var(--font-size-small)/var(--line-height-6) var(--font-family-primary-family);
700
- --typography-label-small: var(--font-weight-semibold) var(--font-size-x-small)/var(--line-height-6) var(--font-family-primary-family);
701
- --typography-label-small-light: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-6) var(--font-family-primary-family);
684
+ --typography-lead-small-regular: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
685
+ --typography-lead-small-semibold: var(--font-weight-semibold) var(--font-size-small)/1.5 var(--font-family-primary-family);
686
+ --typography-body-large: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
687
+ --typography-body-large-underline: var(--font-weight-regular) var(--font-size-medium)/1.5 var(--font-family-primary-family);
688
+ --typography-body-medium: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
689
+ --typography-body-medium-underline: var(--font-weight-regular) var(--font-size-small)/1.5 var(--font-family-primary-family);
690
+ --typography-body-small: var(--font-weight-regular) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
691
+ --typography-body-small-underline: var(--font-weight-regular) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
692
+ --typography-body-x-small: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
693
+ --typography-body-x-small-underline: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
694
+ --typography-body-compact-large-compact: var(--font-weight-regular) var(--font-size-medium)/1.2 var(--font-family-primary-family);
695
+ --typography-body-compact-large-underline-compact: var(--font-weight-regular) var(--font-size-medium)/1.2 var(--font-family-primary-family);
696
+ --typography-body-compact-medium-compact: var(--font-weight-regular) var(--font-size-small)/1.2 var(--font-family-primary-family);
697
+ --typography-body-compact-medium-underline-compact: var(--font-weight-regular) var(--font-size-small)/1.2 var(--font-family-primary-family);
698
+ --typography-body-compact-small-compact: var(--font-weight-regular) var(--font-size-x-small)/1.2 var(--font-family-primary-family);
699
+ --typography-body-compact-small-underline-compact: var(--font-weight-regular) var(--font-size-x-small)/1.2 var(--font-family-primary-family);
700
+ --typography-body-compact-x-small-compact: var(--font-weight-regular) var(--font-size-2x-small)/1.2 var(--font-family-primary-family);
701
+ --typography-body-compact-x-small-underline-compact: var(--font-weight-regular) var(--font-size-2x-small)/1.2 var(--font-family-primary-family);
702
+ --typography-detailtext-caption: var(--font-weight-regular) var(--font-size-2x-small)/1.5 var(--font-family-primary-family);
703
+ --typography-detailtext-caps-large: var(--font-weight-semibold) var(--font-size-medium)/1.5 var(--font-family-primary-family);
704
+ --typography-detailtext-caps-small: var(--font-weight-semibold) var(--font-size-x-small)/1.5 var(--font-family-primary-family);
705
+ --typography-label-large: var(--font-weight-semibold) var(--font-size-medium)/1.1 var(--font-family-primary-family);
706
+ --typography-label-large-light: var(--font-weight-regular) var(--font-size-medium)/1.1 var(--font-family-primary-family);
707
+ --typography-label-medium: var(--font-weight-semibold) var(--font-size-small)/1.1 var(--font-family-primary-family);
708
+ --typography-label-medium-light: var(--font-weight-regular) var(--font-size-small)/1.1 var(--font-family-primary-family);
709
+ --typography-label-small: var(--font-weight-semibold) var(--font-size-x-small)/1.1 var(--font-family-primary-family);
710
+ --typography-label-small-light: var(--font-weight-regular) var(--font-size-x-small)/1.1 var(--font-family-primary-family);
702
711
  --font-size-2x-small: var(--dimension-3-5x); /** 12 px */
703
- --typography-label-x-small: var(--font-weight-semibold) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-primary-family);
704
- --typography-label-x-small-light: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-primary-family);
712
+ --typography-label-x-small: var(--font-weight-semibold) var(--font-size-2x-small)/1.1 var(--font-family-primary-family);
713
+ --typography-label-x-small-light: var(--font-weight-regular) var(--font-size-2x-small)/1.1 var(--font-family-primary-family);
705
714
  --font-size-x-small: var(--dimension-4x); /** 14 px */
706
715
  --font-size-medium: var(--dimension-5x); /** 18 px */
707
716
  --font-size-large: var(--dimension-6x); /** 20 px */
package/css/rme_dark.css CHANGED
@@ -112,6 +112,15 @@
112
112
  --color-shades-functional-red-999: #411616;
113
113
  --color-shades-functional-red-000: #ffebee;
114
114
  --color-shades-functional-red-050: #ffd8de;
115
+ --color-shades-functional-danger-100: #ffb8b8;
116
+ --color-shades-functional-danger-200: #ff8f8f;
117
+ --color-shades-functional-danger-400: #ff3333;
118
+ --color-shades-functional-danger-600: #e50000;
119
+ --color-shades-functional-danger-800: #b20000;
120
+ --color-shades-functional-danger-900: #800000;
121
+ --color-shades-functional-danger-999: #4d0000;
122
+ --color-shades-functional-danger-050: #ffd6d6;
123
+ --color-shades-functional-danger-000: #ffebeb;
115
124
  --color-shades-functional-orange-100: #ffe3c2;
116
125
  --color-shades-functional-orange-150: #ffd9ad;
117
126
  --color-shades-functional-orange-200: #ffc98a;
@@ -253,7 +262,7 @@
253
262
  --box-shadow-none: 0 0 0 0 rgba(0,0,0,0);
254
263
  --box-shadow-soft: -59px 104px 33px 0 rgba(0,0,0,0.00), -38px 67px 31px 0 rgba(0,0,0,0.00), -21px 37px 26px 0 rgba(0,0,0,0.01), -9px 17px 19px 0 rgba(0,0,0,0.02), -2px 4px 11px 0 rgba(0,0,0,0.03);
255
264
  --box-shadow-hard: -45px 80px 26px 0 rgba(0,0,0,0.00), -29px 51px 23px 0 rgba(0,0,0,0.01), -16px 29px 20px 0 rgba(0,0,0,0.02), -7px 13px 15px 0 rgba(0,0,0,0.03), -2px 3px 8px 0 rgba(0,0,0,0.04);
256
- --box-shadow-header: 0 4px 032px 0 rgba(0,0,0,0.02);
265
+ --box-shadow-header: 0 4px 32px 0 rgba(0,0,0,0.02);
257
266
  --box-shadow-dropdown: 0 54px 15px 0 rgba(0,0,0,0.00), 0 35px 14px 0 rgba(0,0,0,0.00), 0 19px 12px 0 rgba(0,0,0,0.02), 0 9px 9px 0 rgba(0,0,0,0.03), 0 2px 5px 0 rgba(0,0,0,0.03);
258
267
  --boolean-brand-nve: false;
259
268
  --boolean-brand-varsom: false;
@@ -389,18 +398,18 @@
389
398
  --color-dangerlevel-background-default-level1: var(--color-shades-functional-green-500);
390
399
  --color-dangerlevel-background-default-level2: var(--color-shades-functional-yellow-500);
391
400
  --color-dangerlevel-background-default-level3: var(--color-shades-functional-orange-400);
392
- --color-dangerlevel-background-default-level4: var(--color-shades-functional-red-500);
393
- --color-dangerlevel-background-default-level5: var(--color-shades-functional-neutralgrey-950);
401
+ --color-dangerlevel-background-default-level4: var(--color-shades-functional-danger-400);
402
+ --color-dangerlevel-background-default-level5: var(--color-shades-functional-danger-900);
394
403
  --color-dangerlevel-background-mute-level1: var(--color-shades-functional-green-150);
395
404
  --color-dangerlevel-background-mute-level2: var(--color-shades-functional-yellow-200);
396
405
  --color-dangerlevel-background-mute-level3: var(--color-shades-functional-orange-150);
397
- --color-dangerlevel-background-mute-level4: var(--color-shades-functional-red-050);
398
- --color-dangerlevel-background-mute-level5: var(--color-shades-functional-neutralgrey-200);
406
+ --color-dangerlevel-background-mute-level4: var(--color-shades-functional-danger-050);
407
+ --color-dangerlevel-background-mute-level5: var(--color-shades-functional-danger-200);
399
408
  --color-dangerlevel-background-subtle-level1: var(--color-shades-functional-green-100);
400
409
  --color-dangerlevel-background-subtle-level2: var(--color-shades-functional-yellow-100);
401
410
  --color-dangerlevel-background-subtle-level3: var(--color-shades-functional-orange-050);
402
- --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-red-000);
403
- --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-neutralgrey-150);
411
+ --color-dangerlevel-background-subtle-level4: var(--color-shades-functional-danger-000);
412
+ --color-dangerlevel-background-subtle-level5: var(--color-shades-functional-danger-200);
404
413
  --color-dangerlevel-foreground-default-level1: var(--color-shades-functional-neutralgrey-999);
405
414
  --color-dangerlevel-foreground-default-level2: var(--color-shades-functional-neutralgrey-999);
406
415
  --color-dangerlevel-foreground-default-level3: var(--color-shades-functional-neutralgrey-999);