@rijkshuisstijl-community/design-tokens 3.0.0 → 4.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 (104) hide show
  1. package/CHANGELOG.md +41 -0
  2. package/dist/_variables.scss +290 -221
  3. package/dist/index.css +290 -221
  4. package/dist/index.d.ts +280 -211
  5. package/dist/index.js +290 -221
  6. package/dist/index.json +290 -221
  7. package/dist/index.tokens.json +464 -318
  8. package/dist/koop/_variables.scss +1425 -0
  9. package/dist/koop/index.css +1428 -0
  10. package/dist/koop/index.d.ts +1426 -0
  11. package/dist/koop/index.js +1426 -0
  12. package/dist/koop/index.json +1423 -0
  13. package/dist/koop/index.tokens.json +2201 -0
  14. package/dist/koop/root.css +1428 -0
  15. package/dist/koop/tokens.d.ts +2224 -0
  16. package/dist/koop/tokens.js +33522 -0
  17. package/dist/root.css +290 -221
  18. package/dist/tokens.d.ts +409 -270
  19. package/dist/tokens.js +6775 -4888
  20. package/dist/uitvoerend-groen/_variables.scss +936 -848
  21. package/dist/uitvoerend-groen/index.css +936 -848
  22. package/dist/uitvoerend-groen/index.d.ts +978 -890
  23. package/dist/uitvoerend-groen/index.js +993 -905
  24. package/dist/uitvoerend-groen/index.json +962 -874
  25. package/dist/uitvoerend-groen/index.tokens.json +1836 -1680
  26. package/dist/uitvoerend-groen/root.css +936 -848
  27. package/dist/uitvoerend-groen/tokens.d.ts +1764 -1608
  28. package/dist/uitvoerend-groen/tokens.js +24764 -22418
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +936 -848
  30. package/dist/uitvoerend-hemelblauw/index.css +936 -848
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +978 -890
  32. package/dist/uitvoerend-hemelblauw/index.js +993 -905
  33. package/dist/uitvoerend-hemelblauw/index.json +962 -874
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +1835 -1679
  35. package/dist/uitvoerend-hemelblauw/root.css +936 -848
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +1764 -1608
  37. package/dist/uitvoerend-hemelblauw/tokens.js +24906 -22560
  38. package/dist/uitvoerend-mintgroen/_variables.scss +936 -848
  39. package/dist/uitvoerend-mintgroen/index.css +936 -848
  40. package/dist/uitvoerend-mintgroen/index.d.ts +978 -890
  41. package/dist/uitvoerend-mintgroen/index.js +993 -905
  42. package/dist/uitvoerend-mintgroen/index.json +962 -874
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +1836 -1680
  44. package/dist/uitvoerend-mintgroen/root.css +936 -848
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +1764 -1608
  46. package/dist/uitvoerend-mintgroen/tokens.js +24764 -22418
  47. package/dist/uitvoerend-oranje/_variables.scss +936 -848
  48. package/dist/uitvoerend-oranje/index.css +936 -848
  49. package/dist/uitvoerend-oranje/index.d.ts +978 -890
  50. package/dist/uitvoerend-oranje/index.js +993 -905
  51. package/dist/uitvoerend-oranje/index.json +962 -874
  52. package/dist/uitvoerend-oranje/index.tokens.json +1836 -1680
  53. package/dist/uitvoerend-oranje/root.css +936 -848
  54. package/dist/uitvoerend-oranje/tokens.d.ts +1764 -1608
  55. package/dist/uitvoerend-oranje/tokens.js +24764 -22418
  56. package/dist/uitvoerend-paars/_variables.scss +936 -848
  57. package/dist/uitvoerend-paars/index.css +936 -848
  58. package/dist/uitvoerend-paars/index.d.ts +978 -890
  59. package/dist/uitvoerend-paars/index.js +993 -905
  60. package/dist/uitvoerend-paars/index.json +962 -874
  61. package/dist/uitvoerend-paars/index.tokens.json +1836 -1680
  62. package/dist/uitvoerend-paars/root.css +936 -848
  63. package/dist/uitvoerend-paars/tokens.d.ts +1764 -1608
  64. package/dist/uitvoerend-paars/tokens.js +24764 -22418
  65. package/dist/uitvoerend-violet/_variables.scss +936 -848
  66. package/dist/uitvoerend-violet/index.css +936 -848
  67. package/dist/uitvoerend-violet/index.d.ts +978 -890
  68. package/dist/uitvoerend-violet/index.js +993 -905
  69. package/dist/uitvoerend-violet/index.json +962 -874
  70. package/dist/uitvoerend-violet/index.tokens.json +1836 -1680
  71. package/dist/uitvoerend-violet/root.css +936 -848
  72. package/dist/uitvoerend-violet/tokens.d.ts +1764 -1608
  73. package/dist/uitvoerend-violet/tokens.js +24764 -22418
  74. package/dist/uitvoerend-violet-oud/_variables.scss +936 -848
  75. package/dist/uitvoerend-violet-oud/index.css +936 -848
  76. package/dist/uitvoerend-violet-oud/index.d.ts +979 -891
  77. package/dist/uitvoerend-violet-oud/index.js +963 -875
  78. package/dist/uitvoerend-violet-oud/index.json +963 -875
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +1833 -1677
  80. package/dist/uitvoerend-violet-oud/root.css +936 -848
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +1381 -1225
  82. package/dist/uitvoerend-violet-oud/tokens.js +25102 -22756
  83. package/dist/wetgevend/_variables.scss +936 -848
  84. package/dist/wetgevend/index.css +936 -848
  85. package/dist/wetgevend/index.d.ts +978 -890
  86. package/dist/wetgevend/index.js +993 -905
  87. package/dist/wetgevend/index.json +962 -874
  88. package/dist/wetgevend/index.tokens.json +1636 -1480
  89. package/dist/wetgevend/root.css +936 -848
  90. package/dist/wetgevend/tokens.d.ts +1463 -1307
  91. package/dist/wetgevend/tokens.js +25526 -23180
  92. package/figma/figma.tokens.json +2154 -2247
  93. package/package.json +1 -1
  94. package/src/generated/base.tokens.json +1665 -1228
  95. package/src/generated/koop/tokens.json +6732 -0
  96. package/src/generated/themes.json +48640 -37872
  97. package/src/generated/uitvoerend-groen/tokens.json +5207 -4703
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +5212 -4708
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +5208 -4704
  100. package/src/generated/uitvoerend-oranje/tokens.json +5208 -4704
  101. package/src/generated/uitvoerend-paars/tokens.json +5200 -4696
  102. package/src/generated/uitvoerend-violet/tokens.json +5208 -4704
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +5200 -4696
  104. package/src/generated/wetgevend/tokens.json +5377 -4873
@@ -1,945 +1,839 @@
1
1
  {
2
- "rhc": {
3
- "data-summary": {
2
+ "nl": {
3
+ "skip-link": {
4
+ "border-color": "transparent",
5
+ "border-width": "2px",
4
6
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
5
- "item-value": {
6
- "font-weight": 400,
7
- "row": {
8
- "padding-block-end": "0.75rem",
9
- "padding-block-start": "0.75rem",
10
- "padding-inline-end": 0,
11
- "padding-inline-start": "0px"
12
- },
13
- "padding-block-end": "0.75rem",
14
- "padding-block-start": 0,
15
- "padding-inline-end": 0,
16
- "padding-inline-start": 0
7
+ "font-weight": 700,
8
+ "padding-block-end": "0.75rem",
9
+ "padding-block-start": "0.75rem",
10
+ "padding-inline-end": "1rem",
11
+ "padding-inline-start": "1rem",
12
+ "box-block-end-shadow": {
13
+ "blur-radius": "48px",
14
+ "color": "#0000001a",
15
+ "offset-x": 0,
16
+ "offset-y": "16px",
17
+ "spread-radius": 0
17
18
  },
18
- "item-key": {
19
- "font-weight": 700,
20
- "row": {
21
- "padding-block-end": "0.75rem",
22
- "padding-block-start": "0.75rem",
23
- "padding-inline-end": "1rem",
24
- "padding-inline-start": 0
25
- },
26
- "padding-block-end": "0.25rem",
27
- "padding-block-start": "0.75rem",
28
- "padding-inline-end": 0,
29
- "padding-inline-start": 0
19
+ "focus": {
20
+ "background-color": "#fff",
21
+ "border-color": "#a90061",
22
+ "border-style": "solid",
23
+ "border-width": "2px",
24
+ "color": "#0F172A",
25
+ "text-decoration": "None"
30
26
  },
31
- "item": {
32
- "border-width": "1px",
33
- "border-color": "#CBD5E1",
34
- "border-block-end-style": "solid",
35
- "color": "#0F172A"
27
+ "focus-visible": {
28
+ "outline-color": "#000"
36
29
  },
37
- "font-size": "1.25rem",
30
+ "text-decoration": "underline",
31
+ "background-color": "#fff",
32
+ "color": "#01689b",
33
+ "padding-block": "0.75rem",
34
+ "padding-inline": "1rem",
35
+ "min-block-size": "48px",
36
+ "min-inline-size": "48px",
37
+ "text-decoration-thickness": "0.0625em",
38
+ "text-underline-offset": "0.125rem",
38
39
  "line-height": "150%",
39
- "item-action": {
40
- "row": {
41
- "padding-block-end": "0.75rem",
42
- "padding-block-start": "0.75rem",
43
- "padding-inline-end": 0,
44
- "padding-inline-start": "1rem"
45
- },
46
- "padding-block-end": "0.75rem",
47
- "padding-block-start": "0.75rem",
48
- "padding-inline-end": "1rem",
49
- "padding-inline-start": 0
50
- }
40
+ "font-size": "1.25rem"
51
41
  },
52
- "keep": {
53
- "_comment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.",
54
- "top-left": {
55
- "borderRadiusTopLeft": "48px",
56
- "borderRadiusTopRight": 0,
57
- "borderRadiusBottomRight": 0,
58
- "borderRadiusBottomLeft": 0
42
+ "link": {
43
+ "column-gap": "0.25rem",
44
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
45
+ "font-size": "1.25rem",
46
+ "font-weight": 400,
47
+ "line-height": "150%",
48
+ "icon": {
49
+ "inset-block-start": "0.25rem",
50
+ "size": "24px"
59
51
  },
60
- "top-right": {
61
- "borderRadiusTopRight": "48px",
62
- "borderRadiusTopLeft": 0,
63
- "borderRadiusBottomRight": 0,
64
- "borderRadiusBottomLeft": 0
52
+ "active": {
53
+ "text-decoration": "None",
54
+ "color": "#1a4972"
65
55
  },
66
- "bottom-right": {
67
- "borderRadiusTopLeft": 0,
68
- "borderRadiusTopRight": 0,
69
- "borderRadiusBottomRight": "48px",
70
- "borderRadiusBottomLeft": 0
56
+ "focus": {
57
+ "background-color": "transparent",
58
+ "color": "#01689b",
59
+ "text-decoration": "None",
60
+ "text-decoration-thickness": "auto"
71
61
  },
72
- "bottom-left": {
73
- "borderRadiusTopLeft": 0,
74
- "borderRadiusTopRight": 0,
75
- "borderRadiusBottomRight": 0,
76
- "borderRadiusBottomLeft": "48px"
77
- }
78
- },
79
- "rounded-corner": {
80
- "xs": {
81
- "border-radius": "24px"
62
+ "visited": {
63
+ "color": "#01689b"
82
64
  },
83
- "md": {
84
- "border-radius": "48px"
65
+ "color": "#01689b",
66
+ "text-decoration-color": "inherit",
67
+ "text-decoration-line": "underline",
68
+ "text-decoration-thickness": "0.0625em",
69
+ "text-underline-offset": "0.125rem",
70
+ "current": {
71
+ "cursor": "default"
85
72
  },
86
- "xl": {
87
- "border-radius": "96px"
73
+ "disabled": {
74
+ "color": "#334155",
75
+ "cursor": "disabled"
88
76
  },
89
- "border-width": "2px"
77
+ "hover": {
78
+ "text-decoration-line": "underline",
79
+ "text-decoration-thickness": "auto",
80
+ "color": "#01496c"
81
+ }
90
82
  },
91
- "color": {
92
- "primary": {
93
- "50": "#f2d9e7",
94
- "100": "#e5b3d0",
95
- "200": "#D88CB7",
96
- "300": "#CB66A0",
97
- "400": "#BE4088",
98
- "500": "#a90061",
99
- "hover": "#741344"
83
+ "paragraph": {
84
+ "lead": {
85
+ "color": "#0F172A",
86
+ "font-size": "1.5rem",
87
+ "font-weight": 400,
88
+ "line-height": "150%",
89
+ "margin-block-end": "0rem",
90
+ "margin-block-start": "0rem"
100
91
  },
101
- "focus": {
102
- "outline": "#000"
92
+ "color": "#0F172A",
93
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
94
+ "font-size": "1.25rem",
95
+ "font-weight": 400,
96
+ "line-height": "150%",
97
+ "margin-block-end": "0rem",
98
+ "margin-block-start": "0rem"
99
+ },
100
+ "heading": {
101
+ "level-1": {
102
+ "color": "#154273",
103
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
104
+ "font-size": "3.125rem",
105
+ "font-weight": 700,
106
+ "line-height": "125%",
107
+ "margin-block-end": "0rem",
108
+ "margin-block-start": "0rem"
103
109
  },
104
- "foreground": {
105
- "default": "#0F172A",
106
- "subdued": "#334155",
107
- "link": "#01689b",
108
- "on-dark-color": "#fff",
109
- "on-light-color": "#000",
110
- "onEmphasis": "#fff"
110
+ "level-2": {
111
+ "color": "#154273",
112
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
113
+ "font-size": "2.5rem",
114
+ "font-weight": 700,
115
+ "line-height": "125%",
116
+ "margin-block-end": "0rem",
117
+ "margin-block-start": "0rem"
111
118
  },
112
- "border": {
113
- "default": "#64748B",
114
- "subdued": "#94A3B8",
115
- "strong": "#0F172A"
119
+ "level-3": {
120
+ "color": "#154273",
121
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
122
+ "font-size": "1.875rem",
123
+ "font-weight": 700,
124
+ "line-height": "125%",
125
+ "margin-block-end": "0rem",
126
+ "margin-block-start": "0rem"
116
127
  },
117
- "canvas": "#fff",
118
- "feedback": {
119
- "success": {
120
- "default": "#39870c",
121
- "subdued": "#e1eddb"
122
- },
123
- "info": {
124
- "default": "#007bc7",
125
- "subdued": "#d9ebf7"
126
- },
127
- "error": {
128
- "default": "#d52b1e",
129
- "subdued": "#f9dfdd"
130
- },
131
- "warning": {
132
- "default": "#ffb612",
133
- "subdued": "#fff4db"
134
- }
128
+ "level-4": {
129
+ "color": "#154273",
130
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
131
+ "font-size": "1.5rem",
132
+ "font-weight": 700,
133
+ "line-height": "150%",
134
+ "margin-block-end": "0rem",
135
+ "margin-block-start": "0rem"
135
136
  },
136
- "accent": {
137
- "500": "#8fcae7"
137
+ "level-5": {
138
+ "color": "#154273",
139
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
140
+ "font-size": "1.25rem",
141
+ "font-weight": 700,
142
+ "line-height": "150%",
143
+ "margin-block-end": "0rem",
144
+ "margin-block-start": "0rem"
138
145
  },
139
- "accent-2": {
140
- "500": "#f092cd"
146
+ "level-6": {
147
+ "color": "#154273",
148
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
149
+ "font-size": "1.25rem",
150
+ "font-weight": 700,
151
+ "line-height": "150%",
152
+ "margin-block-end": "0rem",
153
+ "margin-block-start": "0rem"
154
+ }
155
+ },
156
+ "number-badge": {
157
+ "font-size": "1.25rem",
158
+ "line-height": "125%",
159
+ "min-block-size": "24px",
160
+ "min-inline-size": "24px",
161
+ "font-weight": 700,
162
+ "border-width": "0px",
163
+ "border-radius": "999px",
164
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
165
+ "background-color": "#a90061",
166
+ "border-color": "transparent",
167
+ "color": "#fff",
168
+ "padding-inline": "0.5rem",
169
+ "padding-block": "0.125rem"
170
+ }
171
+ },
172
+ "utrecht": {
173
+ "skip-link": {
174
+ "focus": {
175
+ "text-decoration": "None",
176
+ "border-color": "#a90061",
177
+ "border-width": "2px",
178
+ "border-style": "solid",
179
+ "background-color": "#fff",
180
+ "color": "#01689b"
141
181
  },
142
- "cool-grey": {
143
- "50": "#F8FAFC",
144
- "100": "#F1F5F9",
145
- "200": "#E2E8F0",
146
- "300": "#CBD5E1",
147
- "400": "#94A3B8",
148
- "500": "#64748B",
149
- "600": "#475569",
150
- "700": "#334155",
151
- "800": "#1E293B",
152
- "900": "#0F172A"
182
+ "border-color": "transparent",
183
+ "box-block-end-shadow": {
184
+ "color": "#0000001a",
185
+ "blur-radius": "48px",
186
+ "offset-x": 0,
187
+ "offset-y": "16px",
188
+ "spread-radius": 0
153
189
  },
154
- "lichtblauw": {
155
- "50": "#eef7fb",
156
- "100": "#ddeff8",
157
- "200": "#CCE7F4",
158
- "300": "#BCDFF0",
159
- "400": "#ABD7ED",
160
- "500": "#8fcae7"
190
+ "focus-visible": {
191
+ "outline-color": "#000",
192
+ "text-decoration": "underline"
161
193
  },
162
- "violet": {
163
- "50": "#f2d9e7",
164
- "100": "#e5b3d0",
165
- "200": "#D88CB7",
166
- "300": "#CB66A0",
167
- "400": "#BE4088",
168
- "500": "#a90061"
169
- },
170
- "paars": {
171
- "50": "#e3dce7",
172
- "100": "#c6b9cf",
173
- "200": "#A995B7",
174
- "300": "#8D729F",
175
- "400": "#714f87",
176
- "500": "#42145f"
177
- },
178
- "hemelblauw": {
179
- "50": "#d9ebf7",
180
- "100": "#b3d7ee",
181
- "200": "#8CC3E6",
182
- "300": "#66AFDD",
183
- "400": "#409CD5",
184
- "500": "#007bc7"
185
- },
186
- "donkerblauw": {
187
- "50": "#d9e8f0",
188
- "100": "#b3d2e1",
189
- "200": "#8CBBD2",
190
- "300": "#66A4C3",
191
- "400": "#408EB4",
192
- "500": "#01689b"
193
- },
194
- "mintgroen": {
195
- "50": "#eaf8f4",
196
- "100": "#d6f2e9",
197
- "200": "#C1EBDE",
198
- "300": "#ACE4D3",
199
- "400": "#98DDC8",
200
- "500": "#76d2b6"
201
- },
202
- "mosgroen": {
203
- "50": "#ebebd9",
204
- "100": "#d6d7b3",
205
- "200": "#C1C38C",
206
- "300": "#ADAF66",
207
- "400": "#999C40",
208
- "500": "#777b00"
209
- },
210
- "groen": {
211
- "50": "#e1eddb",
212
- "100": "#c4dbb6",
213
- "200": "#A5C991",
214
- "300": "#88B76D",
215
- "400": "#6AA549",
216
- "500": "#39870c"
217
- },
218
- "donkergroen": {
219
- "50": "#dfe6e1",
220
- "100": "#becdc3",
221
- "200": "#9DB4A4",
222
- "300": "#7D9B87",
223
- "400": "#5D8269",
224
- "500": "#275937"
225
- },
226
- "bruin": {
227
- "50": "#efeada",
228
- "100": "#dfd4b6",
229
- "200": "#CFBF90",
230
- "300": "#BFA96C",
231
- "400": "#AF9447",
232
- "500": "#94710a"
233
- },
234
- "donkerbruin": {
235
- "50": "#e8e0df",
236
- "100": "#d1c2be",
237
- "200": "#BAA39D",
238
- "300": "#A3847D",
239
- "400": "#8D665D",
240
- "500": "#673327"
194
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
195
+ "font-weight": 700,
196
+ "line-height": "150%",
197
+ "border-width": "2px",
198
+ "text-underline-offset": "0.125rem",
199
+ "font-size": "1.25rem",
200
+ "background-color": "#fff",
201
+ "color": "#01689b",
202
+ "min-block-size": "48px",
203
+ "min-inline-size": "48px",
204
+ "padding-block-end": "0.75rem",
205
+ "padding-block-start": "0.75rem",
206
+ "padding-inline-end": "1rem",
207
+ "padding-inline-start": "1rem",
208
+ "text-decoration": "underline"
209
+ },
210
+ "link-list": {
211
+ "item": {
212
+ "text-decoration": "None",
213
+ "column-gap": "0.5rem"
241
214
  },
242
- "geel": {
243
- "50": "#fefbdd",
244
- "100": "#fdf6bc",
245
- "200": "#FCF199",
246
- "300": "#FBED78",
247
- "400": "#FAE856",
248
- "500": "#f9e11e"
215
+ "margin-block-end": "0rem",
216
+ "margin-block-start": "0rem",
217
+ "row-gap": "0.5rem",
218
+ "icon": {
219
+ "inset-block-start": "0.188rem",
220
+ "size": "24px"
249
221
  },
250
- "donkergeel": {
251
- "50": "#fff4db",
252
- "100": "#ffe9b8",
253
- "200": "#FDDE94",
254
- "300": "#FDD370",
255
- "400": "#FDC84D",
256
- "500": "#ffb612"
222
+ "link": {
223
+ "column-gap": "0.5rem",
224
+ "text-decoration": "None"
257
225
  },
258
- "oranje": {
259
- "50": "#fbead9",
260
- "100": "#f6d4b3",
261
- "200": "#F1BE8C",
262
- "300": "#EDA966",
263
- "400": "#E89440",
264
- "500": "#e17000"
226
+ "font-weight": 400
227
+ },
228
+ "link": {
229
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
230
+ "font-weight": 400,
231
+ "line-height": "150%",
232
+ "font-size": "1.25rem",
233
+ "active": {
234
+ "text-decoration": "None",
235
+ "color": "#163f5b"
265
236
  },
266
- "rood": {
267
- "50": "#f9dfdd",
268
- "100": "#f2bfbc",
269
- "200": "#EC9F99",
270
- "300": "#E67F78",
271
- "400": "#DF6056",
272
- "500": "#d52b1e"
237
+ "focus": {
238
+ "text-decoration": "None",
239
+ "text-decoration-thickness": "auto",
240
+ "background-color": "transparent",
241
+ "color": "#01689b"
273
242
  },
274
- "roze": {
275
- "50": "#fdeff8",
276
- "100": "#fbdef0",
277
- "200": "#F8CEE8",
278
- "300": "#F6BDE1",
279
- "400": "#F4ADD9",
280
- "500": "#f092cd"
243
+ "icon": {
244
+ "inset-block-start": "0.25rem",
245
+ "size": "24px"
281
246
  },
282
- "robijnrood": {
283
- "50": "#f7d9e7",
284
- "100": "#efb3ce",
285
- "200": "#E78CB6",
286
- "300": "#DF669D",
287
- "400": "#D74085",
288
- "500": "#ca005d"
247
+ "color": "#01689b",
248
+ "text-decoration-color": "inherit",
249
+ "column-gap": "0.25rem",
250
+ "text-decoration": "underline",
251
+ "text-decoration-thickness": "0.0625em",
252
+ "text-underline-offset": "0.125rem",
253
+ "hover": {
254
+ "color": "#15496a",
255
+ "text-decoration": "underline",
256
+ "text-decoration-thickness": "0.1875em"
289
257
  },
290
- "lintblauw": {
291
- "50": "#dce3ea",
292
- "100": "#b8c6d5",
293
- "200": "#95a9c0",
294
- "300": "#738eab",
295
- "400": "#4f7196",
296
- "500": "#154273"
258
+ "focus-visible": {
259
+ "text-decoration": "None",
260
+ "text-decoration-thickness": "0.0625em"
297
261
  },
298
- "wit": "#fff",
299
- "zwart": "#000",
300
- "none": "transparent"
301
- },
302
- "border-radius": {
303
- "sm": 0,
304
- "md": 0,
305
- "keep": 0,
306
- "circle": "999px",
307
- "none": "0px"
308
- },
309
- "sub-nav-bar": {
310
- "background-color": "#f2f4f6",
311
- "column-gap": "0.5rem",
312
- "column-width": "375px",
313
- "padding-block-end": "2rem",
314
- "padding-block-start": "2rem",
315
- "inline-size": "100%",
316
- "content": {
317
- "padding-inline-end": "1rem",
318
- "padding-inline-start": "1rem",
319
- "max-inline-size": "1280px",
320
- "list": {
321
- "row-gap": "0.5rem"
322
- }
262
+ "visited": {
263
+ "color": "#01689b"
323
264
  }
324
265
  },
325
- "toggletip": {
326
- "color": "#fff",
327
- "background-color": "#007bc7",
266
+ "data-badge": {
267
+ "background-color": "#f2d9e7",
268
+ "border-radius": "10px",
269
+ "color": "#a90061",
270
+ "padding-block": "0.125rem",
271
+ "padding-inline": "0.75rem"
272
+ },
273
+ "button": {
274
+ "background-color": "#0F172A",
328
275
  "border-color": "transparent",
329
276
  "border-radius": 0,
330
277
  "border-width": "1px",
278
+ "color": "#fff",
279
+ "column-gap": "0.5rem",
280
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
281
+ "font-size": "1.25rem",
282
+ "font-weight": 700,
283
+ "line-height": "150%",
284
+ "min-block-size": "48px",
285
+ "min-inline-size": "48px",
286
+ "padding-block-end": "0.5rem",
287
+ "padding-block-start": "0.5rem",
288
+ "padding-inline-end": "1rem",
289
+ "padding-inline-start": "1rem",
331
290
  "icon": {
332
- "size": "24px"
291
+ "size": "24px",
292
+ "gap": "0.5rem"
293
+ },
294
+ "pressed": {
295
+ "background-color": "#1E293B",
296
+ "border-color": "transparent",
297
+ "color": "#fff"
333
298
  },
334
- "size": "24px",
335
299
  "active": {
336
- "color": "#007bc7",
337
- "background-color": "#fff",
338
- "border-color": "#007bc7"
300
+ "background-color": "#1E293B",
301
+ "border-color": "transparent",
302
+ "color": "#fff"
303
+ },
304
+ "disabled": {
305
+ "background-color": "#E2E8F0",
306
+ "border-color": "transparent",
307
+ "color": "#94A3B8"
339
308
  },
340
309
  "hover": {
341
- "color": "#0F172A",
342
- "background-color": "#66AFDD"
310
+ "background-color": "#475569",
311
+ "border-color": "transparent",
312
+ "color": "#fff"
343
313
  },
344
314
  "focus": {
315
+ "background-color": "#475569",
316
+ "border-color": "transparent",
317
+ "color": "#fff"
318
+ },
319
+ "primary-action": {
320
+ "background-color": "#a90061",
321
+ "border-color": "transparent",
345
322
  "color": "#fff",
346
- "background-color": "#007bc7"
347
- }
348
- },
349
- "sidenav": {
350
- "display": "flex",
351
- "link": {
352
- "line-height": "150%",
353
- "icon": {
354
- "size": "24px",
355
- "margin-inline": "0.5rem"
356
- },
357
323
  "font-size": "1.25rem",
358
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
359
- "font-weight": 400,
360
- "current": {
361
- "font-weight": 700,
362
- "color": "#0F172A"
324
+ "font-weight": 700,
325
+ "line-height": "1.875rem",
326
+ "disabled": {
327
+ "background-color": "#e5b3d0",
328
+ "border-color": "transparent",
329
+ "color": "#BE4088"
363
330
  },
364
- "color": "#01689b",
365
- "active": {
366
- "color": "#42145f",
367
- "text-decoration": "underline"
331
+ "hover": {
332
+ "background-color": "#741344",
333
+ "border-color": "transparent",
334
+ "color": "#fff"
368
335
  },
369
336
  "focus": {
370
- "border-radius": 0,
371
- "border-width": "2px",
372
- "border-style": "solid",
373
- "border-color": "#a90061",
374
- "background-color": "none",
375
- "color": "#01689b",
376
- "text-decoration": "None"
337
+ "background-color": "#741344",
338
+ "border-color": "transparent",
339
+ "color": "#fff"
377
340
  },
378
- "hover": {
379
- "color": "#15496a",
380
- "text-decoration": "underline"
341
+ "pressed": {
342
+ "border-color": "transparent",
343
+ "color": "#fff",
344
+ "background-color": "#63143a"
381
345
  },
382
- "padding-block-start": "0.75rem",
383
- "padding-block-end": "0.75rem",
384
- "text-decoration": "None",
385
- "column-gap": "0.5rem"
386
- }
387
- },
388
- "radio-group": {
389
- "padding-block-end": "0.5rem",
390
- "padding-block-start": "0.5rem",
391
- "row-gap": "1rem"
392
- },
393
- "navigation-list": {
394
- "icon": {
395
- "background-color": "#0F172A",
396
- "border-radius": "999px",
397
- "color": "#fff"
346
+ "active": {
347
+ "border-color": "transparent",
348
+ "color": "#fff",
349
+ "background-color": "#65003a"
350
+ }
398
351
  },
399
- "item": {
400
- "icon": {
401
- "padding-inline": "0.5rem",
402
- "padding-block": "0.5rem",
403
- "size": "24px"
352
+ "secondary-action": {
353
+ "background-color": "transparent",
354
+ "border-color": "#a90061",
355
+ "color": "#a90061",
356
+ "font-size": "1.25rem",
357
+ "font-weight": 700,
358
+ "line-height": "1.875rem",
359
+ "disabled": {
360
+ "background-color": "transparent",
361
+ "border-color": "#D88CB7",
362
+ "color": "#CB66A0"
404
363
  },
405
- "content": {
406
- "font-size": "1.25rem",
407
- "column-gap": "0.5rem",
408
- "row-gap": "0.25rem"
364
+ "hover": {
365
+ "background-color": "#f2d9e7",
366
+ "border-color": "#741344",
367
+ "color": "#741344"
409
368
  },
410
- "label": {
411
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
412
- "font-size": "1.875rem",
413
- "font-weight": 700,
414
- "line-height": "150%"
369
+ "focus": {
370
+ "background-color": "#f2d9e7",
371
+ "border-color": "transparent",
372
+ "color": "#741344"
373
+ },
374
+ "pressed": {
375
+ "background-color": "#e5b3d0",
376
+ "border-color": "#63143a",
377
+ "color": "#63143a"
415
378
  },
416
379
  "active": {
417
- "background-color": "#F1F5F9"
380
+ "background-color": "#D88CB7",
381
+ "color": "#741344",
382
+ "border-color": "#63143a"
383
+ }
384
+ },
385
+ "subtle": {
386
+ "background-color": "transparent",
387
+ "border-color": "transparent",
388
+ "color": "#a90061",
389
+ "font-size": "1.25rem",
390
+ "font-weight": 700,
391
+ "line-height": "1.875rem",
392
+ "disabled": {
393
+ "background-color": "transparent",
394
+ "border-color": "transparent",
395
+ "color": "#e5b3d0"
418
396
  },
419
397
  "hover": {
420
- "background-color": "#F8FAFC"
398
+ "background-color": "#f2d9e7",
399
+ "border-color": "transparent",
400
+ "color": "#741344"
421
401
  },
422
402
  "focus": {
423
- "background-color": "#f2d9e7"
403
+ "background-color": "#f2d9e7",
404
+ "border-color": "transparent",
405
+ "color": "#741344"
424
406
  },
425
- "background-color": "#fff",
426
- "color": "#334155",
427
- "border-width": "1px",
428
- "border-color": "#CBD5E1",
429
- "heading": {
430
- "color": "#0F172A"
407
+ "pressed": {
408
+ "background-color": "#e5b3d0",
409
+ "border-color": "transparent",
410
+ "color": "#63143a"
431
411
  },
432
- "column-gap": "1rem",
433
- "min-height": "48px",
434
- "padding-block": "0.75rem",
435
- "padding-inline": "1rem"
412
+ "active": {
413
+ "background-color": "#D88CB7",
414
+ "border-color": "transparent",
415
+ "color": "#65003a"
416
+ }
436
417
  }
437
418
  },
438
- "nav-bar": {
439
- "border-block-end-width": "1px",
440
- "max-inline-size": "1280px",
441
- "padding-inline": "1rem",
442
- "container": {
443
- "inline-size": "100%"
444
- },
445
- "content": {
446
- "column-gap": "1rem"
447
- },
448
- "icon": {
449
- "color": "#0F172A",
450
- "active": {
451
- "color": "#fff"
452
- },
419
+ "button-group": {
420
+ "margin-block-end": "0rem",
421
+ "margin-block-start": "0rem",
422
+ "background-color": "transparent",
423
+ "column-gap": "0.5rem",
424
+ "padding-block-end": "0px",
425
+ "padding-block-start": "0px",
426
+ "row-gap": "0.5rem"
427
+ },
428
+ "breadcrumb-nav": {
429
+ "divider": {
430
+ "color": "#334155",
431
+ "inset-block-start": 0,
453
432
  "size": "24px"
454
433
  },
455
434
  "link": {
435
+ "padding-block-end": "0.75rem",
436
+ "padding-block-start": "0.75rem",
437
+ "padding-inline-end": "0rem",
438
+ "padding-inline-start": "0rem",
439
+ "current": {
440
+ "color": "#334155",
441
+ "font-weight": 400
442
+ },
443
+ "icon": {
444
+ "inset-block-start": 0,
445
+ "margin-inline": "0.25rem",
446
+ "size": "24px"
447
+ },
448
+ "color": "#01689b",
449
+ "text-decoration": "underline",
456
450
  "active": {
457
- "background-color": "#a90061",
458
- "color": "#fff"
451
+ "color": "#163f5b",
452
+ "text-decoration": "underline"
453
+ },
454
+ "disabled": {
455
+ "color": "#334155"
459
456
  },
460
- "background-color": "#fff",
461
- "color": "#a90061",
462
457
  "focus": {
463
- "background-color": "#f2d9e7",
464
- "color": "#a90061"
458
+ "background-color": "transparent",
459
+ "color": "#01689b",
460
+ "text-decoration": "None"
465
461
  },
466
462
  "hover": {
467
- "background-color": "#F8FAFC",
468
- "color": "#a90061"
469
- },
470
- "padding-block-end": "1rem",
471
- "padding-block-start": "1rem",
472
- "padding-inline-end": "0.75rem",
473
- "padding-inline-start": "0.75rem",
474
- "column-gap": "0.5rem"
475
- },
476
- "heading": {
477
- "font-weight": 700
463
+ "text-decoration": "underline",
464
+ "color": "#01496c"
465
+ }
478
466
  },
479
- "background-color": "#fff",
480
- "color": "#a90061",
481
- "border-color": "#BE4088"
482
- },
483
- "message-list": {
467
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
468
+ "font-size": "1.25rem",
469
+ "line-height": "150%",
470
+ "min-block-size": "48px",
484
471
  "item": {
485
- "background-color": "#fff",
486
- "border-color": "#CBD5E1",
487
- "border-width": "1px",
472
+ "padding-block-end": "0.5rem",
473
+ "padding-block-start": "0.5rem",
474
+ "padding-inline-end": "0.5rem",
475
+ "padding-inline-start": "0.5rem",
476
+ "first": {
477
+ "padding-inline-start": "0rem"
478
+ }
479
+ },
480
+ "separator": {
488
481
  "color": "#334155",
489
- "column-gap": "1rem",
490
482
  "icon": {
491
- "size": "24px",
492
- "color": "#0F172A"
493
- },
494
- "min-height": "48px",
495
- "padding-block": "0.75rem",
496
- "padding-inline": "1rem",
497
- "content": {
498
- "font-size": "1.25rem",
499
- "column-gap": "0.5rem",
500
- "row-gap": "0.5rem"
501
- },
502
- "label": {
503
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
504
- "font-size": "1.25rem",
505
- "font-weight": 700,
506
- "line-height": "150%"
507
- },
508
- "heading": {
509
- "color": "#0F172A"
483
+ "size": "24px"
510
484
  }
511
485
  }
512
486
  },
513
- "logo": {
514
- "image": {
515
- "background-color": "#fff",
516
- "inline-size": "48px",
517
- "block-size": "96px",
518
- "color": "#154273"
519
- },
520
- "title": {
521
- "font-weight": 600,
522
- "line-height": "1.063rem",
523
- "font-size": "0.913rem",
524
- "padding-block-start": "3.125rem"
487
+ "accordion": {
488
+ "panel": {
489
+ "border-color": "#94A3B8",
490
+ "border-width": 0,
491
+ "padding-block-end": "1.5rem",
492
+ "padding-block-start": "1rem",
493
+ "padding-inline-end": "1rem",
494
+ "padding-inline-start": "1rem"
525
495
  },
526
- "subtitle": {
527
- "font-weight": 400,
528
- "line-height": "1rem",
529
- "font-size": "0.775rem"
530
- },
531
- "column-gap": "12px",
532
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
533
- "color": "#154273"
534
- },
535
- "link-list-card": {
536
- "background-color": "#fff",
537
- "padding-block-start": "1.5rem",
538
- "padding-block-end": "1.5rem",
539
- "row-gap": "1rem",
540
- "padding-inline-start": "1.5rem",
541
- "padding-inline-end": "1.5rem"
542
- },
543
- "link-list": {
544
- "text-decoration": "None"
545
- },
546
- "icon-only-button": {
547
- "padding-block-end": "0.75rem",
548
- "padding-block-start": "0.75rem",
549
- "padding-inline-end": "0.75rem",
550
- "padding-inline-start": "0.75rem"
496
+ "button": {
497
+ "gap": "0.5rem",
498
+ "icon": {
499
+ "size": "24px"
500
+ },
501
+ "hover": {
502
+ "background-color": "#F8FAFC",
503
+ "border-color": "#94A3B8",
504
+ "color": "#0F172A"
505
+ },
506
+ "background-color": "#fff",
507
+ "border-color": "#94A3B8",
508
+ "border-width": 0,
509
+ "color": "#0F172A",
510
+ "focus": {
511
+ "background-color": "#f2d9e7",
512
+ "border-color": "#a90061",
513
+ "color": "#0F172A"
514
+ },
515
+ "active": {
516
+ "background-color": "#F1F5F9",
517
+ "border-color": "#94A3B8",
518
+ "color": "#0F172A",
519
+ "row-gap": 0
520
+ }
521
+ }
551
522
  },
552
- "hero": {
553
- "heading": {
554
- "font-weight": 700,
555
- "line-height": "125%",
556
- "font-size": "1.875rem",
557
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif"
523
+ "action": {
524
+ "activate": {
525
+ "cursor": "pointer"
558
526
  },
559
- "sub-heading": {
560
- "font-weight": 400,
561
- "line-height": "150%",
562
- "font-size": "1.25rem",
563
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif"
527
+ "busy": {
528
+ "cursor": "wait"
564
529
  },
565
- "message": {
566
- "background-color": "#a90061",
567
- "color": "#fff",
568
- "row-gap": "0.125rem",
569
- "padding-block-end": "1rem",
570
- "padding-inline-end": "1rem",
571
- "padding-inline-start": "1rem",
572
- "padding-block-start": "1rem",
573
- "border-radius": "20px",
574
- "inline-size": "90%"
530
+ "disabled": {
531
+ "cursor": "not-allowed"
575
532
  },
576
- "border-radius": "40px",
577
- "inline-size": "100%"
578
- },
579
- "form-field-radio-option": {
580
- "column-gap": "0.5rem",
581
- "font-weight": 400,
582
- "row-gap": "0.5rem",
583
- "label": {
584
- "margin-block-end": 0
533
+ "inert": {
534
+ "cursor": "default"
585
535
  },
586
- "input": {
587
- "margin": {
588
- "block-start": "0.25rem"
589
- }
536
+ "navigate": {
537
+ "cursor": "pointer"
538
+ },
539
+ "submit": {
540
+ "cursor": "pointer"
590
541
  }
591
542
  },
592
- "form-field-checkbox-option": {
593
- "column-gap": "0.5rem",
594
- "margin-block-end": 0
595
- },
596
- "page-footer": {
597
- "column-gap": "1.5rem",
598
- "column-width": "200px",
599
- "column": {
600
- "title": {
601
- "margin-block-end": "0.75rem"
602
- }
603
- },
604
- "content": {
605
- "max-inline-size": "1280px",
606
- "padding-inline-start": "1rem",
607
- "padding-inline-end": "1rem",
608
- "column-gap": "2rem"
609
- },
610
- "border-block-start-width": "2px",
611
- "border-block-start-color": "#CB66A0",
612
- "border-block-start-style": "solid",
613
- "outlined": {
614
- "background-color": "#fff",
615
- "color": "#a90061",
616
- "border-color": "#a90061"
543
+ "unordered-list": {
544
+ "color": "#0F172A",
545
+ "marker": {
546
+ "border-color": "#0F172A",
547
+ "color": "#0F172A"
617
548
  },
618
- "padding-block-start": "2.5rem",
619
- "padding-block-end": "2.5rem",
620
- "padding-inline-start": "2.5rem",
621
- "padding-inline-end": "2.5rem",
622
- "flex": {
623
- "direction": "column"
549
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
550
+ "font-weight": 400,
551
+ "font-size": "1.25rem",
552
+ "line-height": "150%",
553
+ "margin-block-end": "0.25rem",
554
+ "margin-block-start": "0.25rem",
555
+ "padding-inline-start": "1.5rem",
556
+ "item": {
557
+ "margin-block-end": "0.25rem",
558
+ "margin-block-start": "0.25rem",
559
+ "padding-inline-start": "0.5rem"
624
560
  }
625
561
  },
626
- "file-input": {
627
- "column-gap": "0.75rem",
628
- "row-gap": "0.75rem",
629
- "feedback": {
630
- "color": "#475569",
631
- "font-size": "1rem"
562
+ "ordered-list": {
563
+ "color": "#0F172A",
564
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
565
+ "font-weight": 400,
566
+ "margin-inline-start": "0.625rem",
567
+ "font-size": "1.25rem",
568
+ "line-height": "150%",
569
+ "margin-block-end": "0.25rem",
570
+ "margin-block-start": "0.25rem",
571
+ "padding-inline-start": "1.5rem",
572
+ "item": {
573
+ "margin-block-end": "0.25rem",
574
+ "margin-block-start": "0.25rem",
575
+ "padding-inline-start": "0.5rem"
632
576
  }
633
577
  },
634
- "file": {
635
- "border-style": "solid",
578
+ "blockquote": {
579
+ "background-color": "transparent",
580
+ "border-inline-start-width": "12px",
636
581
  "border-color": "#a90061",
637
- "border-width": "1px",
638
582
  "border-radius": 0,
639
- "padding-inline-start": "1rem",
640
- "padding-inline-end": "1rem",
641
- "padding-block-start": "0.75rem",
642
- "padding-block-end": "0.75rem",
643
- "column-gap": "0.25rem",
644
- "error": {
645
- "border-color": "#d52b1e"
583
+ "border-width": 0,
584
+ "color": "#154273",
585
+ "font-size": "1.25rem",
586
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
587
+ "padding-block-end": "1.5rem",
588
+ "padding-block-start": "1.5rem",
589
+ "padding-inline-end": "2.5rem",
590
+ "padding-inline-start": "2.5rem",
591
+ "row-gap": "0.75rem",
592
+ "attribution": {
593
+ "color": "#154273",
594
+ "font-size": "1.25rem"
646
595
  },
647
- "subtitle": {
648
- "color": "#64748B"
596
+ "content": {
597
+ "color": "#154273",
598
+ "font-size": "1.5rem",
599
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
600
+ "line-height": "150%",
601
+ "font-weight": 400
602
+ },
603
+ "caption": {
604
+ "font-size": "1.25rem",
605
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
606
+ "line-height": "150%",
607
+ "font-weight": 400,
608
+ "padding-block-start": "0.75rem",
609
+ "color": "#154273"
610
+ },
611
+ "margin-block-end": 0,
612
+ "margin-block-start": 0,
613
+ "margin-inline-end": 0,
614
+ "margin-inline-start": 0,
615
+ "border-block-start-width": 0,
616
+ "border-block-end-width": 0,
617
+ "border-inline-end-width": 0,
618
+ "border-start-start-radius": 0,
619
+ "border-start-end-radius": 0,
620
+ "border-end-start-radius": 0,
621
+ "border-end-end-radius": 0,
622
+ "blue-corner-border-variation": {
623
+ "border-color": "#a90061",
624
+ "border-block-end-width": "2px",
625
+ "border-inline-end-width": "2px",
626
+ "border-end-end-radius": "3rem"
627
+ },
628
+ "pink-background-variation": {
629
+ "background-color": "#F6BDE1",
630
+ "border-end-start-radius": "3rem",
631
+ "padding": "2.5rem"
632
+ },
633
+ "pink-left-border-variation": {
634
+ "border-color": "#F6BDE1",
635
+ "border-inline-start-width": "0.75rem",
636
+ "padding-inline-start": "2.5rem",
637
+ "padding-inline-end": "2.5rem",
638
+ "padding-block-start": "1.5rem",
639
+ "padding-block-end": "1.5rem"
640
+ },
641
+ "pink-corner-border-variation": {
642
+ "border-color": "#F6BDE1",
643
+ "border-block-start-width": "0.25rem",
644
+ "border-inline-start-width": "0.25rem",
645
+ "border-start-start-radius": "3rem",
646
+ "padding": "2.5rem"
649
647
  }
650
648
  },
651
- "dot-badge": {
652
- "border-radius": "999px",
653
- "color": "#d52b1e",
654
- "size": "12px"
655
- },
656
- "code-input": {
657
- "size": "48px"
649
+ "column-layout": {
650
+ "column-rule-color": "transparent",
651
+ "column-rule-width": "0px",
652
+ "column-width": "400px",
653
+ "gap": "0.75rem"
658
654
  },
659
- "code-input-group": {
660
- "column-gap": "0.5rem"
655
+ "icon": {
656
+ "color": "inherit",
657
+ "size": "24px",
658
+ "inset-block-start": "0rem"
661
659
  },
662
- "checkbox-group": {
660
+ "textbox": {
661
+ "border-radius": 0,
662
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
663
+ "font-size": "1.25rem",
664
+ "font-weight": 400,
665
+ "line-height": "150%",
666
+ "max-inline-size": "400px",
663
667
  "padding-block-end": "0.5rem",
664
668
  "padding-block-start": "0.5rem",
665
- "row-gap": "1rem"
666
- },
667
- "card-as-link": {
669
+ "padding-inline-end": "0.75rem",
670
+ "padding-inline-start": "0.75rem",
668
671
  "background-color": "#fff",
669
- "border-color": "#CBD5E1",
670
- "border-radius": 0,
671
- "border-width": "1px",
672
+ "border-color": "#a90061",
672
673
  "color": "#0F172A",
673
- "column-gap": "1rem",
674
- "inline-size": "328px",
675
- "icon": {
676
- "color": "#a90061",
677
- "size": "24px"
674
+ "invalid": {
675
+ "background-color": "#f9dfdd",
676
+ "border-color": "#d52b1e",
677
+ "color": "#0F172A",
678
+ "border-width": "1px"
678
679
  },
679
- "link": {
680
- "color": "#01689b",
681
- "text-decoration": "underline",
682
- "active": {
683
- "text-decoration": "none"
684
- },
685
- "hover": {
686
- "text-decoration": "none"
687
- },
688
- "focus": {
689
- "text-decoration": "none"
690
- }
680
+ "placeholder": {
681
+ "color": "#64748B"
691
682
  },
692
- "metadata": {
693
- "color": "#334155"
683
+ "border-block-end-width": "auto",
684
+ "border-width": "1px",
685
+ "focus": {
686
+ "border-width": "2px",
687
+ "background-color": "#fff",
688
+ "border-color": "#a90061",
689
+ "color": "#0F172A"
694
690
  },
695
- "padding-block-end": "1rem",
696
- "padding-block-start": "1rem",
697
- "padding-inline-end": "1rem",
698
- "padding-inline-start": "1rem",
699
- "row-gap": "0.75rem",
700
- "active": {
691
+ "disabled": {
692
+ "background-color": "#CBD5E1",
693
+ "border-color": "#94A3B8",
694
+ "color": "#475569"
695
+ },
696
+ "read-only": {
701
697
  "background-color": "#F1F5F9",
702
- "text-decoration": "underline"
698
+ "border-color": "transparent",
699
+ "color": "#0F172A"
703
700
  },
704
701
  "hover": {
705
- "background-color": "#F8FAFC",
706
- "text-decoration": "underline"
702
+ "border-width": "1px",
703
+ "background-color": "#fff",
704
+ "border-color": "#CB66A0",
705
+ "color": "#0F172A"
706
+ }
707
+ },
708
+ "textarea": {
709
+ "max-inline-size": "400px",
710
+ "padding-block-end": "0.5rem",
711
+ "padding-block-start": "0.5rem",
712
+ "padding-inline-end": "0.75rem",
713
+ "padding-inline-start": "0.75rem",
714
+ "background-color": "#fff",
715
+ "border-color": "#a90061",
716
+ "color": "#0F172A",
717
+ "invalid": {
718
+ "background-color": "#f9dfdd",
719
+ "border-color": "#d52b1e",
720
+ "color": "#0F172A",
721
+ "border-width": "1px"
722
+ },
723
+ "placeholder": {
724
+ "color": "#64748B"
707
725
  },
708
726
  "focus": {
709
- "background-color": "#f2d9e7",
710
- "text-decoration": "underline"
727
+ "background-color": "#fff",
728
+ "border-color": "#a90061",
729
+ "color": "#0F172A",
730
+ "border-width": "2px"
711
731
  },
712
- "full-bleed": {
713
- "background-color": "#000",
732
+ "disabled": {
733
+ "background-color": "#CBD5E1",
734
+ "border-color": "#94A3B8",
735
+ "color": "#475569"
736
+ },
737
+ "read-only": {
738
+ "background-color": "#F1F5F9",
714
739
  "border-color": "transparent",
715
- "color": "#fff",
716
- "opacity": 0.5
740
+ "color": "#0F172A"
717
741
  },
718
- "heading": {
719
- "color": "#a90061",
720
- "padding-block-start": "0.5rem",
721
- "font-size": "1.5rem",
722
- "font-weight": 700
742
+ "hover": {
743
+ "background-color": "#fff",
744
+ "border-color": "#CB66A0",
745
+ "color": "#0F172A",
746
+ "border-width": "1px"
723
747
  },
724
- "horizontal": {
725
- "background-color": "#a90061",
726
- "border-color": "transparent",
727
- "color": "#fff",
728
- "max-block-size": "96px",
729
- "padding-block-end": 0,
730
- "padding-block-start": 0,
748
+ "border-radius": 0,
749
+ "border-bottom-width": "1px",
750
+ "border-width": "1px",
751
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
752
+ "font-weight": 400,
753
+ "line-height": "150%",
754
+ "font-size": "1.25rem"
755
+ },
756
+ "table": {
757
+ "header-cell": {
758
+ "line-height": "150%",
759
+ "color": "#0F172A",
760
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
761
+ "font-weight": 700,
762
+ "font-size": "1.25rem"
763
+ },
764
+ "caption": {
765
+ "line-height": "125%",
766
+ "margin-block-end": "1.5rem",
767
+ "color": "#0F172A",
768
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
769
+ "font-weight": 700,
770
+ "font-size": "1.875rem"
771
+ },
772
+ "cell": {
773
+ "padding-block-end": "0.75rem",
774
+ "padding-block-start": "0.75rem",
731
775
  "padding-inline-end": "1rem",
732
776
  "padding-inline-start": "1rem",
733
- "heading": {
734
- "inline-size": "200px"
735
- }
736
- }
737
- },
738
- "focus": {
739
- "outline-offset": "0.125rem",
740
- "outline-style": "solid",
741
- "outline-width": "2px"
742
- },
743
- "font-size": {
744
- "heading": {
745
- "level-1": "3.125rem",
746
- "level-2": "2.5rem",
747
- "level-3": "1.875rem",
748
- "level-4": "1.5rem",
749
- "level-5": "1.25rem"
777
+ "line-height": "150%"
750
778
  },
751
- "body": {
752
- "intro": "1.5rem",
753
- "default": "1.25rem"
779
+ "data-cell": {
780
+ "color": "#0F172A",
781
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
782
+ "font-weight": 400,
783
+ "line-height": "150%",
784
+ "font-size": "1.25rem"
754
785
  },
755
- "xs": {
756
- "desktop": "1.25rem",
757
- "tablet": "1.125rem",
758
- "mobile": "1rem"
786
+ "header": {
787
+ "border-block-end-width": "2px",
788
+ "border-block-end-color": "#CBD5E1",
789
+ "background-color": "transparent"
759
790
  },
760
- "sm": {
761
- "desktop": "1.5rem",
762
- "tablet": "1.35rem",
763
- "mobile": "1.2rem"
791
+ "footer": {
792
+ "border-block-end-width": "1px",
793
+ "border-block-end-color": "#CBD5E1",
794
+ "background-color": "transparent"
764
795
  },
765
- "md": {
766
- "desktop": "1.875rem",
767
- "tablet": "1.688rem",
768
- "mobile": "1.5rem"
796
+ "row": {
797
+ "border-block-end-width": "1px",
798
+ "border-block-end-color": "#CBD5E1",
799
+ "background-color": "transparent"
769
800
  },
770
- "lg": {
771
- "desktop": "2.5rem",
772
- "tablet": "2.25rem",
773
- "mobile": "2rem"
801
+ "footer-cell": {
802
+ "font-weight": 700,
803
+ "font-size": "1.25rem",
804
+ "color": "#0F172A",
805
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
806
+ "line-height": "150%"
774
807
  },
775
- "xl": {
776
- "desktop": "3.125rem",
777
- "tablet": "2.813rem",
778
- "mobile": "2.5rem"
779
- }
780
- },
781
- "font-weight": {
782
- "default": 400,
783
- "strong": 700,
784
- "extra-bold": 800,
785
- "bold": 700,
786
- "semi-bold": 600,
787
- "regular": 400,
788
- "light": 300,
789
- "thin": 200
808
+ "container": {
809
+ "box-inline-end-shadow": {
810
+ "x": 0,
811
+ "y": "16px",
812
+ "blur": "48px",
813
+ "spread": 0,
814
+ "color": "#0000001a"
815
+ },
816
+ "box-inline-start-shadow": {
817
+ "x": 0,
818
+ "y": "16px",
819
+ "blur": "48px",
820
+ "spread": 0,
821
+ "color": "#0000001a"
822
+ }
823
+ },
824
+ "font-size": "1.25rem"
790
825
  },
791
- "line-height": {
792
- "body": "150%",
793
- "sm": "125%",
794
- "md": "150%"
826
+ "separator": {
827
+ "color": "#CBD5E1",
828
+ "block-size": "2px",
829
+ "margin-block-end": "0.75rem",
830
+ "margin-block-start": "0.75rem"
795
831
  },
796
- "size": {
797
- "target": "48px",
832
+ "select": {
833
+ "image-background-position": "right 0.5rem center",
798
834
  "icon": {
799
- "functional": "24px"
835
+ "size": "24px"
800
836
  },
801
- "quarter-lint": "12px",
802
- "half-lint": "24px",
803
- "lint": "48px",
804
- "2-lint": "96px",
805
- "3-lint": "1440px"
806
- },
807
- "font-family": {
808
- "primary": "'Fira Sans', Arial, Verdana, sans-serif",
809
- "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
810
- },
811
- "border-width": {
812
- "default": "1px",
813
- "m": "2px",
814
- "none": "0px"
815
- },
816
- "space": {
817
- "0": 0,
818
- "25": "0.125rem",
819
- "50": "0.25rem",
820
- "100": "0.5rem",
821
- "150": "0.75rem",
822
- "200": "1rem",
823
- "300": "1.5rem",
824
- "400": "2rem",
825
- "500": "2.5rem",
826
- "600": "3rem",
827
- "700": "3.5rem"
828
- }
829
- },
830
- "utrecht": {
831
- "blockquote": {
832
- "background-color": "transparent",
833
- "border-inline-start-width": "12px",
834
- "border-color": "#a90061",
835
- "border-radius": 0,
836
- "border-width": 0,
837
- "color": "#154273",
838
- "font-size": "1.25rem",
839
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
840
- "padding-block-end": "1.5rem",
841
- "padding-block-start": "1.5rem",
842
- "padding-inline-end": "2.5rem",
843
- "padding-inline-start": "2.5rem",
844
- "row-gap": "0.75rem",
845
- "attribution": {
846
- "color": "#154273",
847
- "font-size": "1.25rem"
848
- },
849
- "content": {
850
- "color": "#154273",
851
- "font-size": "1.5rem",
852
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
853
- "line-height": "150%",
854
- "font-weight": 400
855
- },
856
- "caption": {
857
- "font-size": "1.25rem",
858
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
859
- "line-height": "150%",
860
- "font-weight": 400,
861
- "padding-block-start": "0.75rem",
862
- "color": "#154273"
863
- },
864
- "margin-block-end": 0,
865
- "margin-block-start": 0,
866
- "margin-inline-end": 0,
867
- "margin-inline-start": 0,
868
- "border-block-start-width": 0,
869
- "border-block-end-width": 0,
870
- "border-inline-end-width": 0,
871
- "border-start-start-radius": 0,
872
- "border-start-end-radius": 0,
873
- "border-end-start-radius": 0,
874
- "border-end-end-radius": 0,
875
- "blue-corner-border-variation": {
876
- "border-color": "#a90061",
877
- "border-block-end-width": "2px",
878
- "border-inline-end-width": "2px",
879
- "border-end-end-radius": "3rem"
880
- },
881
- "pink-background-variation": {
882
- "background-color": "#F6BDE1",
883
- "border-end-start-radius": "3rem",
884
- "padding": "2.5rem"
885
- },
886
- "pink-left-border-variation": {
887
- "border-color": "#F6BDE1",
888
- "border-inline-start-width": "0.75rem",
889
- "padding-inline-start": "2.5rem",
890
- "padding-inline-end": "2.5rem",
891
- "padding-block-start": "1.5rem",
892
- "padding-block-end": "1.5rem"
893
- },
894
- "pink-corner-border-variation": {
895
- "border-color": "#F6BDE1",
896
- "border-block-start-width": "0.25rem",
897
- "border-inline-start-width": "0.25rem",
898
- "border-start-start-radius": "3rem",
899
- "padding": "2.5rem"
900
- }
901
- },
902
- "column-layout": {
903
- "column-rule-color": "transparent",
904
- "column-rule-width": "0px",
905
- "column-width": "400px",
906
- "gap": "0.75rem"
907
- },
908
- "icon": {
909
- "color": "inherit",
910
- "size": "24px",
911
- "inset-block-start": 0
912
- },
913
- "unordered-list": {
914
- "padding-inline-start": "1.5rem",
915
- "margin-block-end": "0.25rem",
916
- "margin-block-start": "0.25rem",
917
- "color": "#0F172A",
918
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
919
- "font-weight": 400,
920
- "font-size": "1.25rem",
921
- "line-height": "150%",
922
- "item": {
923
- "padding-inline-start": "0.5rem",
924
- "margin-block-end": "0.25rem",
925
- "margin-block-start": "0.25rem"
926
- },
927
- "marker": {
928
- "color": "#0F172A",
929
- "border-color": "#0F172A"
930
- }
931
- },
932
- "textbox": {
933
- "border-radius": 0,
934
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
935
- "font-size": "1.25rem",
936
- "font-weight": 400,
937
- "line-height": "150%",
938
- "max-inline-size": "400px",
939
- "padding-block-end": "0.5rem",
940
- "padding-block-start": "0.5rem",
941
- "padding-inline-end": "0.75rem",
942
- "padding-inline-start": "0.75rem",
943
837
  "background-color": "#fff",
944
838
  "border-color": "#a90061",
945
839
  "color": "#0F172A",
@@ -949,56 +843,56 @@
949
843
  "color": "#0F172A",
950
844
  "border-width": "1px"
951
845
  },
952
- "placeholder": {
953
- "color": "#64748B"
954
- },
955
- "border-block-end-width": "auto",
956
- "border-width": "1px",
957
846
  "focus": {
958
- "border-width": "2px",
959
847
  "background-color": "#fff",
960
848
  "border-color": "#a90061",
961
- "color": "#0F172A"
849
+ "color": "#0F172A",
850
+ "border-width": "2px"
962
851
  },
963
852
  "disabled": {
964
853
  "background-color": "#CBD5E1",
965
854
  "border-color": "#94A3B8",
966
855
  "color": "#475569"
967
856
  },
968
- "read-only": {
969
- "background-color": "#F1F5F9",
970
- "border-color": "transparent",
971
- "color": "#0F172A"
972
- },
973
857
  "hover": {
974
- "border-width": "1px",
975
858
  "background-color": "#fff",
976
859
  "border-color": "#CB66A0",
977
- "color": "#0F172A"
978
- }
979
- },
980
- "textarea": {
981
- "max-inline-size": "400px",
860
+ "color": "#0F172A",
861
+ "border-width": "1px"
862
+ },
982
863
  "padding-block-end": "0.5rem",
983
864
  "padding-block-start": "0.5rem",
984
865
  "padding-inline-end": "0.75rem",
985
866
  "padding-inline-start": "0.75rem",
867
+ "border-radius": 0,
868
+ "border-bottom-width": "auto",
869
+ "border-width": "1px",
870
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
871
+ "font-weight": 400,
872
+ "line-height": "150%",
873
+ "font-size": "1.25rem",
874
+ "max-inline-size": "400px"
875
+ },
876
+ "radio-button": {
877
+ "active": {
878
+ "border-width": "1px",
879
+ "background-color": "#fff",
880
+ "border-color": "#BE4088"
881
+ },
882
+ "size": "24px",
883
+ "dot": {
884
+ "size": "12px"
885
+ },
986
886
  "background-color": "#fff",
987
887
  "border-color": "#a90061",
988
- "color": "#0F172A",
989
888
  "invalid": {
990
889
  "background-color": "#f9dfdd",
991
890
  "border-color": "#d52b1e",
992
- "color": "#0F172A",
993
891
  "border-width": "1px"
994
892
  },
995
- "placeholder": {
996
- "color": "#64748B"
997
- },
998
893
  "focus": {
999
894
  "background-color": "#fff",
1000
895
  "border-color": "#a90061",
1001
- "color": "#0F172A",
1002
896
  "border-width": "2px"
1003
897
  },
1004
898
  "disabled": {
@@ -1006,190 +900,242 @@
1006
900
  "border-color": "#94A3B8",
1007
901
  "color": "#475569"
1008
902
  },
1009
- "read-only": {
1010
- "background-color": "#F1F5F9",
903
+ "checked": {
904
+ "background-color": "#a90061",
1011
905
  "border-color": "transparent",
1012
- "color": "#0F172A"
906
+ "color": "#fff",
907
+ "hover": {
908
+ "background-color": "#CB66A0",
909
+ "border-color": "transparent",
910
+ "color": "#fff",
911
+ "border-width": "1px"
912
+ },
913
+ "active": {
914
+ "background-color": "#BE4088",
915
+ "border-color": "transparent",
916
+ "color": "#fff",
917
+ "border-width": "1px"
918
+ },
919
+ "focus": {
920
+ "background-color": "#fff",
921
+ "border-color": "#a90061",
922
+ "color": "#a90061",
923
+ "border-width": "2px"
924
+ },
925
+ "disabled": {
926
+ "background-color": "#CBD5E1",
927
+ "border-color": "#94A3B8",
928
+ "color": "#475569"
929
+ },
930
+ "border-width": "1px"
1013
931
  },
1014
932
  "hover": {
1015
933
  "background-color": "#fff",
1016
934
  "border-color": "#CB66A0",
1017
- "color": "#0F172A",
1018
935
  "border-width": "1px"
1019
936
  },
1020
- "border-radius": 0,
1021
- "border-bottom-width": "1px",
1022
- "border-width": "1px",
937
+ "border-radius": "999px",
938
+ "border-width": "1px"
939
+ },
940
+ "pre-heading": {
941
+ "color": "#0F172A",
942
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
943
+ "font-weight": 700,
944
+ "line-height": "125%",
945
+ "font-size": "1rem"
946
+ },
947
+ "paragraph": {
948
+ "color": "#0F172A",
1023
949
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
950
+ "font-size": "1.25rem",
1024
951
  "font-weight": 400,
1025
952
  "line-height": "150%",
1026
- "font-size": "1.25rem"
1027
- },
1028
- "table": {
1029
- "header-cell": {
1030
- "line-height": "150%",
1031
- "color": "#0F172A",
1032
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1033
- "font-weight": 700,
1034
- "font-size": "1.25rem"
1035
- },
1036
- "caption": {
1037
- "line-height": "125%",
1038
- "margin-block-end": "1.5rem",
953
+ "lead": {
1039
954
  "color": "#0F172A",
1040
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1041
- "font-weight": 700,
1042
- "font-size": "1.875rem"
1043
- },
1044
- "cell": {
1045
- "padding-block-end": "0.75rem",
1046
- "padding-block-start": "0.75rem",
1047
- "padding-inline-end": "1rem",
1048
- "padding-inline-start": "1rem",
955
+ "font-size": "1.5rem",
956
+ "font-weight": 400,
1049
957
  "line-height": "150%"
1050
958
  },
1051
- "data-cell": {
959
+ "small": {
960
+ "font-size": "1.5rem",
1052
961
  "color": "#0F172A",
1053
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1054
962
  "font-weight": 400,
1055
- "line-height": "150%",
1056
- "font-size": "1.25rem"
1057
- },
1058
- "header": {
1059
- "border-block-end-width": "2px",
1060
- "border-block-end-color": "#CBD5E1",
1061
- "background-color": "transparent"
1062
- },
1063
- "footer": {
1064
- "border-block-end-width": "1px",
1065
- "border-block-end-color": "#CBD5E1",
1066
- "background-color": "transparent"
1067
- },
1068
- "row": {
1069
- "border-block-end-width": "1px",
1070
- "border-block-end-color": "#CBD5E1",
1071
- "background-color": "transparent"
1072
- },
1073
- "footer-cell": {
1074
- "font-weight": 700,
1075
- "font-size": "1.25rem",
1076
- "color": "#0F172A",
1077
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1078
963
  "line-height": "150%"
1079
964
  },
1080
- "container": {
1081
- "box-inline-end-shadow": {
1082
- "x": 0,
1083
- "y": "16px",
1084
- "blur": "48px",
1085
- "spread": 0,
1086
- "color": "#0000001a"
1087
- },
1088
- "box-inline-start-shadow": {
1089
- "x": 0,
1090
- "y": "16px",
1091
- "blur": "48px",
1092
- "spread": 0,
1093
- "color": "#0000001a"
1094
- }
1095
- },
1096
- "font-size": "1.25rem"
965
+ "margin-block-end": "0rem",
966
+ "margin-block-start": "0rem"
1097
967
  },
1098
- "skip-link": {
968
+ "heading-1": {
969
+ "color": "#154273",
970
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
971
+ "font-size": "3.125rem",
972
+ "font-weight": 700,
973
+ "line-height": "125%",
974
+ "margin-block-end": "0rem",
975
+ "margin-block-start": "0rem"
976
+ },
977
+ "heading-2": {
978
+ "color": "#154273",
979
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
980
+ "font-size": "2.5rem",
981
+ "font-weight": 700,
982
+ "line-height": "125%",
983
+ "margin-block-end": "0rem",
984
+ "margin-block-start": "0rem"
985
+ },
986
+ "heading-3": {
987
+ "color": "#154273",
988
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
989
+ "font-size": "1.875rem",
990
+ "font-weight": 700,
991
+ "line-height": "125%",
992
+ "margin-block-end": "0rem",
993
+ "margin-block-start": "0rem"
994
+ },
995
+ "heading-4": {
996
+ "color": "#154273",
997
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
998
+ "font-size": "1.5rem",
1099
999
  "font-weight": 700,
1000
+ "line-height": "150%",
1001
+ "margin-block-end": "0rem",
1002
+ "margin-block-start": "0rem"
1003
+ },
1004
+ "heading-5": {
1005
+ "color": "#154273",
1100
1006
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1101
1007
  "font-size": "1.25rem",
1008
+ "font-weight": 700,
1102
1009
  "line-height": "150%",
1103
- "min-block-size": "48px",
1104
- "min-inline-size": "48px",
1105
- "padding-block-end": "0.75rem",
1106
- "padding-block-start": "0.75rem",
1107
- "padding-inline-end": "1rem",
1108
- "padding-inline-start": "1rem",
1109
- "focus": {
1110
- "background-color": "#fff",
1111
- "border-color": "#a90061",
1112
- "border-style": "solid",
1113
- "border-width": "2px",
1114
- "color": "#0F172A",
1115
- "text-decoration": "None"
1116
- },
1117
- "focus-visible": {
1118
- "outline-color": "#000"
1119
- },
1120
- "background-color": "#a90061",
1121
- "border-color": "transparent",
1122
- "color": "#fff",
1123
- "border-width": "2px",
1124
- "box-block-end-shadow": {
1125
- "offset-x": 0,
1126
- "offset-y": "16px",
1127
- "blur-radius": "48px",
1128
- "spread-radius": 0,
1129
- "color": "#0000001a"
1130
- },
1131
- "text-decoration": "underline",
1132
- "text-underline-offset": "0.125rem"
1010
+ "margin-block-end": "0rem",
1011
+ "margin-block-start": "0rem"
1133
1012
  },
1134
- "separator": {
1135
- "color": "#CBD5E1",
1136
- "block-size": "2px",
1137
- "margin-block-end": "0.75rem",
1138
- "margin-block-start": "0.75rem"
1013
+ "heading-6": {
1014
+ "color": "#154273",
1015
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1016
+ "font-size": "1.25rem",
1017
+ "font-weight": 700,
1018
+ "line-height": "150%",
1019
+ "margin-block-end": "0rem",
1020
+ "margin-block-start": "0rem"
1139
1021
  },
1140
- "select": {
1141
- "image-background-position": "right 0.5rem center",
1022
+ "form-label": {
1023
+ "color": "#0F172A",
1024
+ "font-size": "1.25rem",
1025
+ "font-weight": 700
1026
+ },
1027
+ "form-field-label": {
1028
+ "color": "#0F172A",
1029
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1030
+ "font-size": "1.25rem",
1031
+ "font-weight": 700,
1032
+ "line-height": "150%"
1033
+ },
1034
+ "form-field-error-message": {
1142
1035
  "icon": {
1143
- "size": "24px"
1036
+ "size": "24px",
1037
+ "margin-inline-end": "0.5rem"
1144
1038
  },
1145
- "background-color": "#fff",
1146
- "border-color": "#a90061",
1147
- "color": "#0F172A",
1039
+ "color": "#d52b1e",
1040
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1041
+ "font-size": "1.25rem",
1042
+ "font-weight": 400,
1043
+ "margin-block-end": "0.5rem",
1044
+ "padding-block-end": "0.5rem"
1045
+ },
1046
+ "form-field-description": {
1047
+ "color": "#334155",
1048
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1049
+ "font-size": "1.25rem",
1050
+ "line-height": "150%",
1051
+ "margin-block-start": "-0.5rem",
1052
+ "margin-block-end": "0.5rem",
1053
+ "padding-block-end": "0.5rem"
1054
+ },
1055
+ "form-field": {
1056
+ "margin-block-start": "0.5rem",
1057
+ "margin-block-end": "0.5rem",
1148
1058
  "invalid": {
1149
- "background-color": "#f9dfdd",
1150
- "border-color": "#d52b1e",
1151
- "color": "#0F172A",
1152
- "border-width": "1px"
1059
+ "border-inline-start-color": "#d52b1e",
1060
+ "border-inline-start-width": "0px",
1061
+ "padding-inline-start": "0rem"
1153
1062
  },
1154
- "focus": {
1155
- "background-color": "#fff",
1156
- "border-color": "#a90061",
1157
- "color": "#0F172A",
1158
- "border-width": "2px"
1063
+ "label": {
1064
+ "margin-block-end": "0.5rem"
1159
1065
  },
1160
- "disabled": {
1161
- "background-color": "#CBD5E1",
1162
- "border-color": "#94A3B8",
1163
- "color": "#475569"
1066
+ "error-message": {
1067
+ "line-height": "normal"
1068
+ }
1069
+ },
1070
+ "page-footer": {
1071
+ "background-color": "#a90061",
1072
+ "color": "#fff",
1073
+ "padding-block-start": "3rem",
1074
+ "padding-block-end": "3rem",
1075
+ "padding-inline-start": "80px",
1076
+ "padding-inline-end": "80px"
1077
+ },
1078
+ "figure": {
1079
+ "caption": {
1080
+ "border-color": "#CBD5E1",
1081
+ "border-width": "4px",
1082
+ "color": "#a90061",
1083
+ "padding-block-end": "0.5rem",
1084
+ "padding-block-start": "0.5rem",
1085
+ "padding-inline-start": "1rem",
1086
+ "line-height": "150%",
1087
+ "font-size": "1.25rem"
1164
1088
  },
1165
- "hover": {
1166
- "background-color": "#fff",
1167
- "border-color": "#CB66A0",
1089
+ "img": {
1090
+ "border-end-end-radius": 0,
1091
+ "border-end-start-radius": 0,
1092
+ "border-start-end-radius": 0,
1093
+ "border-start-start-radius": 0
1094
+ }
1095
+ },
1096
+ "form-fieldset": {
1097
+ "legend": {
1168
1098
  "color": "#0F172A",
1169
- "border-width": "1px"
1099
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1100
+ "font-size": "1.25rem",
1101
+ "font-weight": 700,
1102
+ "line-height": "150%",
1103
+ "disabled": {
1104
+ "color": "#334155"
1105
+ }
1170
1106
  },
1171
- "padding-block-end": "0.5rem",
1172
- "padding-block-start": "0.5rem",
1173
- "padding-inline-end": "0.75rem",
1174
- "padding-inline-start": "0.75rem",
1175
- "border-radius": 0,
1176
- "border-bottom-width": "auto",
1177
- "border-width": "1px",
1178
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1179
- "font-weight": 400,
1180
- "line-height": "150%",
1107
+ "section": {
1108
+ "background-color": "transparent",
1109
+ "color": "#0F172A"
1110
+ },
1111
+ "invalid": {
1112
+ "border-inline-start": {
1113
+ "color": "#d52b1e"
1114
+ },
1115
+ "padding-inline-start": "0rem",
1116
+ "border-inline-start-width": "0px"
1117
+ }
1118
+ },
1119
+ "number-badge": {
1181
1120
  "font-size": "1.25rem",
1182
- "max-inline-size": "400px"
1121
+ "line-height": "125%",
1122
+ "min-block-size": "24px",
1123
+ "min-inline-size": "24px",
1124
+ "font-weight": 700,
1125
+ "border-width": "0px",
1126
+ "border-radius": "999px",
1127
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1128
+ "background-color": "#a90061",
1129
+ "border-color": "transparent",
1130
+ "color": "#fff",
1131
+ "padding-inline": "0.5rem",
1132
+ "padding-block": "0.125rem"
1183
1133
  },
1184
- "radio-button": {
1185
- "active": {
1186
- "border-width": "1px",
1187
- "background-color": "#fff",
1188
- "border-color": "#BE4088"
1189
- },
1134
+ "checkbox": {
1135
+ "border-radius": 0,
1190
1136
  "size": "24px",
1191
- "dot": {
1192
- "size": "12px"
1137
+ "icon": {
1138
+ "size": "24px"
1193
1139
  },
1194
1140
  "background-color": "#fff",
1195
1141
  "border-color": "#a90061",
@@ -1205,18 +1151,46 @@
1205
1151
  },
1206
1152
  "disabled": {
1207
1153
  "background-color": "#CBD5E1",
1208
- "border-color": "#94A3B8",
1209
- "color": "#475569"
1154
+ "border-color": "#94A3B8"
1210
1155
  },
1211
1156
  "checked": {
1212
1157
  "background-color": "#a90061",
1213
1158
  "border-color": "transparent",
1214
1159
  "color": "#fff",
1160
+ "border-width": "1px",
1161
+ "disabled": {
1162
+ "background-color": "#CBD5E1",
1163
+ "border-color": "#94A3B8",
1164
+ "color": "#475569"
1165
+ },
1166
+ "focus": {
1167
+ "border-width": "2px",
1168
+ "background-color": "#fff",
1169
+ "border-color": "#a90061",
1170
+ "color": "#a90061"
1171
+ },
1215
1172
  "hover": {
1173
+ "border-width": "1px",
1216
1174
  "background-color": "#CB66A0",
1217
1175
  "border-color": "transparent",
1218
- "color": "#fff",
1219
- "border-width": "1px"
1176
+ "color": "#fff"
1177
+ },
1178
+ "active": {
1179
+ "border-width": "1px",
1180
+ "background-color": "#BE4088",
1181
+ "border-color": "transparent",
1182
+ "color": "#fff"
1183
+ }
1184
+ },
1185
+ "indeterminate": {
1186
+ "background-color": "#a90061",
1187
+ "border-color": "transparent",
1188
+ "color": "#fff",
1189
+ "border-width": "1px",
1190
+ "disabled": {
1191
+ "background-color": "#CBD5E1",
1192
+ "border-color": "#94A3B8",
1193
+ "color": "#475569"
1220
1194
  },
1221
1195
  "active": {
1222
1196
  "background-color": "#BE4088",
@@ -1224,823 +1198,1005 @@
1224
1198
  "color": "#fff",
1225
1199
  "border-width": "1px"
1226
1200
  },
1201
+ "hover": {
1202
+ "background-color": "#CB66A0",
1203
+ "border-color": "transparent",
1204
+ "color": "#fff",
1205
+ "border-width": "1px"
1206
+ },
1227
1207
  "focus": {
1228
1208
  "background-color": "#fff",
1229
1209
  "border-color": "#a90061",
1230
1210
  "color": "#a90061",
1231
1211
  "border-width": "2px"
1232
- },
1233
- "disabled": {
1234
- "background-color": "#CBD5E1",
1235
- "border-color": "#94A3B8",
1236
- "color": "#475569"
1237
- },
1238
- "border-width": "1px"
1212
+ }
1239
1213
  },
1214
+ "border-width": "1px",
1240
1215
  "hover": {
1216
+ "border-width": "1px",
1241
1217
  "background-color": "#fff",
1242
- "border-color": "#CB66A0",
1243
- "border-width": "1px"
1218
+ "border-color": "#CB66A0"
1244
1219
  },
1245
- "border-radius": "999px",
1246
- "border-width": "1px"
1247
- },
1248
- "pre-heading": {
1249
- "color": "#0F172A",
1250
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1251
- "font-weight": 700,
1252
- "line-height": "125%",
1253
- "font-size": "1rem"
1254
- },
1255
- "paragraph": {
1256
- "color": "#0F172A",
1257
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1258
- "font-size": "1.25rem",
1259
- "font-weight": 400,
1260
- "line-height": "150%",
1261
- "margin-block-end": 0,
1262
- "margin-block-start": 0,
1263
- "lead": {
1264
- "color": "#0F172A",
1265
- "font-size": "1.5rem",
1266
- "font-weight": 400,
1267
- "line-height": "150%"
1220
+ "active": {
1221
+ "border-width": "1px",
1222
+ "background-color": "#fff",
1223
+ "border-color": "#BE4088"
1268
1224
  }
1269
1225
  },
1270
- "ordered-list": {
1271
- "padding-inline-start": "1.5rem",
1272
- "margin-block-end": "0.25rem",
1273
- "margin-block-start": "0.25rem",
1274
- "margin-inline-start": "0.625rem",
1275
- "item": {
1276
- "padding-inline-start": 0,
1277
- "margin-block-end": "0.25rem",
1278
- "margin-block-start": "0.25rem"
1279
- },
1280
- "color": "#0F172A",
1281
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1282
- "font-weight": 400,
1283
- "font-size": "1.25rem",
1284
- "line-height": "150%"
1226
+ "article": {
1227
+ "max-inline-size": "75ch"
1285
1228
  },
1286
- "link-list": {
1287
- "margin-block-start": 0,
1288
- "row-gap": "0.5rem",
1289
- "margin-block-end": 0,
1290
- "item": {
1291
- "column-gap": "0.5rem",
1292
- "text-decoration": "None"
1229
+ "alert": {
1230
+ "heading": {
1231
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1232
+ "font-weight": 700,
1233
+ "line-height": "150%",
1234
+ "font-size": "1.25rem"
1293
1235
  },
1294
- "icon": {
1295
- "size": "24px",
1296
- "inset-block-start": "0.188rem"
1297
- }
1298
- },
1299
- "link": {
1300
- "color": "#01689b",
1301
- "text-decoration-color": "#01689b",
1302
- "active": {
1303
- "color": "#42145f",
1304
- "text-decoration": "None"
1236
+ "column-gap": "0.5rem",
1237
+ "border-width": "0px",
1238
+ "margin-block-end": "0.75rem",
1239
+ "margin-block-start": "0.75rem",
1240
+ "padding-block-end": "1rem",
1241
+ "padding-block-start": "1rem",
1242
+ "padding-inline-end": "1rem",
1243
+ "padding-inline-start": "1rem",
1244
+ "background-color": "#d9ebf7",
1245
+ "border-color": "transparent",
1246
+ "color": "#000",
1247
+ "info": {
1248
+ "background-color": "#d9ebf7",
1249
+ "border-color": "transparent",
1250
+ "color": "#000"
1305
1251
  },
1306
- "focus": {
1307
- "background-color": "transparent",
1308
- "color": "#01689b",
1309
- "text-decoration": "None",
1310
- "text-decoration-thickness": "auto"
1252
+ "error": {
1253
+ "background-color": "#f9dfdd",
1254
+ "border-color": "transparent",
1255
+ "color": "#000"
1311
1256
  },
1312
- "hover": {
1313
- "color": "#01496c",
1314
- "text-decoration": "None",
1315
- "text-decoration-thickness": "auto"
1257
+ "ok": {
1258
+ "background-color": "#e1eddb",
1259
+ "border-color": "transparent",
1260
+ "color": "#000"
1316
1261
  },
1317
- "visited": {
1318
- "color": "#42145f"
1262
+ "warning": {
1263
+ "background-color": "#fff4db",
1264
+ "border-color": "transparent",
1265
+ "color": "#000"
1319
1266
  },
1320
- "text-decoration": "underline",
1321
1267
  "icon": {
1322
- "inset-block-start": "0.25rem",
1268
+ "inset-block-start": "3px",
1269
+ "info": {
1270
+ "color": "#007bc7"
1271
+ },
1272
+ "error": {
1273
+ "color": "#d52b1e"
1274
+ },
1275
+ "ok": {
1276
+ "color": "#39870c"
1277
+ },
1278
+ "warning": {
1279
+ "color": "#ffb612"
1280
+ },
1323
1281
  "size": "24px"
1324
1282
  },
1325
- "column-gap": "0.25rem",
1326
- "text-decoration-thickness": "auto",
1327
- "text-underline-offset": "0.125rem",
1328
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1329
- "font-weight": 400,
1330
- "font-size": "1.25rem",
1331
- "line-height": "150%"
1332
- },
1333
- "heading-1": {
1334
- "color": "#154273",
1335
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1336
- "font-weight": 700,
1337
- "line-height": "125%",
1338
- "font-size": "3.125rem",
1339
- "margin-block-end": 0,
1340
- "margin-block-start": 0
1341
- },
1342
- "heading-2": {
1343
- "color": "#154273",
1344
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1345
- "font-weight": 700,
1346
- "line-height": "125%",
1347
- "font-size": "2.5rem",
1348
- "margin-block-end": 0,
1349
- "margin-block-start": 0
1350
- },
1351
- "heading-3": {
1352
- "color": "#154273",
1353
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1354
- "font-weight": 700,
1355
- "line-height": "125%",
1356
- "font-size": "1.875rem",
1357
- "margin-block-end": 0,
1358
- "margin-block-start": 0
1359
- },
1360
- "heading-4": {
1361
- "color": "#154273",
1362
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1363
- "font-weight": 700,
1364
- "line-height": "125%",
1365
- "font-size": "1.5rem",
1366
- "margin-block-end": 0,
1367
- "margin-block-start": 0
1368
- },
1369
- "heading-5": {
1370
- "color": "#154273",
1371
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1372
- "font-weight": 700,
1373
- "line-height": "125%",
1374
- "font-size": "1.25rem",
1375
- "margin-block-end": 0,
1376
- "margin-block-start": 0
1377
- },
1378
- "form-label": {
1379
- "color": "#0F172A",
1380
- "font-size": "1.25rem",
1381
- "font-weight": 700
1283
+ "message": {
1284
+ "line-height": "150%",
1285
+ "column-gap": "0.5rem"
1286
+ },
1287
+ "border-radius": 0
1382
1288
  },
1383
- "form-field-label": {
1289
+ "document": {
1290
+ "background-color": "#fff",
1384
1291
  "color": "#0F172A",
1385
1292
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1386
1293
  "font-size": "1.25rem",
1387
- "font-weight": 700,
1388
- "line-height": "150%"
1294
+ "line-height": "150%",
1295
+ "font-weight": 400
1389
1296
  },
1390
- "form-field-error-message": {
1391
- "icon": {
1392
- "size": "24px",
1393
- "margin-inline-end": "0.5rem"
1297
+ "rich-text": {
1298
+ "stranger": {
1299
+ "margin-block-end": "2rem"
1394
1300
  },
1395
- "color": "#d52b1e",
1396
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1397
- "font-size": "1.25rem",
1398
- "font-weight": 400,
1399
- "margin-block-end": "0.5rem",
1400
- "padding-block-end": "0.5rem"
1301
+ "acquaintance": {
1302
+ "margin-block-end": "1rem"
1303
+ },
1304
+ "friend": {
1305
+ "margin-block-end": "0.5rem"
1306
+ },
1307
+ "best-friend": {
1308
+ "margin-block-end": "0.25rem"
1309
+ },
1310
+ "confidant": {
1311
+ "margin-block-end": "0rem"
1312
+ }
1401
1313
  },
1402
- "form-field-description": {
1403
- "color": "#334155",
1404
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1405
- "font-size": "1.25rem",
1406
- "line-height": "150%",
1407
- "margin-block-start": "-0.5rem",
1408
- "margin-block-end": "0.5rem",
1409
- "padding-block-end": "0.5rem"
1314
+ "pointer-target": {
1315
+ "min-size": "48px"
1410
1316
  },
1411
- "form-field": {
1412
- "margin-block-start": "0.5rem",
1413
- "margin-block-end": "0.5rem",
1414
- "invalid": {
1415
- "border-inline-start-color": "#d52b1e",
1416
- "border-inline-start-width": "0px",
1417
- "padding-inline-start": 0
1418
- },
1419
- "label": {
1420
- "margin-block-end": "0.5rem"
1421
- },
1422
- "error-message": {
1423
- "line-height": "normal"
1317
+ "focus": {
1318
+ "outline-color": "#000",
1319
+ "outline-offset": "0.125rem",
1320
+ "outline-style": "solid",
1321
+ "outline-width": "2px",
1322
+ "inverse": {
1323
+ "outline-color": "#fff"
1424
1324
  }
1325
+ }
1326
+ },
1327
+ "rhc": {
1328
+ "link-list": {
1329
+ "text-decoration": "None"
1425
1330
  },
1426
- "page-footer": {
1427
- "background-color": "#a90061",
1428
- "color": "#fff",
1429
- "padding-block-start": "3rem",
1430
- "padding-block-end": "3rem",
1431
- "padding-inline-start": "80px",
1432
- "padding-inline-end": "80px"
1331
+ "data-badge-button": {
1332
+ "column-gap": "0.125rem",
1333
+ "hover": {
1334
+ "background-color": "#a90061",
1335
+ "color": "#fff"
1336
+ }
1433
1337
  },
1434
- "figure": {
1435
- "caption": {
1436
- "border-color": "#CBD5E1",
1437
- "border-width": "4px",
1438
- "color": "#a90061",
1439
- "padding-block-end": "0.5rem",
1440
- "padding-block-start": "0.5rem",
1441
- "padding-inline-start": "1rem",
1442
- "line-height": "150%",
1443
- "font-size": "1.25rem"
1338
+ "keep": {
1339
+ "_comment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.",
1340
+ "top-left": {
1341
+ "borderRadiusTopLeft": "48px",
1342
+ "borderRadiusTopRight": 0,
1343
+ "borderRadiusBottomRight": 0,
1344
+ "borderRadiusBottomLeft": 0
1444
1345
  },
1445
- "img": {
1446
- "border-end-end-radius": 0,
1447
- "border-end-start-radius": 0,
1448
- "border-start-end-radius": 0,
1449
- "border-start-start-radius": 0
1346
+ "top-right": {
1347
+ "borderRadiusTopRight": "48px",
1348
+ "borderRadiusTopLeft": 0,
1349
+ "borderRadiusBottomRight": 0,
1350
+ "borderRadiusBottomLeft": 0
1351
+ },
1352
+ "bottom-right": {
1353
+ "borderRadiusTopLeft": 0,
1354
+ "borderRadiusTopRight": 0,
1355
+ "borderRadiusBottomRight": "48px",
1356
+ "borderRadiusBottomLeft": 0
1357
+ },
1358
+ "bottom-left": {
1359
+ "borderRadiusTopLeft": 0,
1360
+ "borderRadiusTopRight": 0,
1361
+ "borderRadiusBottomRight": 0,
1362
+ "borderRadiusBottomLeft": "48px"
1450
1363
  }
1451
1364
  },
1452
- "form-fieldset": {
1453
- "legend": {
1454
- "color": "#0F172A",
1365
+ "rounded-corner": {
1366
+ "xs": {
1367
+ "border-radius": "24px"
1368
+ },
1369
+ "md": {
1370
+ "border-radius": "48px"
1371
+ },
1372
+ "xl": {
1373
+ "border-radius": "96px"
1374
+ },
1375
+ "border-width": "2px"
1376
+ },
1377
+ "accordion": {
1378
+ "button": {
1455
1379
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1456
1380
  "font-size": "1.25rem",
1457
- "font-weight": 700,
1381
+ "font-weight": 400,
1458
1382
  "line-height": "150%",
1459
- "disabled": {
1460
- "color": "#334155"
1383
+ "icon": {
1384
+ "margin-block": "0.25rem"
1385
+ },
1386
+ "padding-block-end": "0.75rem",
1387
+ "padding-block-start": "0.75rem",
1388
+ "padding-inline-end": "1rem",
1389
+ "padding-inline-start": "1rem",
1390
+ "expanded": {
1391
+ "background-color": "#fff",
1392
+ "color": "#0F172A"
1461
1393
  }
1462
1394
  },
1463
1395
  "section": {
1464
- "background-color": "transparent",
1396
+ "border-block-end-width": "1px",
1397
+ "border-width": 0,
1398
+ "border-color": "#94A3B8"
1399
+ },
1400
+ "header": {
1401
+ "margin": 0
1402
+ },
1403
+ "border-radius": "0px",
1404
+ "color": "#0F172A"
1405
+ },
1406
+ "data-summary": {
1407
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1408
+ "item-value": {
1409
+ "font-weight": 400,
1410
+ "row": {
1411
+ "padding-block-end": "0.75rem",
1412
+ "padding-block-start": "0.75rem",
1413
+ "padding-inline-end": "0rem",
1414
+ "padding-inline-start": "0px"
1415
+ },
1416
+ "padding-block-end": "0.75rem",
1417
+ "padding-block-start": "0rem",
1418
+ "padding-inline-end": "0rem",
1419
+ "padding-inline-start": "0rem"
1420
+ },
1421
+ "item-key": {
1422
+ "font-weight": 700,
1423
+ "row": {
1424
+ "padding-block-end": "0.75rem",
1425
+ "padding-block-start": "0.75rem",
1426
+ "padding-inline-end": "1rem",
1427
+ "padding-inline-start": "0rem"
1428
+ },
1429
+ "padding-block-end": "0.25rem",
1430
+ "padding-block-start": "0.75rem",
1431
+ "padding-inline-end": "0rem",
1432
+ "padding-inline-start": "0rem"
1433
+ },
1434
+ "item": {
1435
+ "border-width": "1px",
1436
+ "border-color": "#CBD5E1",
1437
+ "border-block-end-style": "solid",
1465
1438
  "color": "#0F172A"
1466
1439
  },
1467
- "invalid": {
1468
- "border-inline-start": {
1469
- "color": "#d52b1e"
1440
+ "font-size": "1.25rem",
1441
+ "line-height": "150%",
1442
+ "item-action": {
1443
+ "row": {
1444
+ "padding-block-end": "0.75rem",
1445
+ "padding-block-start": "0.75rem",
1446
+ "padding-inline-end": "0rem",
1447
+ "padding-inline-start": "1rem"
1470
1448
  },
1471
- "padding-inline-start": 0,
1472
- "border-inline-start-width": "0px"
1449
+ "padding-block-end": "0.75rem",
1450
+ "padding-block-start": "0.75rem",
1451
+ "padding-inline-end": "1rem",
1452
+ "padding-inline-start": "0rem"
1473
1453
  }
1474
1454
  },
1475
- "number-badge": {
1476
- "font-size": "1.25rem",
1477
- "line-height": "125%",
1478
- "min-block-size": "24px",
1479
- "min-inline-size": "24px",
1480
- "font-weight": 700,
1481
- "border-width": "0px",
1482
- "border-radius": "999px",
1483
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1484
- "background-color": "#a90061",
1485
- "border-color": "transparent",
1486
- "color": "#fff",
1487
- "padding-inline": "0.5rem",
1488
- "padding-block": "0.125rem"
1489
- },
1490
- "checkbox": {
1491
- "border-radius": 0,
1492
- "size": "24px",
1493
- "icon": {
1494
- "size": "24px"
1495
- },
1496
- "background-color": "#fff",
1497
- "border-color": "#a90061",
1498
- "invalid": {
1499
- "background-color": "#f9dfdd",
1500
- "border-color": "#d52b1e",
1501
- "border-width": "1px"
1455
+ "color": {
1456
+ "primary": {
1457
+ "50": "#f2d9e7",
1458
+ "100": "#e5b3d0",
1459
+ "200": "#D88CB7",
1460
+ "300": "#CB66A0",
1461
+ "400": "#BE4088",
1462
+ "500": "#a90061",
1463
+ "hover": "#741344"
1502
1464
  },
1503
1465
  "focus": {
1504
- "background-color": "#fff",
1505
- "border-color": "#a90061",
1506
- "border-width": "2px"
1466
+ "outline": "#000"
1507
1467
  },
1508
- "disabled": {
1509
- "background-color": "#CBD5E1",
1510
- "border-color": "#94A3B8"
1468
+ "foreground": {
1469
+ "default": "#0F172A",
1470
+ "subdued": "#334155",
1471
+ "link": "#01689b",
1472
+ "on-dark-color": "#fff",
1473
+ "on-light-color": "#000"
1511
1474
  },
1512
- "checked": {
1513
- "background-color": "#a90061",
1514
- "border-color": "transparent",
1515
- "color": "#fff",
1516
- "border-width": "1px",
1517
- "disabled": {
1518
- "background-color": "#CBD5E1",
1519
- "border-color": "#94A3B8",
1520
- "color": "#475569"
1475
+ "border": {
1476
+ "default": "#64748B",
1477
+ "subdued": "#94A3B8",
1478
+ "strong": "#0F172A"
1479
+ },
1480
+ "canvas": "#fff",
1481
+ "feedback": {
1482
+ "success": {
1483
+ "default": "#39870c",
1484
+ "subdued": "#e1eddb"
1521
1485
  },
1522
- "focus": {
1523
- "border-width": "2px",
1524
- "background-color": "#fff",
1525
- "border-color": "#a90061",
1526
- "color": "#a90061"
1486
+ "info": {
1487
+ "default": "#007bc7",
1488
+ "subdued": "#d9ebf7"
1527
1489
  },
1528
- "hover": {
1529
- "border-width": "1px",
1530
- "background-color": "#CB66A0",
1531
- "border-color": "transparent",
1532
- "color": "#fff"
1490
+ "error": {
1491
+ "default": "#d52b1e",
1492
+ "subdued": "#f9dfdd"
1533
1493
  },
1534
- "active": {
1535
- "border-width": "1px",
1536
- "background-color": "#BE4088",
1537
- "border-color": "transparent",
1538
- "color": "#fff"
1494
+ "warning": {
1495
+ "default": "#ffb612",
1496
+ "subdued": "#fff4db"
1539
1497
  }
1540
1498
  },
1541
- "indeterminate": {
1542
- "background-color": "#a90061",
1543
- "border-color": "transparent",
1499
+ "accent": {
1500
+ "500": "#8fcae7"
1501
+ },
1502
+ "accent-2": {
1503
+ "500": "#f092cd"
1504
+ },
1505
+ "cool-grey": {
1506
+ "50": "#F8FAFC",
1507
+ "100": "#F1F5F9",
1508
+ "200": "#E2E8F0",
1509
+ "300": "#CBD5E1",
1510
+ "400": "#94A3B8",
1511
+ "500": "#64748B",
1512
+ "600": "#475569",
1513
+ "700": "#334155",
1514
+ "800": "#1E293B",
1515
+ "900": "#0F172A"
1516
+ },
1517
+ "lichtblauw": {
1518
+ "50": "#eef7fb",
1519
+ "100": "#ddeff8",
1520
+ "200": "#CCE7F4",
1521
+ "300": "#BCDFF0",
1522
+ "400": "#ABD7ED",
1523
+ "500": "#8fcae7"
1524
+ },
1525
+ "violet": {
1526
+ "50": "#f2d9e7",
1527
+ "100": "#e5b3d0",
1528
+ "200": "#D88CB7",
1529
+ "300": "#CB66A0",
1530
+ "400": "#BE4088",
1531
+ "500": "#a90061"
1532
+ },
1533
+ "paars": {
1534
+ "50": "#e3dce7",
1535
+ "100": "#c6b9cf",
1536
+ "200": "#A995B7",
1537
+ "300": "#8D729F",
1538
+ "400": "#714f87",
1539
+ "500": "#42145f"
1540
+ },
1541
+ "hemelblauw": {
1542
+ "50": "#d9ebf7",
1543
+ "100": "#b3d7ee",
1544
+ "200": "#8CC3E6",
1545
+ "300": "#66AFDD",
1546
+ "400": "#409CD5",
1547
+ "500": "#007bc7"
1548
+ },
1549
+ "donkerblauw": {
1550
+ "50": "#d9e8f0",
1551
+ "100": "#b3d2e1",
1552
+ "200": "#8CBBD2",
1553
+ "300": "#66A4C3",
1554
+ "400": "#408EB4",
1555
+ "500": "#01689b"
1556
+ },
1557
+ "mintgroen": {
1558
+ "50": "#eaf8f4",
1559
+ "100": "#d6f2e9",
1560
+ "200": "#C1EBDE",
1561
+ "300": "#ACE4D3",
1562
+ "400": "#98DDC8",
1563
+ "500": "#76d2b6"
1564
+ },
1565
+ "mosgroen": {
1566
+ "50": "#ebebd9",
1567
+ "100": "#d6d7b3",
1568
+ "200": "#C1C38C",
1569
+ "300": "#ADAF66",
1570
+ "400": "#999C40",
1571
+ "500": "#777b00"
1572
+ },
1573
+ "groen": {
1574
+ "50": "#e1eddb",
1575
+ "100": "#c4dbb6",
1576
+ "200": "#A5C991",
1577
+ "300": "#88B76D",
1578
+ "400": "#6AA549",
1579
+ "500": "#39870c"
1580
+ },
1581
+ "donkergroen": {
1582
+ "50": "#dfe6e1",
1583
+ "100": "#becdc3",
1584
+ "200": "#9DB4A4",
1585
+ "300": "#7D9B87",
1586
+ "400": "#5D8269",
1587
+ "500": "#275937"
1588
+ },
1589
+ "bruin": {
1590
+ "50": "#efeada",
1591
+ "100": "#dfd4b6",
1592
+ "200": "#CFBF90",
1593
+ "300": "#BFA96C",
1594
+ "400": "#AF9447",
1595
+ "500": "#94710a"
1596
+ },
1597
+ "donkerbruin": {
1598
+ "50": "#e8e0df",
1599
+ "100": "#d1c2be",
1600
+ "200": "#BAA39D",
1601
+ "300": "#A3847D",
1602
+ "400": "#8D665D",
1603
+ "500": "#673327"
1604
+ },
1605
+ "geel": {
1606
+ "50": "#fefbdd",
1607
+ "100": "#fdf6bc",
1608
+ "200": "#FCF199",
1609
+ "300": "#FBED78",
1610
+ "400": "#FAE856",
1611
+ "500": "#f9e11e"
1612
+ },
1613
+ "donkergeel": {
1614
+ "50": "#fff4db",
1615
+ "100": "#ffe9b8",
1616
+ "200": "#FDDE94",
1617
+ "300": "#FDD370",
1618
+ "400": "#FDC84D",
1619
+ "500": "#ffb612"
1620
+ },
1621
+ "oranje": {
1622
+ "50": "#fbead9",
1623
+ "100": "#f6d4b3",
1624
+ "200": "#F1BE8C",
1625
+ "300": "#EDA966",
1626
+ "400": "#E89440",
1627
+ "500": "#e17000"
1628
+ },
1629
+ "rood": {
1630
+ "50": "#f9dfdd",
1631
+ "100": "#f2bfbc",
1632
+ "200": "#EC9F99",
1633
+ "300": "#E67F78",
1634
+ "400": "#DF6056",
1635
+ "500": "#d52b1e"
1636
+ },
1637
+ "roze": {
1638
+ "50": "#fdeff8",
1639
+ "100": "#fbdef0",
1640
+ "200": "#F8CEE8",
1641
+ "300": "#F6BDE1",
1642
+ "400": "#F4ADD9",
1643
+ "500": "#f092cd"
1644
+ },
1645
+ "robijnrood": {
1646
+ "50": "#f7d9e7",
1647
+ "100": "#efb3ce",
1648
+ "200": "#E78CB6",
1649
+ "300": "#DF669D",
1650
+ "400": "#D74085",
1651
+ "500": "#ca005d"
1652
+ },
1653
+ "lintblauw": {
1654
+ "50": "#dce3ea",
1655
+ "100": "#b8c6d5",
1656
+ "200": "#95a9c0",
1657
+ "300": "#738eab",
1658
+ "400": "#4f7196",
1659
+ "500": "#154273"
1660
+ },
1661
+ "wit": "#fff",
1662
+ "zwart": "#000",
1663
+ "none": "transparent"
1664
+ },
1665
+ "border-radius": {
1666
+ "sm": 0,
1667
+ "md": 0,
1668
+ "keep": 0,
1669
+ "circle": "999px",
1670
+ "none": "0px"
1671
+ },
1672
+ "sub-nav-bar": {
1673
+ "background-color": "#f2f4f6",
1674
+ "column-gap": "0.5rem",
1675
+ "column-width": "375px",
1676
+ "padding-block-end": "2rem",
1677
+ "padding-block-start": "2rem",
1678
+ "inline-size": "100%",
1679
+ "content": {
1680
+ "padding-inline-end": "1rem",
1681
+ "padding-inline-start": "1rem",
1682
+ "max-inline-size": "1280px",
1683
+ "list": {
1684
+ "row-gap": "0.5rem"
1685
+ }
1686
+ }
1687
+ },
1688
+ "toggletip": {
1689
+ "color": "#fff",
1690
+ "background-color": "#007bc7",
1691
+ "border-color": "transparent",
1692
+ "border-radius": 0,
1693
+ "border-width": "1px",
1694
+ "icon": {
1695
+ "size": "24px"
1696
+ },
1697
+ "size": "24px",
1698
+ "active": {
1699
+ "color": "#007bc7",
1700
+ "background-color": "#fff",
1701
+ "border-color": "#007bc7"
1702
+ },
1703
+ "hover": {
1704
+ "color": "#0F172A",
1705
+ "background-color": "#66AFDD"
1706
+ },
1707
+ "focus": {
1544
1708
  "color": "#fff",
1545
- "border-width": "1px",
1546
- "disabled": {
1547
- "background-color": "#CBD5E1",
1548
- "border-color": "#94A3B8",
1549
- "color": "#475569"
1550
- },
1551
- "active": {
1552
- "background-color": "#BE4088",
1553
- "border-color": "transparent",
1554
- "color": "#fff",
1555
- "border-width": "1px"
1709
+ "background-color": "#007bc7"
1710
+ }
1711
+ },
1712
+ "sidenav": {
1713
+ "display": "flex",
1714
+ "link": {
1715
+ "line-height": "150%",
1716
+ "icon": {
1717
+ "size": "24px",
1718
+ "margin-inline": "0.5rem"
1556
1719
  },
1557
- "hover": {
1558
- "background-color": "#CB66A0",
1559
- "border-color": "transparent",
1560
- "color": "#fff",
1561
- "border-width": "1px"
1720
+ "font-size": "1.25rem",
1721
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1722
+ "font-weight": 400,
1723
+ "current": {
1724
+ "font-weight": 700,
1725
+ "color": "#0F172A"
1726
+ },
1727
+ "color": "#01689b",
1728
+ "active": {
1729
+ "color": "#42145f",
1730
+ "text-decoration": "underline"
1562
1731
  },
1563
1732
  "focus": {
1564
- "background-color": "#fff",
1733
+ "border-radius": 0,
1734
+ "border-width": "2px",
1735
+ "border-style": "solid",
1565
1736
  "border-color": "#a90061",
1566
- "color": "#a90061",
1567
- "border-width": "2px"
1568
- }
1569
- },
1570
- "border-width": "1px",
1571
- "hover": {
1572
- "border-width": "1px",
1573
- "background-color": "#fff",
1574
- "border-color": "#CB66A0"
1575
- },
1576
- "active": {
1577
- "border-width": "1px",
1578
- "background-color": "#fff",
1579
- "border-color": "#BE4088"
1737
+ "background-color": "none",
1738
+ "color": "#01689b",
1739
+ "text-decoration": "None"
1740
+ },
1741
+ "hover": {
1742
+ "color": "#15496a",
1743
+ "text-decoration": "underline"
1744
+ },
1745
+ "padding-block-start": "0.75rem",
1746
+ "padding-block-end": "0.75rem",
1747
+ "text-decoration": "None",
1748
+ "column-gap": "0.5rem"
1580
1749
  }
1581
1750
  },
1582
- "button-group": {
1583
- "background-color": "transparent",
1584
- "column-gap": "0.5rem",
1585
- "margin-block-end": "0px",
1586
- "margin-block-start": "0px",
1587
- "padding-block-end": "0px",
1588
- "padding-block-start": "0px",
1589
- "row-gap": "0.5rem"
1590
- },
1591
- "button": {
1592
- "background-color": "#0F172A",
1593
- "border-color": "transparent",
1594
- "color": "#fff",
1595
- "border-radius": 0,
1596
- "border-width": "1px",
1597
- "icon": {
1598
- "gap": "0.5rem",
1599
- "size": "24px"
1600
- },
1601
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1602
- "font-size": "1.25rem",
1603
- "font-weight": 700,
1604
- "line-height": "150%",
1751
+ "radio-group": {
1605
1752
  "padding-block-end": "0.5rem",
1606
1753
  "padding-block-start": "0.5rem",
1607
- "padding-inline-end": "1rem",
1608
- "padding-inline-start": "1rem",
1609
- "disabled": {
1610
- "background-color": "#E2E8F0",
1611
- "border-color": "transparent",
1612
- "color": "#94A3B8"
1613
- },
1614
- "focus": {
1615
- "background-color": "#475569",
1616
- "border-color": "transparent",
1617
- "color": "#fff"
1618
- },
1619
- "hover": {
1620
- "background-color": "#475569",
1621
- "border-color": "transparent",
1622
- "color": "#fff"
1623
- },
1624
- "active": {
1625
- "background-color": "#1E293B",
1626
- "border-color": "transparent",
1754
+ "row-gap": "1rem"
1755
+ },
1756
+ "navigation-list": {
1757
+ "icon": {
1758
+ "background-color": "#0F172A",
1759
+ "border-radius": "999px",
1627
1760
  "color": "#fff"
1628
1761
  },
1629
- "min-block-size": "48px",
1630
- "min-inline-size": "48px",
1631
- "column-gap": "0.5rem",
1632
- "primary-action": {
1633
- "hover": {
1634
- "background-color": "#741344",
1635
- "border-color": "transparent",
1636
- "color": "#fff"
1762
+ "item": {
1763
+ "icon": {
1764
+ "padding-inline": "0.5rem",
1765
+ "padding-block": "0.5rem",
1766
+ "size": "24px"
1637
1767
  },
1638
- "background-color": "#a90061",
1639
- "border-color": "transparent",
1640
- "color": "#fff",
1641
- "disabled": {
1642
- "background-color": "#e5b3d0",
1643
- "border-color": "transparent",
1644
- "color": "#BE4088"
1768
+ "content": {
1769
+ "font-size": "1.25rem",
1770
+ "column-gap": "0.5rem",
1771
+ "row-gap": "0.25rem"
1645
1772
  },
1646
- "focus": {
1647
- "background-color": "#741344",
1648
- "border-color": "transparent",
1649
- "color": "#fff"
1773
+ "label": {
1774
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1775
+ "font-size": "1.875rem",
1776
+ "font-weight": 700,
1777
+ "line-height": "150%"
1650
1778
  },
1651
- "font-weight": 700,
1652
1779
  "active": {
1653
- "background-color": "#65003a",
1654
- "border-color": "transparent",
1655
- "color": "#fff"
1780
+ "background-color": "#F1F5F9"
1656
1781
  },
1657
- "font-size": "1.25rem",
1658
- "line-height": "1.875rem",
1659
- "pressed": {
1660
- "background-color": "#63143a",
1661
- "border-color": "transparent",
1662
- "color": "#fff"
1663
- }
1664
- },
1665
- "secondary-action": {
1666
1782
  "hover": {
1667
- "background-color": "#f2d9e7",
1668
- "border-color": "#741344",
1669
- "color": "#741344"
1670
- },
1671
- "background-color": "transparent",
1672
- "border-color": "#a90061",
1673
- "color": "#a90061",
1674
- "disabled": {
1675
- "background-color": "transparent",
1676
- "border-color": "#D88CB7",
1677
- "color": "#CB66A0"
1783
+ "background-color": "#F8FAFC"
1678
1784
  },
1679
1785
  "focus": {
1680
- "background-color": "#f2d9e7",
1681
- "border-color": "transparent",
1682
- "color": "#741344"
1786
+ "background-color": "#f2d9e7"
1683
1787
  },
1684
- "font-weight": 700,
1788
+ "background-color": "#fff",
1789
+ "color": "#334155",
1790
+ "border-width": "1px",
1791
+ "border-color": "#CBD5E1",
1792
+ "heading": {
1793
+ "color": "#0F172A"
1794
+ },
1795
+ "column-gap": "1rem",
1796
+ "min-height": "48px",
1797
+ "padding-block": "0.75rem",
1798
+ "padding-inline": "1rem"
1799
+ }
1800
+ },
1801
+ "nav-bar": {
1802
+ "border-block-end-width": "1px",
1803
+ "max-inline-size": "1280px",
1804
+ "padding-inline": "1rem",
1805
+ "container": {
1806
+ "inline-size": "100%"
1807
+ },
1808
+ "content": {
1809
+ "column-gap": "1rem"
1810
+ },
1811
+ "icon": {
1812
+ "color": "#0F172A",
1685
1813
  "active": {
1686
- "background-color": "#D88CB7",
1687
- "border-color": "#63143a",
1688
- "color": "#741344"
1814
+ "color": "#fff"
1689
1815
  },
1690
- "font-size": "1.25rem",
1691
- "line-height": "1.875rem",
1692
- "pressed": {
1693
- "background-color": "#e5b3d0",
1694
- "border-color": "#63143a",
1695
- "color": "#63143a"
1696
- }
1816
+ "size": "24px"
1697
1817
  },
1698
- "subtle": {
1699
- "font-size": "1.25rem",
1700
- "font-weight": 700,
1701
- "hover": {
1702
- "background-color": "#f2d9e7",
1703
- "border-color": "transparent",
1704
- "color": "#741344"
1818
+ "link": {
1819
+ "active": {
1820
+ "background-color": "#a90061",
1821
+ "color": "#fff"
1705
1822
  },
1706
- "background-color": "transparent",
1707
- "border-color": "transparent",
1823
+ "background-color": "#fff",
1708
1824
  "color": "#a90061",
1709
- "disabled": {
1710
- "background-color": "transparent",
1711
- "border-color": "transparent",
1712
- "color": "#e5b3d0"
1713
- },
1714
1825
  "focus": {
1715
1826
  "background-color": "#f2d9e7",
1716
- "border-color": "transparent",
1717
- "color": "#741344"
1827
+ "color": "#a90061"
1718
1828
  },
1719
- "active": {
1720
- "background-color": "#D88CB7",
1721
- "border-color": "transparent",
1722
- "color": "#65003a"
1829
+ "hover": {
1830
+ "background-color": "#F8FAFC",
1831
+ "color": "#a90061"
1723
1832
  },
1724
- "line-height": "1.875rem",
1725
- "pressed": {
1726
- "background-color": "#e5b3d0",
1727
- "border-color": "transparent",
1728
- "color": "#63143a"
1729
- }
1833
+ "padding-block-end": "1rem",
1834
+ "padding-block-start": "1rem",
1835
+ "padding-inline-end": "0.75rem",
1836
+ "padding-inline-start": "0.75rem",
1837
+ "column-gap": "0.5rem"
1730
1838
  },
1731
- "pressed": {
1732
- "background-color": "#1E293B",
1733
- "border-color": "transparent",
1734
- "color": "#fff"
1735
- }
1839
+ "heading": {
1840
+ "font-weight": 700
1841
+ },
1842
+ "background-color": "#fff",
1843
+ "color": "#a90061",
1844
+ "border-color": "#BE4088"
1736
1845
  },
1737
- "breadcrumb-nav": {
1738
- "line-height": 1.4,
1739
- "font-size": "1.25rem",
1740
- "link": {
1846
+ "message-list": {
1847
+ "item": {
1848
+ "background-color": "#fff",
1849
+ "border-color": "#CBD5E1",
1850
+ "border-width": "1px",
1851
+ "color": "#334155",
1852
+ "column-gap": "1rem",
1741
1853
  "icon": {
1742
1854
  "size": "24px",
1743
- "margin-inline": "0.25rem",
1744
- "inset-block-start": 0
1745
- },
1746
- "padding-block-end": "0.75rem",
1747
- "padding-block-start": "0.75rem",
1748
- "padding-inline-end": 0,
1749
- "padding-inline-start": 0,
1750
- "color": "#01689b",
1751
- "active": {
1752
- "color": "#42145f",
1753
- "text-decoration": "None"
1754
- },
1755
- "focus": {
1756
- "background-color": "transparent",
1757
- "color": "#01689b",
1758
- "text-decoration": "None"
1855
+ "color": "#0F172A"
1759
1856
  },
1760
- "hover": {
1761
- "color": "#01496c",
1762
- "text-decoration": "None"
1857
+ "min-height": "48px",
1858
+ "padding-block": "0.75rem",
1859
+ "padding-inline": "1rem",
1860
+ "content": {
1861
+ "font-size": "1.25rem",
1862
+ "column-gap": "0.5rem",
1863
+ "row-gap": "0.5rem"
1763
1864
  },
1764
- "current": {
1765
- "color": "#334155"
1865
+ "label": {
1866
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1867
+ "font-size": "1.25rem",
1868
+ "font-weight": 700,
1869
+ "line-height": "150%"
1766
1870
  },
1767
- "text-decoration": "underline"
1871
+ "heading": {
1872
+ "color": "#0F172A"
1873
+ }
1874
+ }
1875
+ },
1876
+ "logo": {
1877
+ "image": {
1878
+ "background-color": "#fff",
1879
+ "inline-size": "48px",
1880
+ "block-size": "96px",
1881
+ "color": "#154273"
1768
1882
  },
1769
- "divider": {
1770
- "size": "24px",
1771
- "color": "#334155",
1772
- "inset-block-start": 0
1883
+ "title": {
1884
+ "font-weight": 600,
1885
+ "line-height": "1.063rem",
1886
+ "font-size": "0.913rem",
1887
+ "padding-block-start": "3.125rem"
1888
+ },
1889
+ "subtitle": {
1890
+ "font-weight": 400,
1891
+ "line-height": "1rem",
1892
+ "font-size": "0.775rem"
1773
1893
  },
1774
- "margin-inline": "0.5rem",
1894
+ "column-gap": "12px",
1775
1895
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1776
- "font-weight": 400
1896
+ "color": "#154273"
1777
1897
  },
1778
- "article": {
1779
- "max-inline-size": "75ch"
1898
+ "link-list-card": {
1899
+ "background-color": "#fff",
1900
+ "padding-block-start": "1.5rem",
1901
+ "padding-block-end": "1.5rem",
1902
+ "row-gap": "1rem",
1903
+ "padding-inline-start": "1.5rem",
1904
+ "padding-inline-end": "1.5rem"
1780
1905
  },
1781
- "alert": {
1906
+ "icon-only-button": {
1907
+ "padding-block-end": "0.75rem",
1908
+ "padding-block-start": "0.75rem",
1909
+ "padding-inline-end": "0.75rem",
1910
+ "padding-inline-start": "0.75rem"
1911
+ },
1912
+ "hero": {
1782
1913
  "heading": {
1783
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1784
1914
  "font-weight": 700,
1785
- "line-height": "150%",
1786
- "font-size": "1.25rem"
1787
- },
1788
- "column-gap": "0.5rem",
1789
- "border-width": "0px",
1790
- "margin-block-end": "0.75rem",
1791
- "margin-block-start": "0.75rem",
1792
- "padding-block-end": "1rem",
1793
- "padding-block-start": "1rem",
1794
- "padding-inline-end": "1rem",
1795
- "padding-inline-start": "1rem",
1796
- "background-color": "#d9ebf7",
1797
- "border-color": "transparent",
1798
- "color": "#000",
1799
- "info": {
1800
- "background-color": "#d9ebf7",
1801
- "border-color": "transparent",
1802
- "color": "#000"
1803
- },
1804
- "error": {
1805
- "background-color": "#f9dfdd",
1806
- "border-color": "transparent",
1807
- "color": "#000"
1808
- },
1809
- "ok": {
1810
- "background-color": "#e1eddb",
1811
- "border-color": "transparent",
1812
- "color": "#000"
1813
- },
1814
- "warning": {
1815
- "background-color": "#fff4db",
1816
- "border-color": "transparent",
1817
- "color": "#000"
1915
+ "line-height": "125%",
1916
+ "font-size": "1.875rem",
1917
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif"
1818
1918
  },
1819
- "icon": {
1820
- "inset-block-start": "3px",
1821
- "info": {
1822
- "color": "#007bc7"
1823
- },
1824
- "error": {
1825
- "color": "#d52b1e"
1826
- },
1827
- "ok": {
1828
- "color": "#39870c"
1829
- },
1830
- "warning": {
1831
- "color": "#ffb612"
1832
- },
1833
- "size": "24px"
1919
+ "sub-heading": {
1920
+ "font-weight": 400,
1921
+ "line-height": "150%",
1922
+ "font-size": "1.25rem",
1923
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif"
1834
1924
  },
1835
1925
  "message": {
1836
- "line-height": "150%",
1837
- "column-gap": "0.5rem"
1926
+ "background-color": "#a90061",
1927
+ "color": "#fff",
1928
+ "row-gap": "0.125rem",
1929
+ "padding-block-end": "1rem",
1930
+ "padding-inline-end": "1rem",
1931
+ "padding-inline-start": "1rem",
1932
+ "padding-block-start": "1rem",
1933
+ "border-radius": "20px",
1934
+ "inline-size": "90%"
1838
1935
  },
1839
- "border-radius": 0
1936
+ "border-radius": "40px",
1937
+ "inline-size": "100%"
1840
1938
  },
1841
- "action": {
1842
- "activate": {
1843
- "cursor": "pointer"
1939
+ "form-field-radio-option": {
1940
+ "column-gap": "0.5rem",
1941
+ "font-weight": 400,
1942
+ "row-gap": "0.5rem",
1943
+ "label": {
1944
+ "margin-block-end": "0rem"
1844
1945
  },
1845
- "busy": {
1846
- "cursor": "wait"
1946
+ "input": {
1947
+ "margin": {
1948
+ "block-start": "0.25rem"
1949
+ }
1950
+ }
1951
+ },
1952
+ "form-field-checkbox-option": {
1953
+ "column-gap": "0.5rem",
1954
+ "margin-block-end": "0rem"
1955
+ },
1956
+ "page-footer": {
1957
+ "column-gap": "1.5rem",
1958
+ "column-width": "200px",
1959
+ "column": {
1960
+ "title": {
1961
+ "margin-block-end": "0.75rem"
1962
+ }
1847
1963
  },
1848
- "disabled": {
1849
- "cursor": "not-allowed"
1964
+ "content": {
1965
+ "max-inline-size": "1280px",
1966
+ "padding-inline-start": "1rem",
1967
+ "padding-inline-end": "1rem",
1968
+ "column-gap": "2rem"
1850
1969
  },
1851
- "inert": {
1852
- "cursor": "default"
1970
+ "border-block-start-width": "2px",
1971
+ "border-block-start-color": "#CB66A0",
1972
+ "border-block-start-style": "solid",
1973
+ "outlined": {
1974
+ "background-color": "#fff",
1975
+ "color": "#a90061",
1976
+ "border-color": "#a90061"
1853
1977
  },
1854
- "navigate": {
1855
- "cursor": "pointer"
1978
+ "padding-block-start": "2.5rem",
1979
+ "padding-block-end": "2.5rem",
1980
+ "padding-inline-start": "2.5rem",
1981
+ "padding-inline-end": "2.5rem",
1982
+ "flex": {
1983
+ "direction": "column"
1984
+ }
1985
+ },
1986
+ "file-input": {
1987
+ "column-gap": "0.75rem",
1988
+ "row-gap": "0.75rem",
1989
+ "feedback": {
1990
+ "color": "#475569",
1991
+ "font-size": "1rem"
1992
+ }
1993
+ },
1994
+ "file": {
1995
+ "border-style": "solid",
1996
+ "border-color": "#a90061",
1997
+ "border-width": "1px",
1998
+ "border-radius": 0,
1999
+ "padding-inline-start": "1rem",
2000
+ "padding-inline-end": "1rem",
2001
+ "padding-block-start": "0.75rem",
2002
+ "padding-block-end": "0.75rem",
2003
+ "column-gap": "0.25rem",
2004
+ "error": {
2005
+ "border-color": "#d52b1e"
1856
2006
  },
1857
- "submit": {
1858
- "cursor": "pointer"
2007
+ "subtitle": {
2008
+ "color": "#64748B"
1859
2009
  }
1860
2010
  },
1861
- "document": {
2011
+ "dot-badge": {
2012
+ "border-radius": "999px",
2013
+ "color": "#d52b1e",
2014
+ "size": "12px"
2015
+ },
2016
+ "code-input": {
2017
+ "size": "48px"
2018
+ },
2019
+ "code-input-group": {
2020
+ "column-gap": "0.5rem"
2021
+ },
2022
+ "checkbox-group": {
2023
+ "padding-block-end": "0.5rem",
2024
+ "padding-block-start": "0.5rem",
2025
+ "row-gap": "1rem"
2026
+ },
2027
+ "card-as-link": {
1862
2028
  "background-color": "#fff",
2029
+ "border-color": "#CBD5E1",
2030
+ "border-radius": 0,
2031
+ "border-width": "1px",
1863
2032
  "color": "#0F172A",
1864
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1865
- "font-size": "1.25rem",
1866
- "line-height": "150%",
1867
- "font-weight": 400
1868
- },
1869
- "rich-text": {
1870
- "stranger": {
1871
- "margin-block-end": "2rem"
1872
- },
1873
- "acquaintance": {
1874
- "margin-block-end": "1rem"
2033
+ "column-gap": "1rem",
2034
+ "inline-size": "328px",
2035
+ "icon": {
2036
+ "color": "#a90061",
2037
+ "size": "24px"
1875
2038
  },
1876
- "friend": {
1877
- "margin-block-end": "0.5rem"
2039
+ "link": {
2040
+ "color": "#01689b",
2041
+ "text-decoration": "underline",
2042
+ "active": {
2043
+ "text-decoration": "none"
2044
+ },
2045
+ "hover": {
2046
+ "text-decoration": "none"
2047
+ },
2048
+ "focus": {
2049
+ "text-decoration": "none"
2050
+ }
1878
2051
  },
1879
- "best-friend": {
1880
- "margin-block-end": "0.25rem"
2052
+ "metadata": {
2053
+ "color": "#334155"
1881
2054
  },
1882
- "confidant": {
1883
- "margin-block-end": 0
1884
- }
1885
- },
1886
- "pointer-target": {
1887
- "min-size": "48px"
1888
- },
1889
- "focus": {
1890
- "outline-color": "#000",
1891
- "outline-offset": "0.125rem",
1892
- "outline-style": "solid",
1893
- "outline-width": "2px",
1894
- "inverse": {
1895
- "outline-color": "#fff"
1896
- }
1897
- }
1898
- },
1899
- "nl": {
1900
- "skip-link": {
1901
- "font-weight": 700,
1902
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1903
- "font-size": "1.25rem",
1904
- "line-height": "150%",
1905
- "min-block-size": "48px",
1906
- "min-inline-size": "48px",
1907
- "padding-block-end": "0.75rem",
1908
- "padding-block-start": "0.75rem",
2055
+ "padding-block-end": "1rem",
2056
+ "padding-block-start": "1rem",
1909
2057
  "padding-inline-end": "1rem",
1910
2058
  "padding-inline-start": "1rem",
1911
- "focus": {
1912
- "background-color": "#fff",
1913
- "border-color": "#a90061",
1914
- "border-style": "solid",
1915
- "border-width": "2px",
1916
- "color": "#0F172A",
1917
- "text-decoration": "None"
2059
+ "row-gap": "0.75rem",
2060
+ "active": {
2061
+ "background-color": "#F1F5F9",
2062
+ "text-decoration": "underline"
1918
2063
  },
1919
- "focus-visible": {
1920
- "outline-color": "#000"
2064
+ "hover": {
2065
+ "background-color": "#F8FAFC",
2066
+ "text-decoration": "underline"
1921
2067
  },
1922
- "background-color": "#a90061",
1923
- "border-color": "transparent",
1924
- "color": "#fff",
1925
- "border-width": "2px",
1926
- "box-block-end-shadow": {
1927
- "offset-x": 0,
1928
- "offset-y": "16px",
1929
- "blur-radius": "48px",
1930
- "spread-radius": 0,
1931
- "color": "#0000001a"
2068
+ "focus": {
2069
+ "background-color": "#f2d9e7",
2070
+ "text-decoration": "underline"
1932
2071
  },
1933
- "text-decoration": "underline",
1934
- "text-underline-offset": "0.125rem"
1935
- },
1936
- "paragraph": {
1937
- "color": "#0F172A",
1938
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1939
- "font-size": "1.25rem",
1940
- "font-weight": 400,
1941
- "line-height": "150%",
1942
- "margin-block-end": 0,
1943
- "margin-block-start": 0,
1944
- "lead": {
1945
- "color": "#0F172A",
2072
+ "full-bleed": {
2073
+ "background-color": "#000",
2074
+ "border-color": "transparent",
2075
+ "color": "#fff",
2076
+ "opacity": 0.5
2077
+ },
2078
+ "heading": {
2079
+ "color": "#a90061",
2080
+ "padding-block-start": "0.5rem",
1946
2081
  "font-size": "1.5rem",
1947
- "font-weight": 400,
1948
- "line-height": "150%"
2082
+ "font-weight": 700
2083
+ },
2084
+ "horizontal": {
2085
+ "background-color": "#a90061",
2086
+ "border-color": "transparent",
2087
+ "color": "#fff",
2088
+ "max-block-size": "96px",
2089
+ "padding-block-end": 0,
2090
+ "padding-block-start": 0,
2091
+ "padding-inline-end": "1rem",
2092
+ "padding-inline-start": "1rem",
2093
+ "heading": {
2094
+ "inline-size": "200px"
2095
+ }
1949
2096
  }
1950
2097
  },
1951
- "link": {
1952
- "color": "#01689b",
1953
- "text-decoration-color": "#01689b",
1954
- "active": {
1955
- "color": "#42145f",
1956
- "text-decoration": "None"
2098
+ "focus": {
2099
+ "outline-offset": "0.125rem",
2100
+ "outline-style": "solid",
2101
+ "outline-width": "2px"
2102
+ },
2103
+ "font-size": {
2104
+ "heading": {
2105
+ "level-1": "3.125rem",
2106
+ "level-2": "2.5rem",
2107
+ "level-3": "1.875rem",
2108
+ "level-4": "1.5rem",
2109
+ "level-5": "1.25rem"
1957
2110
  },
1958
- "focus": {
1959
- "background-color": "transparent",
1960
- "color": "#01689b",
1961
- "text-decoration": "None",
1962
- "text-decoration-thickness": "auto"
2111
+ "body": {
2112
+ "intro": "1.5rem",
2113
+ "default": "1.25rem"
1963
2114
  },
1964
- "hover": {
1965
- "color": "#01496c",
1966
- "text-decoration": "None",
1967
- "text-decoration-thickness": "auto"
2115
+ "xs": {
2116
+ "desktop": "1.25rem",
2117
+ "tablet": "1.125rem",
2118
+ "mobile": "1rem"
1968
2119
  },
1969
- "visited": {
1970
- "color": "#42145f"
2120
+ "sm": {
2121
+ "desktop": "1.5rem",
2122
+ "tablet": "1.35rem",
2123
+ "mobile": "1.2rem"
1971
2124
  },
1972
- "text-decoration": "underline",
1973
- "icon": {
1974
- "inset-block-start": "0.25rem",
1975
- "size": "24px"
2125
+ "md": {
2126
+ "desktop": "1.875rem",
2127
+ "tablet": "1.688rem",
2128
+ "mobile": "1.5rem"
1976
2129
  },
1977
- "column-gap": "0.25rem",
1978
- "text-decoration-thickness": "auto",
1979
- "text-underline-offset": "0.125rem",
1980
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1981
- "font-weight": 400,
1982
- "font-size": "1.25rem",
1983
- "line-height": "150%"
2130
+ "lg": {
2131
+ "desktop": "2.5rem",
2132
+ "tablet": "2.25rem",
2133
+ "mobile": "2rem"
2134
+ },
2135
+ "xl": {
2136
+ "desktop": "3.125rem",
2137
+ "tablet": "2.813rem",
2138
+ "mobile": "2.5rem"
2139
+ }
1984
2140
  },
1985
- "heading-level-1": {
1986
- "color": "#154273",
1987
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1988
- "font-weight": 700,
1989
- "line-height": "125%",
1990
- "font-size": "3.125rem",
1991
- "margin-block-end": 0,
1992
- "margin-block-start": 0
2141
+ "font-weight": {
2142
+ "default": 400,
2143
+ "strong": 700,
2144
+ "extra-bold": 800,
2145
+ "bold": 700,
2146
+ "semi-bold": 600,
2147
+ "regular": 400,
2148
+ "light": 300,
2149
+ "thin": 200
1993
2150
  },
1994
- "heading-level-2": {
1995
- "color": "#154273",
1996
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1997
- "font-weight": 700,
1998
- "line-height": "125%",
1999
- "font-size": "2.5rem",
2000
- "margin-block-end": 0,
2001
- "margin-block-start": 0
2151
+ "line-height": {
2152
+ "body": "150%",
2153
+ "sm": "125%",
2154
+ "md": "150%"
2002
2155
  },
2003
- "heading-level-3": {
2004
- "color": "#154273",
2005
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
2006
- "font-weight": 700,
2007
- "line-height": "125%",
2008
- "font-size": "1.875rem",
2009
- "margin-block-end": 0,
2010
- "margin-block-start": 0
2156
+ "size": {
2157
+ "target": "48px",
2158
+ "icon": {
2159
+ "functional": "24px"
2160
+ },
2161
+ "quarter-lint": "12px",
2162
+ "half-lint": "24px",
2163
+ "lint": "48px",
2164
+ "2-lint": "96px",
2165
+ "3-lint": "1440px"
2011
2166
  },
2012
- "heading-level-4": {
2013
- "color": "#154273",
2014
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
2015
- "font-weight": 700,
2016
- "line-height": "125%",
2017
- "font-size": "1.5rem",
2018
- "margin-block-end": 0,
2019
- "margin-block-start": 0
2167
+ "font-family": {
2168
+ "primary": "'Fira Sans', Arial, Verdana, sans-serif",
2169
+ "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
2020
2170
  },
2021
- "heading-level-5": {
2022
- "color": "#154273",
2023
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
2024
- "font-weight": 700,
2025
- "line-height": "125%",
2026
- "font-size": "1.25rem",
2027
- "margin-block-end": 0,
2028
- "margin-block-start": 0
2171
+ "border-width": {
2172
+ "default": "1px",
2173
+ "m": "2px",
2174
+ "none": "0px"
2029
2175
  },
2030
- "number-badge": {
2031
- "font-size": "1.25rem",
2032
- "line-height": "125%",
2033
- "min-block-size": "24px",
2034
- "min-inline-size": "24px",
2035
- "font-weight": 700,
2036
- "border-width": "0px",
2037
- "border-radius": "999px",
2038
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
2039
- "background-color": "#a90061",
2040
- "border-color": "transparent",
2041
- "color": "#fff",
2042
- "padding-inline": "0.5rem",
2043
- "padding-block": "0.125rem"
2176
+ "space": {
2177
+ "0": "0rem",
2178
+ "25": "0.125rem",
2179
+ "50": "0.25rem",
2180
+ "100": "0.5rem",
2181
+ "150": "0.75rem",
2182
+ "200": "1rem",
2183
+ "300": "1.5rem",
2184
+ "400": "2rem",
2185
+ "500": "2.5rem",
2186
+ "600": "3rem",
2187
+ "700": "3.5rem"
2188
+ }
2189
+ },
2190
+ "todo": {
2191
+ "link-list": {
2192
+ "link": {
2193
+ "hover": {
2194
+ "text-decoration": "underline"
2195
+ }
2196
+ }
2197
+ },
2198
+ "skip-link": {
2199
+ "font-weight": 700
2044
2200
  }
2045
2201
  }
2046
2202
  }