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