@rijkshuisstijl-community/design-tokens 6.0.0 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/CHANGELOG.md +83 -0
  2. package/dist/_variables.scss +31 -51
  3. package/dist/index.css +31 -51
  4. package/dist/index.d.ts +29 -49
  5. package/dist/index.js +31 -51
  6. package/dist/index.json +30 -50
  7. package/dist/index.tokens.json +46 -66
  8. package/dist/koop/_variables.scss +44 -64
  9. package/dist/koop/index.css +44 -64
  10. package/dist/koop/index.d.ts +42 -62
  11. package/dist/koop/index.js +44 -64
  12. package/dist/koop/index.json +43 -63
  13. package/dist/koop/index.tokens.json +79 -99
  14. package/dist/koop/root.css +44 -64
  15. package/dist/koop/tokens.d.ts +78 -98
  16. package/dist/koop/tokens.js +1766 -2238
  17. package/dist/root.css +31 -51
  18. package/dist/tokens.d.ts +45 -65
  19. package/dist/tokens.js +725 -1197
  20. package/dist/uitvoerend-groen/_variables.scss +44 -64
  21. package/dist/uitvoerend-groen/index.css +44 -64
  22. package/dist/uitvoerend-groen/index.d.ts +42 -62
  23. package/dist/uitvoerend-groen/index.js +44 -64
  24. package/dist/uitvoerend-groen/index.json +43 -63
  25. package/dist/uitvoerend-groen/index.tokens.json +79 -99
  26. package/dist/uitvoerend-groen/root.css +44 -64
  27. package/dist/uitvoerend-groen/tokens.d.ts +78 -98
  28. package/dist/uitvoerend-groen/tokens.js +1766 -2238
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +44 -64
  30. package/dist/uitvoerend-hemelblauw/index.css +44 -64
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +42 -62
  32. package/dist/uitvoerend-hemelblauw/index.js +44 -64
  33. package/dist/uitvoerend-hemelblauw/index.json +43 -63
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +79 -99
  35. package/dist/uitvoerend-hemelblauw/root.css +44 -64
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +78 -98
  37. package/dist/uitvoerend-hemelblauw/tokens.js +1766 -2238
  38. package/dist/uitvoerend-mintgroen/_variables.scss +44 -64
  39. package/dist/uitvoerend-mintgroen/index.css +44 -64
  40. package/dist/uitvoerend-mintgroen/index.d.ts +42 -62
  41. package/dist/uitvoerend-mintgroen/index.js +44 -64
  42. package/dist/uitvoerend-mintgroen/index.json +43 -63
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +79 -99
  44. package/dist/uitvoerend-mintgroen/root.css +44 -64
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +78 -98
  46. package/dist/uitvoerend-mintgroen/tokens.js +1766 -2238
  47. package/dist/uitvoerend-oranje/_variables.scss +44 -64
  48. package/dist/uitvoerend-oranje/index.css +44 -64
  49. package/dist/uitvoerend-oranje/index.d.ts +42 -62
  50. package/dist/uitvoerend-oranje/index.js +44 -64
  51. package/dist/uitvoerend-oranje/index.json +43 -63
  52. package/dist/uitvoerend-oranje/index.tokens.json +79 -99
  53. package/dist/uitvoerend-oranje/root.css +44 -64
  54. package/dist/uitvoerend-oranje/tokens.d.ts +78 -98
  55. package/dist/uitvoerend-oranje/tokens.js +1766 -2238
  56. package/dist/uitvoerend-paars/_variables.scss +44 -64
  57. package/dist/uitvoerend-paars/index.css +44 -64
  58. package/dist/uitvoerend-paars/index.d.ts +42 -62
  59. package/dist/uitvoerend-paars/index.js +44 -64
  60. package/dist/uitvoerend-paars/index.json +43 -63
  61. package/dist/uitvoerend-paars/index.tokens.json +79 -99
  62. package/dist/uitvoerend-paars/root.css +44 -64
  63. package/dist/uitvoerend-paars/tokens.d.ts +78 -98
  64. package/dist/uitvoerend-paars/tokens.js +1766 -2238
  65. package/dist/uitvoerend-violet/_variables.scss +44 -64
  66. package/dist/uitvoerend-violet/index.css +44 -64
  67. package/dist/uitvoerend-violet/index.d.ts +42 -62
  68. package/dist/uitvoerend-violet/index.js +44 -64
  69. package/dist/uitvoerend-violet/index.json +43 -63
  70. package/dist/uitvoerend-violet/index.tokens.json +79 -99
  71. package/dist/uitvoerend-violet/root.css +44 -64
  72. package/dist/uitvoerend-violet/tokens.d.ts +78 -98
  73. package/dist/uitvoerend-violet/tokens.js +1766 -2238
  74. package/dist/uitvoerend-violet-oud/_variables.scss +44 -64
  75. package/dist/uitvoerend-violet-oud/index.css +44 -64
  76. package/dist/uitvoerend-violet-oud/index.d.ts +42 -62
  77. package/dist/uitvoerend-violet-oud/index.js +44 -64
  78. package/dist/uitvoerend-violet-oud/index.json +43 -63
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +79 -99
  80. package/dist/uitvoerend-violet-oud/root.css +44 -64
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +78 -98
  82. package/dist/uitvoerend-violet-oud/tokens.js +1761 -2233
  83. package/dist/wetgevend/_variables.scss +44 -64
  84. package/dist/wetgevend/index.css +44 -64
  85. package/dist/wetgevend/index.d.ts +42 -62
  86. package/dist/wetgevend/index.js +44 -64
  87. package/dist/wetgevend/index.json +43 -63
  88. package/dist/wetgevend/index.tokens.json +79 -99
  89. package/dist/wetgevend/root.css +44 -64
  90. package/dist/wetgevend/tokens.d.ts +78 -98
  91. package/dist/wetgevend/tokens.js +1766 -2238
  92. package/figma/figma.tokens.json +152 -262
  93. package/package.json +2 -2
  94. package/src/generated/base.tokens.json +129 -209
  95. package/src/generated/koop/tokens.json +199 -279
  96. package/src/generated/themes.json +1827 -2547
  97. package/src/generated/uitvoerend-groen/tokens.json +199 -279
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +199 -279
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +199 -279
  100. package/src/generated/uitvoerend-oranje/tokens.json +199 -279
  101. package/src/generated/uitvoerend-paars/tokens.json +199 -279
  102. package/src/generated/uitvoerend-violet/tokens.json +199 -279
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +199 -279
  104. package/src/generated/wetgevend/tokens.json +199 -279
  105. package/token-transformer.mjs +0 -2
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Fri, 05 Sep 2025 09:25:14 GMT
3
+ // Generated on Fri, 26 Sep 2025 23:36:52 GMT
4
4
 
5
5
  $figma-link-icon-size: 1.25rem;
6
6
  $rhc-space-700: 3.5rem;
@@ -19,7 +19,7 @@ $rhc-border-width-m: 2px;
19
19
  $rhc-border-width-default: 1px;
20
20
  $rhc-font-family-secondary: RijksoverheidSerifWeb, 'Times New Roman', serif;
21
21
  $rhc-font-family-primary: 'Fira Sans', Arial, Verdana, sans-serif;
22
- $rhc-size-3-lint: 1440px;
22
+ $rhc-size-3-lint: 144px;
23
23
  $rhc-size-2-lint: 96px;
24
24
  $rhc-size-lint: 48px;
25
25
  $rhc-size-half-lint: 24px;
@@ -222,6 +222,7 @@ $rhc-nav-bar-border-color: #BE4088;
222
222
  $rhc-nav-bar-color: #a90061;
223
223
  $rhc-nav-bar-background-color: #fff;
224
224
  $rhc-nav-bar-heading-font-weight: 700;
225
+ $rhc-nav-bar-link-font-size: 1.25rem;
225
226
  $rhc-nav-bar-link-column-gap: 0.5rem;
226
227
  $rhc-nav-bar-link-padding-inline-start: 0.75rem;
227
228
  $rhc-nav-bar-link-padding-inline-end: 0.75rem;
@@ -506,10 +507,6 @@ $rhc-rounded-corner-border-width: 2px;
506
507
  $rhc-rounded-corner-xl-border-radius: 96px;
507
508
  $rhc-rounded-corner-md-border-radius: 48px;
508
509
  $rhc-rounded-corner-xs-border-radius: 24px;
509
- $rhc-breadcrumb-nav-link-current-color: #334155;
510
- $rhc-data-badge-button-hover-color: #fff;
511
- $rhc-data-badge-button-hover-background-color: #a90061;
512
- $rhc-data-badge-button-column-gap: 0.125rem;
513
510
  $rhc-keep-bottom-left-border-radius-bottom-left: 48px;
514
511
  $rhc-keep-bottom-left-border-radius-bottom-right: 0;
515
512
  $rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -526,7 +523,15 @@ $rhc-keep-top-left-border-radius-bottom-left: 0;
526
523
  $rhc-keep-top-left-border-radius-bottom-right: 0;
527
524
  $rhc-keep-top-left-border-radius-top-right: 0;
528
525
  $rhc-keep-top-left-border-radius-top-left: 48px;
529
- $rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.;
526
+ $rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.;
527
+ $rhc-breadcrumb-nav-link-current-color: #334155;
528
+ $rhc-data-badge-button-hover-color: #fff;
529
+ $rhc-data-badge-button-hover-background-color: #a90061;
530
+ $rhc-data-badge-button-column-gap: 0.125rem;
531
+ $rhc-blockquote-margin-inline-start: 0rem;
532
+ $rhc-blockquote-margin-inline-end: 0rem;
533
+ $rhc-blockquote-margin-block-start: 0rem;
534
+ $rhc-blockquote-margin-block-end: 0rem;
530
535
  $nl-heading-level-6-margin-block-start: 0rem;
531
536
  $nl-heading-level-6-margin-block-end: 0rem;
532
537
  $nl-heading-level-6-line-height: 150%;
@@ -686,6 +691,22 @@ $utrecht-document-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
686
691
  $utrecht-document-color: #0F172A;
687
692
  $utrecht-document-background-color: #fff;
688
693
  $utrecht-article-max-inline-size: 75ch;
694
+ $utrecht-backdrop-reduced-transparency-opacity: 0.98;
695
+ $utrecht-backdrop-fade-in-animation-duration: 400ms;
696
+ $utrecht-backdrop-opacity: 0.8;
697
+ $utrecht-backdrop-color: #0F172A;
698
+ $utrecht-backdrop-background-color: #0000004d;
699
+ $utrecht-drawer-padding-inline-end: 1rem;
700
+ $utrecht-drawer-padding-inline-start: 1rem;
701
+ $utrecht-drawer-padding-block-end: 1rem;
702
+ $utrecht-drawer-padding-block-start: 1rem;
703
+ $utrecht-drawer-max-block-size: 240px;
704
+ $utrecht-drawer-color: #0F172A;
705
+ $utrecht-drawer-border-width: 0px;
706
+ $utrecht-drawer-border-color: #64748B;
707
+ $utrecht-drawer-background-color: #fff;
708
+ $utrecht-drawer-z-index: 1;
709
+ $utrecht-drawer-max-inline-size: 256px;
689
710
  $utrecht-form-fieldset-invalid-border-inline-start-width: 0px;
690
711
  $utrecht-form-fieldset-invalid-padding-inline-start: 0rem;
691
712
  $utrecht-form-fieldset-invalid-border-inline-start-color: #d52b1e;
@@ -781,6 +802,11 @@ $utrecht-column-layout-gap: 0.75rem;
781
802
  $utrecht-column-layout-column-width: 400px;
782
803
  $utrecht-column-layout-column-rule-width: 0px;
783
804
  $utrecht-column-layout-column-rule-color: transparent;
805
+ $utrecht-action-group-row-gap: 0.5rem;
806
+ $utrecht-action-group-padding-block-start: 0rem;
807
+ $utrecht-action-group-padding-block-end: 0rem;
808
+ $utrecht-action-group-column-gap: 0.5rem;
809
+ $utrecht-action-group-background-color: transparent;
784
810
  $utrecht-ordered-list-item-padding-inline-start: 0.5rem;
785
811
  $utrecht-ordered-list-item-margin-block-start: 0.25rem;
786
812
  $utrecht-ordered-list-item-margin-block-end: 0.25rem;
@@ -835,11 +861,6 @@ $utrecht-breadcrumb-nav-min-block-size: 48px;
835
861
  $utrecht-breadcrumb-nav-line-height: 150%;
836
862
  $utrecht-breadcrumb-nav-font-size: 1.25rem;
837
863
  $utrecht-breadcrumb-nav-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
838
- $utrecht-button-group-row-gap: 0.5rem;
839
- $utrecht-button-group-padding-block-start: 0px;
840
- $utrecht-button-group-padding-block-end: 0px;
841
- $utrecht-button-group-column-gap: 0.5rem;
842
- $utrecht-button-group-background-color: transparent;
843
864
  $utrecht-button-group-margin-block-start: 0rem;
844
865
  $utrecht-button-group-margin-block-end: 0rem;
845
866
  $utrecht-button-subtle-active-color: #65003a;
@@ -1010,6 +1031,8 @@ $utrecht-alert-border-width: 0px;
1010
1031
  $utrecht-alert-border-radius: 5px;
1011
1032
  $utrecht-alert-border-color: transparent;
1012
1033
  $utrecht-alert-background-color: #d9ebf7;
1034
+ $utrecht-blockquote-content-font-size: 1.25rem;
1035
+ $utrecht-blockquote-content-color: #154273;
1013
1036
  $utrecht-blockquote-attribution-font-size: 1.25rem;
1014
1037
  $utrecht-blockquote-attribution-color: #154273;
1015
1038
  $utrecht-blockquote-row-gap: 0.75rem;
@@ -1025,46 +1048,6 @@ $utrecht-blockquote-border-radius: 0px;
1025
1048
  $utrecht-blockquote-border-color: transparent;
1026
1049
  $utrecht-blockquote-border-inline-start-width: 0px;
1027
1050
  $utrecht-blockquote-background-color: transparent;
1028
- $utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
1029
- $utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
1030
- $utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
1031
- $utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
1032
- $utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
1033
- $utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
1034
- $utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
1035
- $utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
1036
- $utrecht-blockquote-pink-corner-border-variation-border-inline-start-width: 0.25rem;
1037
- $utrecht-blockquote-pink-corner-border-variation-border-color: #F6BDE1;
1038
- $utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
1039
- $utrecht-blockquote-pink-background-variation-padding: 2.5rem;
1040
- $utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
1041
- $utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
1042
- $utrecht-blockquote-content-font-size: 1.25rem;
1043
- $utrecht-blockquote-content-color: #154273;
1044
- $utrecht-blockquote-content-line-height: 150%;
1045
- $utrecht-blockquote-content-font-weight: 400;
1046
- $utrecht-blockquote-content-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1047
- $utrecht-blockquote-caption-padding-block-start: 0.75rem;
1048
- $utrecht-blockquote-caption-line-height: 150%;
1049
- $utrecht-blockquote-caption-font-weight: 400;
1050
- $utrecht-blockquote-caption-font-size: 1.25rem;
1051
- $utrecht-blockquote-caption-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1052
- $utrecht-blockquote-caption-color: #154273;
1053
- $utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
1054
- $utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
1055
- $utrecht-blockquote-blue-corner-border-variation-border-color: #a90061;
1056
- $utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
1057
- $utrecht-blockquote-margin-inline-start: 0;
1058
- $utrecht-blockquote-margin-inline-end: 0;
1059
- $utrecht-blockquote-margin-block-start: 0;
1060
- $utrecht-blockquote-margin-block-end: 0;
1061
- $utrecht-blockquote-border-start-start-radius: 0;
1062
- $utrecht-blockquote-border-start-end-radius: 0;
1063
- $utrecht-blockquote-border-inline-end-width: 0;
1064
- $utrecht-blockquote-border-end-start-radius: 0;
1065
- $utrecht-blockquote-border-end-end-radius: 0;
1066
- $utrecht-blockquote-border-block-start-width: 0;
1067
- $utrecht-blockquote-border-block-end-width: 0;
1068
1051
  $utrecht-number-badge-padding-inline: 0.5rem;
1069
1052
  $utrecht-number-badge-padding-block: 0.125rem;
1070
1053
  $utrecht-number-badge-min-inline-size: 24px;
@@ -1089,22 +1072,12 @@ $utrecht-figure-caption-padding-block-start: 0.5rem;
1089
1072
  $utrecht-figure-caption-padding-block-end: 0.5rem;
1090
1073
  $utrecht-figure-caption-border-width: 4px;
1091
1074
  $utrecht-figure-caption-border-color: #CBD5E1;
1092
- $utrecht-form-label-disabled-color: #94A3B8;
1093
- $utrecht-form-label-checked-font-weight: 400;
1094
- $utrecht-form-label-radio-font-weight: 400;
1095
- $utrecht-form-label-radio-color: #0F172A;
1096
- $utrecht-form-label-checkbox-font-weight: 400;
1097
- $utrecht-form-label-checkbox-color: #0F172A;
1098
- $utrecht-form-label-font-weight: 700;
1099
- $utrecht-form-label-font-size: 1.25rem;
1100
- $utrecht-form-label-color: #0F172A;
1101
1075
  $utrecht-form-field-description-margin-block-start: -0.5rem;
1102
1076
  $utrecht-form-field-description-margin-block-end: 0.5rem;
1103
1077
  $utrecht-form-field-description-line-height: 150%;
1104
1078
  $utrecht-form-field-description-font-size: 1.25rem;
1105
1079
  $utrecht-form-field-description-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1106
1080
  $utrecht-form-field-description-color: #334155;
1107
- $utrecht-form-field-description-padding-block-end: 0.5rem;
1108
1081
  $utrecht-form-field-error-message-padding-inline-start: 0rem;
1109
1082
  $utrecht-form-field-error-message-padding-inline-end: 0rem;
1110
1083
  $utrecht-form-field-error-message-padding-block-start: 0rem;
@@ -1117,8 +1090,15 @@ $utrecht-form-field-error-message-font-size: 1.25rem;
1117
1090
  $utrecht-form-field-error-message-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1118
1091
  $utrecht-form-field-error-message-color: #d52b1e;
1119
1092
  $utrecht-form-field-error-message-background-color: transparent;
1120
- $utrecht-form-field-error-message-icon-size: 24px;
1121
- $utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1093
+ $utrecht-form-label-disabled-color: #94A3B8;
1094
+ $utrecht-form-label-checked-font-weight: 400;
1095
+ $utrecht-form-label-radio-font-weight: 400;
1096
+ $utrecht-form-label-radio-color: #0F172A;
1097
+ $utrecht-form-label-checkbox-font-weight: 400;
1098
+ $utrecht-form-label-checkbox-color: #0F172A;
1099
+ $utrecht-form-label-font-weight: 700;
1100
+ $utrecht-form-label-font-size: 1.25rem;
1101
+ $utrecht-form-label-color: #0F172A;
1122
1102
  $utrecht-textarea-disabled-color: #475569;
1123
1103
  $utrecht-textarea-disabled-border-color: #94A3B8;
1124
1104
  $utrecht-textarea-disabled-background-color: #CBD5E1;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 09:25:14 GMT
3
+ * Generated on Fri, 26 Sep 2025 23:36:52 GMT
4
4
  */
5
5
 
6
6
  .uitvoerend-violet {
@@ -21,7 +21,7 @@
21
21
  --rhc-border-width-default: 1px;
22
22
  --rhc-font-family-secondary: RijksoverheidSerifWeb, 'Times New Roman', serif;
23
23
  --rhc-font-family-primary: 'Fira Sans', Arial, Verdana, sans-serif;
24
- --rhc-size-3-lint: 1440px;
24
+ --rhc-size-3-lint: 144px;
25
25
  --rhc-size-2-lint: 96px;
26
26
  --rhc-size-lint: 48px;
27
27
  --rhc-size-half-lint: 24px;
@@ -224,6 +224,7 @@
224
224
  --rhc-nav-bar-color: #a90061;
225
225
  --rhc-nav-bar-background-color: #fff;
226
226
  --rhc-nav-bar-heading-font-weight: 700;
227
+ --rhc-nav-bar-link-font-size: 1.25rem;
227
228
  --rhc-nav-bar-link-column-gap: 0.5rem;
228
229
  --rhc-nav-bar-link-padding-inline-start: 0.75rem;
229
230
  --rhc-nav-bar-link-padding-inline-end: 0.75rem;
@@ -508,10 +509,6 @@
508
509
  --rhc-rounded-corner-xl-border-radius: 96px;
509
510
  --rhc-rounded-corner-md-border-radius: 48px;
510
511
  --rhc-rounded-corner-xs-border-radius: 24px;
511
- --rhc-breadcrumb-nav-link-current-color: #334155;
512
- --rhc-data-badge-button-hover-color: #fff;
513
- --rhc-data-badge-button-hover-background-color: #a90061;
514
- --rhc-data-badge-button-column-gap: 0.125rem;
515
512
  --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
516
513
  --rhc-keep-bottom-left-border-radius-bottom-right: 0;
517
514
  --rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -528,7 +525,15 @@
528
525
  --rhc-keep-top-left-border-radius-bottom-right: 0;
529
526
  --rhc-keep-top-left-border-radius-top-right: 0;
530
527
  --rhc-keep-top-left-border-radius-top-left: 48px;
531
- --rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.;
528
+ --rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.;
529
+ --rhc-breadcrumb-nav-link-current-color: #334155;
530
+ --rhc-data-badge-button-hover-color: #fff;
531
+ --rhc-data-badge-button-hover-background-color: #a90061;
532
+ --rhc-data-badge-button-column-gap: 0.125rem;
533
+ --rhc-blockquote-margin-inline-start: 0rem;
534
+ --rhc-blockquote-margin-inline-end: 0rem;
535
+ --rhc-blockquote-margin-block-start: 0rem;
536
+ --rhc-blockquote-margin-block-end: 0rem;
532
537
  --nl-heading-level-6-margin-block-start: 0rem;
533
538
  --nl-heading-level-6-margin-block-end: 0rem;
534
539
  --nl-heading-level-6-line-height: 150%;
@@ -688,6 +693,22 @@
688
693
  --utrecht-document-color: #0F172A;
689
694
  --utrecht-document-background-color: #fff;
690
695
  --utrecht-article-max-inline-size: 75ch;
696
+ --utrecht-backdrop-reduced-transparency-opacity: 0.98;
697
+ --utrecht-backdrop-fade-in-animation-duration: 400ms;
698
+ --utrecht-backdrop-opacity: 0.8;
699
+ --utrecht-backdrop-color: #0F172A;
700
+ --utrecht-backdrop-background-color: #0000004d;
701
+ --utrecht-drawer-padding-inline-end: 1rem;
702
+ --utrecht-drawer-padding-inline-start: 1rem;
703
+ --utrecht-drawer-padding-block-end: 1rem;
704
+ --utrecht-drawer-padding-block-start: 1rem;
705
+ --utrecht-drawer-max-block-size: 240px;
706
+ --utrecht-drawer-color: #0F172A;
707
+ --utrecht-drawer-border-width: 0px;
708
+ --utrecht-drawer-border-color: #64748B;
709
+ --utrecht-drawer-background-color: #fff;
710
+ --utrecht-drawer-z-index: 1;
711
+ --utrecht-drawer-max-inline-size: 256px;
691
712
  --utrecht-form-fieldset-invalid-border-inline-start-width: 0px;
692
713
  --utrecht-form-fieldset-invalid-padding-inline-start: 0rem;
693
714
  --utrecht-form-fieldset-invalid-border-inline-start-color: #d52b1e;
@@ -783,6 +804,11 @@
783
804
  --utrecht-column-layout-column-width: 400px;
784
805
  --utrecht-column-layout-column-rule-width: 0px;
785
806
  --utrecht-column-layout-column-rule-color: transparent;
807
+ --utrecht-action-group-row-gap: 0.5rem;
808
+ --utrecht-action-group-padding-block-start: 0rem;
809
+ --utrecht-action-group-padding-block-end: 0rem;
810
+ --utrecht-action-group-column-gap: 0.5rem;
811
+ --utrecht-action-group-background-color: transparent;
786
812
  --utrecht-ordered-list-item-padding-inline-start: 0.5rem;
787
813
  --utrecht-ordered-list-item-margin-block-start: 0.25rem;
788
814
  --utrecht-ordered-list-item-margin-block-end: 0.25rem;
@@ -837,11 +863,6 @@
837
863
  --utrecht-breadcrumb-nav-line-height: 150%;
838
864
  --utrecht-breadcrumb-nav-font-size: 1.25rem;
839
865
  --utrecht-breadcrumb-nav-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
840
- --utrecht-button-group-row-gap: 0.5rem;
841
- --utrecht-button-group-padding-block-start: 0px;
842
- --utrecht-button-group-padding-block-end: 0px;
843
- --utrecht-button-group-column-gap: 0.5rem;
844
- --utrecht-button-group-background-color: transparent;
845
866
  --utrecht-button-group-margin-block-start: 0rem;
846
867
  --utrecht-button-group-margin-block-end: 0rem;
847
868
  --utrecht-button-subtle-active-color: #65003a;
@@ -1012,6 +1033,8 @@
1012
1033
  --utrecht-alert-border-radius: 5px;
1013
1034
  --utrecht-alert-border-color: transparent;
1014
1035
  --utrecht-alert-background-color: #d9ebf7;
1036
+ --utrecht-blockquote-content-font-size: 1.25rem;
1037
+ --utrecht-blockquote-content-color: #154273;
1015
1038
  --utrecht-blockquote-attribution-font-size: 1.25rem;
1016
1039
  --utrecht-blockquote-attribution-color: #154273;
1017
1040
  --utrecht-blockquote-row-gap: 0.75rem;
@@ -1027,46 +1050,6 @@
1027
1050
  --utrecht-blockquote-border-color: transparent;
1028
1051
  --utrecht-blockquote-border-inline-start-width: 0px;
1029
1052
  --utrecht-blockquote-background-color: transparent;
1030
- --utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
1031
- --utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
1032
- --utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
1033
- --utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
1034
- --utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
1035
- --utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
1036
- --utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
1037
- --utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
1038
- --utrecht-blockquote-pink-corner-border-variation-border-inline-start-width: 0.25rem;
1039
- --utrecht-blockquote-pink-corner-border-variation-border-color: #F6BDE1;
1040
- --utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
1041
- --utrecht-blockquote-pink-background-variation-padding: 2.5rem;
1042
- --utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
1043
- --utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
1044
- --utrecht-blockquote-content-font-size: 1.25rem;
1045
- --utrecht-blockquote-content-color: #154273;
1046
- --utrecht-blockquote-content-line-height: 150%;
1047
- --utrecht-blockquote-content-font-weight: 400;
1048
- --utrecht-blockquote-content-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1049
- --utrecht-blockquote-caption-padding-block-start: 0.75rem;
1050
- --utrecht-blockquote-caption-line-height: 150%;
1051
- --utrecht-blockquote-caption-font-weight: 400;
1052
- --utrecht-blockquote-caption-font-size: 1.25rem;
1053
- --utrecht-blockquote-caption-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1054
- --utrecht-blockquote-caption-color: #154273;
1055
- --utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
1056
- --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
1057
- --utrecht-blockquote-blue-corner-border-variation-border-color: #a90061;
1058
- --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
1059
- --utrecht-blockquote-margin-inline-start: 0;
1060
- --utrecht-blockquote-margin-inline-end: 0;
1061
- --utrecht-blockquote-margin-block-start: 0;
1062
- --utrecht-blockquote-margin-block-end: 0;
1063
- --utrecht-blockquote-border-start-start-radius: 0;
1064
- --utrecht-blockquote-border-start-end-radius: 0;
1065
- --utrecht-blockquote-border-inline-end-width: 0;
1066
- --utrecht-blockquote-border-end-start-radius: 0;
1067
- --utrecht-blockquote-border-end-end-radius: 0;
1068
- --utrecht-blockquote-border-block-start-width: 0;
1069
- --utrecht-blockquote-border-block-end-width: 0;
1070
1053
  --utrecht-number-badge-padding-inline: 0.5rem;
1071
1054
  --utrecht-number-badge-padding-block: 0.125rem;
1072
1055
  --utrecht-number-badge-min-inline-size: 24px;
@@ -1091,22 +1074,12 @@
1091
1074
  --utrecht-figure-caption-padding-block-end: 0.5rem;
1092
1075
  --utrecht-figure-caption-border-width: 4px;
1093
1076
  --utrecht-figure-caption-border-color: #CBD5E1;
1094
- --utrecht-form-label-disabled-color: #94A3B8;
1095
- --utrecht-form-label-checked-font-weight: 400;
1096
- --utrecht-form-label-radio-font-weight: 400;
1097
- --utrecht-form-label-radio-color: #0F172A;
1098
- --utrecht-form-label-checkbox-font-weight: 400;
1099
- --utrecht-form-label-checkbox-color: #0F172A;
1100
- --utrecht-form-label-font-weight: 700;
1101
- --utrecht-form-label-font-size: 1.25rem;
1102
- --utrecht-form-label-color: #0F172A;
1103
1077
  --utrecht-form-field-description-margin-block-start: -0.5rem;
1104
1078
  --utrecht-form-field-description-margin-block-end: 0.5rem;
1105
1079
  --utrecht-form-field-description-line-height: 150%;
1106
1080
  --utrecht-form-field-description-font-size: 1.25rem;
1107
1081
  --utrecht-form-field-description-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1108
1082
  --utrecht-form-field-description-color: #334155;
1109
- --utrecht-form-field-description-padding-block-end: 0.5rem;
1110
1083
  --utrecht-form-field-error-message-padding-inline-start: 0rem;
1111
1084
  --utrecht-form-field-error-message-padding-inline-end: 0rem;
1112
1085
  --utrecht-form-field-error-message-padding-block-start: 0rem;
@@ -1119,8 +1092,15 @@
1119
1092
  --utrecht-form-field-error-message-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1120
1093
  --utrecht-form-field-error-message-color: #d52b1e;
1121
1094
  --utrecht-form-field-error-message-background-color: transparent;
1122
- --utrecht-form-field-error-message-icon-size: 24px;
1123
- --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1095
+ --utrecht-form-label-disabled-color: #94A3B8;
1096
+ --utrecht-form-label-checked-font-weight: 400;
1097
+ --utrecht-form-label-radio-font-weight: 400;
1098
+ --utrecht-form-label-radio-color: #0F172A;
1099
+ --utrecht-form-label-checkbox-font-weight: 400;
1100
+ --utrecht-form-label-checkbox-color: #0F172A;
1101
+ --utrecht-form-label-font-weight: 700;
1102
+ --utrecht-form-label-font-size: 1.25rem;
1103
+ --utrecht-form-label-color: #0F172A;
1124
1104
  --utrecht-textarea-disabled-color: #475569;
1125
1105
  --utrecht-textarea-disabled-border-color: #94A3B8;
1126
1106
  --utrecht-textarea-disabled-background-color: #CBD5E1;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 09:25:13 GMT
3
+ * Generated on Fri, 26 Sep 2025 23:36:52 GMT
4
4
  */
5
5
 
6
6
  export const utrechtTextboxHoverBackgroundColor : string;
@@ -221,8 +221,15 @@ export const utrechtTextareaReadOnlyColor : string;
221
221
  export const utrechtTextareaDisabledBackgroundColor : string;
222
222
  export const utrechtTextareaDisabledBorderColor : string;
223
223
  export const utrechtTextareaDisabledColor : string;
224
- export const utrechtFormFieldErrorMessageIconMarginInlineEnd : string;
225
- export const utrechtFormFieldErrorMessageIconSize : string;
224
+ export const utrechtFormLabelColor : string;
225
+ export const utrechtFormLabelFontSize : string;
226
+ export const utrechtFormLabelFontWeight : number;
227
+ export const utrechtFormLabelCheckboxColor : string;
228
+ export const utrechtFormLabelCheckboxFontWeight : number;
229
+ export const utrechtFormLabelRadioColor : string;
230
+ export const utrechtFormLabelRadioFontWeight : number;
231
+ export const utrechtFormLabelCheckedFontWeight : number;
232
+ export const utrechtFormLabelDisabledColor : string;
226
233
  export const utrechtFormFieldErrorMessageBackgroundColor : string;
227
234
  export const utrechtFormFieldErrorMessageColor : string;
228
235
  export const utrechtFormFieldErrorMessageFontFamily : string;
@@ -235,22 +242,12 @@ export const utrechtFormFieldErrorMessagePaddingBlockEnd : string;
235
242
  export const utrechtFormFieldErrorMessagePaddingBlockStart : string;
236
243
  export const utrechtFormFieldErrorMessagePaddingInlineEnd : string;
237
244
  export const utrechtFormFieldErrorMessagePaddingInlineStart : string;
238
- export const utrechtFormFieldDescriptionPaddingBlockEnd : string;
239
245
  export const utrechtFormFieldDescriptionColor : string;
240
246
  export const utrechtFormFieldDescriptionFontFamily : string;
241
247
  export const utrechtFormFieldDescriptionFontSize : string;
242
248
  export const utrechtFormFieldDescriptionLineHeight : string;
243
249
  export const utrechtFormFieldDescriptionMarginBlockEnd : string;
244
250
  export const utrechtFormFieldDescriptionMarginBlockStart : string;
245
- export const utrechtFormLabelColor : string;
246
- export const utrechtFormLabelFontSize : string;
247
- export const utrechtFormLabelFontWeight : number;
248
- export const utrechtFormLabelCheckboxColor : string;
249
- export const utrechtFormLabelCheckboxFontWeight : number;
250
- export const utrechtFormLabelRadioColor : string;
251
- export const utrechtFormLabelRadioFontWeight : number;
252
- export const utrechtFormLabelCheckedFontWeight : number;
253
- export const utrechtFormLabelDisabledColor : string;
254
251
  export const utrechtFigureCaptionBorderColor : string;
255
252
  export const utrechtFigureCaptionBorderWidth : string;
256
253
  export const utrechtFigureCaptionPaddingBlockEnd : string;
@@ -275,46 +272,6 @@ export const utrechtNumberBadgeMinBlockSize : string;
275
272
  export const utrechtNumberBadgeMinInlineSize : string;
276
273
  export const utrechtNumberBadgePaddingBlock : string;
277
274
  export const utrechtNumberBadgePaddingInline : string;
278
- export const utrechtBlockquoteBorderBlockEndWidth : number;
279
- export const utrechtBlockquoteBorderBlockStartWidth : number;
280
- export const utrechtBlockquoteBorderEndEndRadius : number;
281
- export const utrechtBlockquoteBorderEndStartRadius : number;
282
- export const utrechtBlockquoteBorderInlineEndWidth : number;
283
- export const utrechtBlockquoteBorderStartEndRadius : number;
284
- export const utrechtBlockquoteBorderStartStartRadius : number;
285
- export const utrechtBlockquoteMarginBlockEnd : number;
286
- export const utrechtBlockquoteMarginBlockStart : number;
287
- export const utrechtBlockquoteMarginInlineEnd : number;
288
- export const utrechtBlockquoteMarginInlineStart : number;
289
- export const utrechtBlockquoteBlueCornerBorderVariationBorderBlockEndWidth : string;
290
- export const utrechtBlockquoteBlueCornerBorderVariationBorderColor : string;
291
- export const utrechtBlockquoteBlueCornerBorderVariationBorderEndEndRadius : string;
292
- export const utrechtBlockquoteBlueCornerBorderVariationBorderInlineEndWidth : string;
293
- export const utrechtBlockquoteCaptionColor : string;
294
- export const utrechtBlockquoteCaptionFontFamily : string;
295
- export const utrechtBlockquoteCaptionFontSize : string;
296
- export const utrechtBlockquoteCaptionFontWeight : number;
297
- export const utrechtBlockquoteCaptionLineHeight : string;
298
- export const utrechtBlockquoteCaptionPaddingBlockStart : string;
299
- export const utrechtBlockquoteContentFontFamily : string;
300
- export const utrechtBlockquoteContentFontWeight : number;
301
- export const utrechtBlockquoteContentLineHeight : string;
302
- export const utrechtBlockquoteContentColor : string;
303
- export const utrechtBlockquoteContentFontSize : string;
304
- export const utrechtBlockquotePinkBackgroundVariationBackgroundColor : string;
305
- export const utrechtBlockquotePinkBackgroundVariationBorderEndStartRadius : string;
306
- export const utrechtBlockquotePinkBackgroundVariationPadding : string;
307
- export const utrechtBlockquotePinkCornerBorderVariationBorderBlockStartWidth : string;
308
- export const utrechtBlockquotePinkCornerBorderVariationBorderColor : string;
309
- export const utrechtBlockquotePinkCornerBorderVariationBorderInlineStartWidth : string;
310
- export const utrechtBlockquotePinkCornerBorderVariationBorderStartStartRadius : string;
311
- export const utrechtBlockquotePinkCornerBorderVariationPadding : string;
312
- export const utrechtBlockquotePinkLeftBorderVariationBorderColor : string;
313
- export const utrechtBlockquotePinkLeftBorderVariationBorderInlineStartWidth : string;
314
- export const utrechtBlockquotePinkLeftBorderVariationPaddingBlockEnd : string;
315
- export const utrechtBlockquotePinkLeftBorderVariationPaddingBlockStart : string;
316
- export const utrechtBlockquotePinkLeftBorderVariationPaddingInlineEnd : string;
317
- export const utrechtBlockquotePinkLeftBorderVariationPaddingInlineStart : string;
318
275
  export const utrechtBlockquoteBackgroundColor : string;
319
276
  export const utrechtBlockquoteBorderInlineStartWidth : string;
320
277
  export const utrechtBlockquoteBorderColor : string;
@@ -330,6 +287,8 @@ export const utrechtBlockquotePaddingInlineStart : string;
330
287
  export const utrechtBlockquoteRowGap : string;
331
288
  export const utrechtBlockquoteAttributionColor : string;
332
289
  export const utrechtBlockquoteAttributionFontSize : string;
290
+ export const utrechtBlockquoteContentColor : string;
291
+ export const utrechtBlockquoteContentFontSize : string;
333
292
  export const utrechtAlertBackgroundColor : string;
334
293
  export const utrechtAlertBorderColor : string;
335
294
  export const utrechtAlertBorderRadius : string;
@@ -500,11 +459,6 @@ export const utrechtButtonSubtleActiveBorderColor : string;
500
459
  export const utrechtButtonSubtleActiveColor : string;
501
460
  export const utrechtButtonGroupMarginBlockEnd : string;
502
461
  export const utrechtButtonGroupMarginBlockStart : string;
503
- export const utrechtButtonGroupBackgroundColor : string;
504
- export const utrechtButtonGroupColumnGap : string;
505
- export const utrechtButtonGroupPaddingBlockEnd : string;
506
- export const utrechtButtonGroupPaddingBlockStart : string;
507
- export const utrechtButtonGroupRowGap : string;
508
462
  export const utrechtBreadcrumbNavFontFamily : string;
509
463
  export const utrechtBreadcrumbNavFontSize : string;
510
464
  export const utrechtBreadcrumbNavLineHeight : string;
@@ -559,6 +513,11 @@ export const utrechtOrderedListPaddingInlineStart : string;
559
513
  export const utrechtOrderedListItemMarginBlockEnd : string;
560
514
  export const utrechtOrderedListItemMarginBlockStart : string;
561
515
  export const utrechtOrderedListItemPaddingInlineStart : string;
516
+ export const utrechtActionGroupBackgroundColor : string;
517
+ export const utrechtActionGroupColumnGap : string;
518
+ export const utrechtActionGroupPaddingBlockEnd : string;
519
+ export const utrechtActionGroupPaddingBlockStart : string;
520
+ export const utrechtActionGroupRowGap : string;
562
521
  export const utrechtColumnLayoutColumnRuleColor : string;
563
522
  export const utrechtColumnLayoutColumnRuleWidth : string;
564
523
  export const utrechtColumnLayoutColumnWidth : string;
@@ -654,6 +613,22 @@ export const utrechtFormFieldsetSectionColor : string;
654
613
  export const utrechtFormFieldsetInvalidBorderInlineStartColor : string;
655
614
  export const utrechtFormFieldsetInvalidPaddingInlineStart : string;
656
615
  export const utrechtFormFieldsetInvalidBorderInlineStartWidth : string;
616
+ export const utrechtDrawerMaxInlineSize : string;
617
+ export const utrechtDrawerZIndex : number;
618
+ export const utrechtDrawerBackgroundColor : string;
619
+ export const utrechtDrawerBorderColor : string;
620
+ export const utrechtDrawerBorderWidth : string;
621
+ export const utrechtDrawerColor : string;
622
+ export const utrechtDrawerMaxBlockSize : string;
623
+ export const utrechtDrawerPaddingBlockStart : string;
624
+ export const utrechtDrawerPaddingBlockEnd : string;
625
+ export const utrechtDrawerPaddingInlineStart : string;
626
+ export const utrechtDrawerPaddingInlineEnd : string;
627
+ export const utrechtBackdropBackgroundColor : string;
628
+ export const utrechtBackdropColor : string;
629
+ export const utrechtBackdropOpacity : number;
630
+ export const utrechtBackdropFadeInAnimationDuration : string;
631
+ export const utrechtBackdropReducedTransparencyOpacity : number;
657
632
  export const utrechtArticleMaxInlineSize : string;
658
633
  export const utrechtDocumentBackgroundColor : string;
659
634
  export const utrechtDocumentColor : string;
@@ -813,6 +788,14 @@ export const nlHeadingLevel6FontWeight : number;
813
788
  export const nlHeadingLevel6LineHeight : string;
814
789
  export const nlHeadingLevel6MarginBlockEnd : string;
815
790
  export const nlHeadingLevel6MarginBlockStart : string;
791
+ export const rhcBlockquoteMarginBlockEnd : string;
792
+ export const rhcBlockquoteMarginBlockStart : string;
793
+ export const rhcBlockquoteMarginInlineEnd : string;
794
+ export const rhcBlockquoteMarginInlineStart : string;
795
+ export const rhcDataBadgeButtonColumnGap : string;
796
+ export const rhcDataBadgeButtonHoverBackgroundColor : string;
797
+ export const rhcDataBadgeButtonHoverColor : string;
798
+ export const rhcBreadcrumbNavLinkCurrentColor : string;
816
799
  export const rhcKeepComment : string;
817
800
  export const rhcKeepTopLeftBorderRadiusTopLeft : string;
818
801
  export const rhcKeepTopLeftBorderRadiusTopRight : number;
@@ -830,10 +813,6 @@ export const rhcKeepBottomLeftBorderRadiusTopLeft : number;
830
813
  export const rhcKeepBottomLeftBorderRadiusTopRight : number;
831
814
  export const rhcKeepBottomLeftBorderRadiusBottomRight : number;
832
815
  export const rhcKeepBottomLeftBorderRadiusBottomLeft : string;
833
- export const rhcDataBadgeButtonColumnGap : string;
834
- export const rhcDataBadgeButtonHoverBackgroundColor : string;
835
- export const rhcDataBadgeButtonHoverColor : string;
836
- export const rhcBreadcrumbNavLinkCurrentColor : string;
837
816
  export const rhcRoundedCornerXsBorderRadius : string;
838
817
  export const rhcRoundedCornerMdBorderRadius : string;
839
818
  export const rhcRoundedCornerXlBorderRadius : string;
@@ -1118,6 +1097,7 @@ export const rhcNavBarLinkPaddingBlockStart : string;
1118
1097
  export const rhcNavBarLinkPaddingInlineEnd : string;
1119
1098
  export const rhcNavBarLinkPaddingInlineStart : string;
1120
1099
  export const rhcNavBarLinkColumnGap : string;
1100
+ export const rhcNavBarLinkFontSize : string;
1121
1101
  export const rhcNavBarHeadingFontWeight : number;
1122
1102
  export const rhcNavBarBackgroundColor : string;
1123
1103
  export const rhcNavBarColor : string;