@rijkshuisstijl-community/design-tokens 2.0.0 → 3.0.0

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