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