UNPKG

@amsterdam/design-system-css

Version:

Stylesheets for all components from the Amsterdam Design System and some general utilities. Use it to apply the visual design of the City of Amsterdam to your HTML elements or non-React components.

designsystem.amsterdam

Amsterdam/design-system

423 lines (303 loc) • 60.8 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
# Change Log All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. ## [2.0.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v1.0.1...design-system-css-v2.0.0) (2025-09-17) ### ⚠ BREAKING CHANGES * Changed breakpoint widths from `36rem` to `37.5rem` and `68rem` to `72.5rem`. Update to these values if your application uses breakpoints. ([#2205](https://github.com/Amsterdam/design-system/issues/2205)) * Decreased font sizes and line heights of Headings. You should not need the `size` prop very often anymore. Try removing instances, but verify the visual result. See the [example pages in Storybook](https://designsystem.amsterdam/?path=/docs/pages-introduction--docs) for the approach we recommend. ([#2173](https://github.com/Amsterdam/design-system/issues/2173)) ### Deprecations The following class names will be removed in the next major release. If you use them in your code, please delete them. * `ams-accordion__header` * `ams-icon--heading-0` * `ams-page-heading` and related classes * `ams-standalone-link--with-icon` * `ams-table-of-contents__heading` ### Features * **Accordion:** Display Headings in the size that matches their levels ([#2193](https://github.com/Amsterdam/design-system/issues/2193)) ([a3e373f](https://github.com/Amsterdam/design-system/commit/a3e373f5351fcd3a45227506a438d3a4d9ba2d54)) * Add Call to Action Link component ([#2132](https://github.com/Amsterdam/design-system/issues/2132)) ([908fc5d](https://github.com/Amsterdam/design-system/commit/908fc5d107ded55c344d9d8c40feeb8c2071a1c7)) * Add Menu component for applications ([#2129](https://github.com/Amsterdam/design-system/issues/2129)) ([886c052](https://github.com/Amsterdam/design-system/commit/886c052164be28a6cea9ed029465a81604841aec)) * Allow pairing an Icon with Headings 0–2 ([#2131](https://github.com/Amsterdam/design-system/issues/2131)) ([922ded9](https://github.com/Amsterdam/design-system/commit/922ded95c5e18ffeff4cee48e1d27b9bde4b1bf1)) * Decrease font sizes and grid width in Spacious Mode, and increase Heading sizes in Compact Mode ([#2119](https://github.com/Amsterdam/design-system/issues/2119)) ([d60f487](https://github.com/Amsterdam/design-system/commit/d60f4873e7b2e198a8abae14c67fbc13cc98f7a0)) * Decrease font sizes and line heights of Headings ([#2173](https://github.com/Amsterdam/design-system/issues/2173)) ([a70e945](https://github.com/Amsterdam/design-system/commit/a70e94503a524e97493ecffd4d3b005308307d3e)) * Decrease offset between link underlines and text baseline ([#2134](https://github.com/Amsterdam/design-system/issues/2134)) ([bf5a69c](https://github.com/Amsterdam/design-system/commit/bf5a69cd9f6a8fe01c651edab73029a43f37999c)) * Ensure that Checkbox, Icon, Image, Logo, and Radio still look acceptable if CSS fails to load ([#2159](https://github.com/Amsterdam/design-system/issues/2159)) ([95e4d1a](https://github.com/Amsterdam/design-system/commit/95e4d1a975b5798b63fa8fb8f96bea95db7f1252)) * **Heading:** Make sizing consistent in various components and examples ([#2160](https://github.com/Amsterdam/design-system/issues/2160)) ([82184bf](https://github.com/Amsterdam/design-system/commit/82184bfc4b317cb2f219ba5975250b23c7dc8fa9)) * **Inputs, Text Area, Select, Button:** Improve line height of entered text ([#2161](https://github.com/Amsterdam/design-system/issues/2161)) ([18d9a7d](https://github.com/Amsterdam/design-system/commit/18d9a7d5010a54a6e08893dfbf72f1e7b9434e69)) * **Ordered List, Unordered List:** Visually group nested list with parent item ([#2133](https://github.com/Amsterdam/design-system/issues/2133)) ([cf6a28f](https://github.com/Amsterdam/design-system/commit/cf6a28f1e9a340e4cf3b3e9a442d470c7f9e4f61)) * **Standalone Link:** Deprecate the variation with only an underline ([#2136](https://github.com/Amsterdam/design-system/issues/2136)) ([d5059da](https://github.com/Amsterdam/design-system/commit/d5059da21009d608346e68526d7b468e693fbc60)) * Update breakpoint widths in Sass ([#2205](https://github.com/Amsterdam/design-system/issues/2205)) ([1034679](https://github.com/Amsterdam/design-system/commit/10346793f0c5891cc080ade4433939937a08edfb)) ### Bug Fixes * **Alert:** Restore horizontal centering of icon ([#2098](https://github.com/Amsterdam/design-system/issues/2098)) ([df87c0b](https://github.com/Amsterdam/design-system/commit/df87c0b08e3fbbee0ae255f6b8e2d4ecc00899ad)) * **Checkbox:** Refactor CSS, reorder tokens, add input state documentation ([#2058](https://github.com/Amsterdam/design-system/issues/2058)) ([a13ea6d](https://github.com/Amsterdam/design-system/commit/a13ea6d65a54b06120ce4d43ea4b1dd67d562496)) * **Date Input, Time Input:** Equalise height to that of other Inputs and Select ([#2143](https://github.com/Amsterdam/design-system/issues/2143)) ([3593bd8](https://github.com/Amsterdam/design-system/commit/3593bd88363e2e5a2d8a69e9b2df31a813c60e92)) * **Invalid Form Alert:** Remove outline offset hack ([#2189](https://github.com/Amsterdam/design-system/issues/2189)) ([660e0a1](https://github.com/Amsterdam/design-system/commit/660e0a1e946c82cc32b03ad0a5a589e333f9716d)) * **Select:** Use intrisic size instead of 100% ([#2142](https://github.com/Amsterdam/design-system/issues/2142)) ([e71f40e](https://github.com/Amsterdam/design-system/commit/e71f40ef60a404d072e78e3ab7505da752fb5f7b)) * **Switch:** Remove phantom whitespace below ([#2155](https://github.com/Amsterdam/design-system/issues/2155)) ([ad0108e](https://github.com/Amsterdam/design-system/commit/ad0108efa5a9421b425eabfc73dbeadde624e5a6)) * Use correct styling for disabled and / or invalid inputs ([#2168](https://github.com/Amsterdam/design-system/issues/2168)) ([af42723](https://github.com/Amsterdam/design-system/commit/af427237eb54cf805eead4925b2e98a49d21c652)) * Use correct underline width for Standalone Link with icon ([#2096](https://github.com/Amsterdam/design-system/issues/2096)) ([a87b5a8](https://github.com/Amsterdam/design-system/commit/a87b5a82636bed3c4e20fa0a7113f7cfca20efe0)) ## [1.0.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v1.0.0...design-system-css-v1.0.1) (2025-06-06) ### Bug Fixes * **Button:** Restore missing border for secondary button ([#2087](https://github.com/Amsterdam/design-system/issues/2087)) ([18b7a70](https://github.com/Amsterdam/design-system/commit/18b7a70bebe368bba83ce492862ffca70cff11a0)) ## [1.0.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.16.0...design-system-css-v1.0.0) (2025-05-28) ### ⚠ BREAKING CHANGES * **Checkbox:** Use SVG for icon ([#2039](https://github.com/Amsterdam/design-system/issues/2039)) ### Features * **Checkbox:** Use SVG for icon ([#2039](https://github.com/Amsterdam/design-system/issues/2039)) ([713ec04](https://github.com/Amsterdam/design-system/commit/713ec04575e9bbcc59aedad1f93e2ea25c2996ed)) * **Label:** Change design for (optional) hint ([#2048](https://github.com/Amsterdam/design-system/issues/2048)) ([971757c](https://github.com/Amsterdam/design-system/commit/971757c1ba3f5aef401c0f589ea40815907ab7ac)) * **Page Header:** Show logo link in `LinkText` system color in forced colors mode ([#2024](https://github.com/Amsterdam/design-system/issues/2024)) ([b03f899](https://github.com/Amsterdam/design-system/commit/b03f89911578ffba55214fb6b8409c79a21c6e80)) * **Page Header:** Use heading level 2 for brandname in compact theme ([#2044](https://github.com/Amsterdam/design-system/issues/2044)) ([c5530df](https://github.com/Amsterdam/design-system/commit/c5530df647c84578aba9b8f258f84cd36d1b81e6)) * Use border property for borders and box shadows only for hovers ([#1998](https://github.com/Amsterdam/design-system/issues/1998)) ([f91c2e3](https://github.com/Amsterdam/design-system/commit/f91c2e39294c4b1e48f443ccbba5605c5d2dcfa2)) * Use medium border width for Inputs, Select and Switch thumb ([#2054](https://github.com/Amsterdam/design-system/issues/2054)) ([8cedce5](https://github.com/Amsterdam/design-system/commit/8cedce5728cbfc47df01d000f7a349ad946cee17)) ### Bug Fixes * **Date Input, Select, Time Input:** Use correct colors for icons ([#2020](https://github.com/Amsterdam/design-system/issues/2020)) ([a49c3d2](https://github.com/Amsterdam/design-system/commit/a49c3d2b5d4337fab812a274dceff1ce926b34ea)) * **Image:** Set inline size to 100% ([#2045](https://github.com/Amsterdam/design-system/issues/2045)) ([7b1a29d](https://github.com/Amsterdam/design-system/commit/7b1a29d2556df8885084f1db41afb877e18e9c80)) * **Radio:** Add missing forced colors styling ([#2036](https://github.com/Amsterdam/design-system/issues/2036)) ([c60dae6](https://github.com/Amsterdam/design-system/commit/c60dae6897ae4cc40fae3672fdfcbeceb6ccb9f0)) * **TextInput, PasswordInput:** Restore `size` attribute functionality ([#2028](https://github.com/Amsterdam/design-system/issues/2028)) ([c885e2f](https://github.com/Amsterdam/design-system/commit/c885e2fb4cf989549ac1718c337ee858f27734a4)) ### Miscellaneous Chores * Release 1.0.0 ([247375d](https://github.com/Amsterdam/design-system/commit/247375df3a0dfd5109726aaf2bb71b56ef62fdd1)) ## [0.16.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.15.0...design-system-css-v0.16.0) (2025-04-25) ### ⚠ BREAKING CHANGES * **Screen:** Delete component (use Page instead) ([#2018](https://github.com/Amsterdam/design-system/issues/2018)) * **Grid:** Match values for padding and gap with Space sizes ([#1993](https://github.com/Amsterdam/design-system/issues/1993)) * **Link:** Remove ‘variant’ prop, make inline the default ([#1994](https://github.com/Amsterdam/design-system/issues/1994)) * **Top Task Link:** Remove component ([#1988](https://github.com/Amsterdam/design-system/issues/1988)) * **Footer:** Rename component to Page Footer ([#1971](https://github.com/Amsterdam/design-system/issues/1971)) * **Header:** Rename component to Page Header ([#1970](https://github.com/Amsterdam/design-system/issues/1970)) * **MegaMenu:** Remove deprecated component ([#1963](https://github.com/Amsterdam/design-system/issues/1963)) * **PageMenu:** Remove deprecated component ([#1964](https://github.com/Amsterdam/design-system/issues/1964)) ### Features * Add Standalone Link ([#1979](https://github.com/Amsterdam/design-system/issues/1979)) ([b5d57bb](https://github.com/Amsterdam/design-system/commit/b5d57bbd34c7817e436f7b28d5dc675213394bfb)) * **Avatar, Badge, Spotlight:** Use inverse text on azure background, add guidelines to pair colours ([#1965](https://github.com/Amsterdam/design-system/issues/1965)) ([772b0dd](https://github.com/Amsterdam/design-system/commit/772b0dd0828fc492108bd19ab9726da1d42b67d9)) * Balance text wrapping in all kinds of Headings ([#1968](https://github.com/Amsterdam/design-system/issues/1968)) ([ecc87a0](https://github.com/Amsterdam/design-system/commit/ecc87a091b356aaffaa8d0a11f1e7014c4f48f41)) * **Card:** Replace gap with margins and introduce subcomponents ([#1972](https://github.com/Amsterdam/design-system/issues/1972)) ([85e34d4](https://github.com/Amsterdam/design-system/commit/85e34d4ec3da1589c95925a677e5800fb071dc32)) * **Dialog:** Decrease amounts of inner and outer whitespace ([#1975](https://github.com/Amsterdam/design-system/issues/1975)) ([b47526f](https://github.com/Amsterdam/design-system/commit/b47526f24e5c6c9ce94f8280f93e6273d16a8640)) * Do not copy visually hidden text ([#1956](https://github.com/Amsterdam/design-system/issues/1956)) ([6488bc3](https://github.com/Amsterdam/design-system/commit/6488bc3ba271166a3fa0a973df85b8641f8b5227)) * **Footer:** Rename component to Page Footer ([#1971](https://github.com/Amsterdam/design-system/issues/1971)) ([d0f7edc](https://github.com/Amsterdam/design-system/commit/d0f7edc1bd3dcbba0973d4494fd6c9e90a158cd2)) * **Grid:** Match values for padding and gap with Space sizes ([#1993](https://github.com/Amsterdam/design-system/issues/1993)) ([f161152](https://github.com/Amsterdam/design-system/commit/f161152292f86770ffda0d60c3448f8d20b7b775)) * **Header:** Rename component to Page Header ([#1970](https://github.com/Amsterdam/design-system/issues/1970)) ([17172e4](https://github.com/Amsterdam/design-system/commit/17172e4fd89c630be6eb604d12058214a075a82b)) * **Link:** Remove ‘variant’ prop, make inline the default ([#1994](https://github.com/Amsterdam/design-system/issues/1994)) ([75b07b8](https://github.com/Amsterdam/design-system/commit/75b07b8bbdc758da26ce0319e2b989d079744065)) * **MegaMenu:** Remove deprecated component ([#1963](https://github.com/Amsterdam/design-system/issues/1963)) ([d385c83](https://github.com/Amsterdam/design-system/commit/d385c83d3b6e0a7b7d7c70b5729f33ace19832cf)) * **Page:** Add Page component ([#1982](https://github.com/Amsterdam/design-system/issues/1982)) ([813033c](https://github.com/Amsterdam/design-system/commit/813033c93be66dabccae3ff5f32484487dffc1aa)) * **PageMenu:** Remove deprecated component ([#1964](https://github.com/Amsterdam/design-system/issues/1964)) ([0149640](https://github.com/Amsterdam/design-system/commit/0149640ca9d88b45af0223b26cd22680d65b601f)) * **Screen:** Delete component (use Page instead) ([#2018](https://github.com/Amsterdam/design-system/issues/2018)) ([0c59f6d](https://github.com/Amsterdam/design-system/commit/0c59f6dccffa7eda745a3b34554c86b646d514ba)) * **Tabs:** Change `tab` prop to `id` and `aria-controls` attributes ([#2011](https://github.com/Amsterdam/design-system/issues/2011)) ([5079ad2](https://github.com/Amsterdam/design-system/commit/5079ad20b72b75d50bbc3d09c052a27935e6f4cf)) * **Top Task Link:** Remove component ([#1988](https://github.com/Amsterdam/design-system/issues/1988)) ([6da8a9b](https://github.com/Amsterdam/design-system/commit/6da8a9bdf47648a3ff0e18f89ed722092d0dad18)) ### Bug Fixes * **Icon:** Center align SVG ([#1978](https://github.com/Amsterdam/design-system/issues/1978)) ([0340149](https://github.com/Amsterdam/design-system/commit/0340149d99f488a9581c5928e724f0126e0b0695)) * **Page Footer:** Set correct inline padding ([#2004](https://github.com/Amsterdam/design-system/issues/2004)) ([cb2e70c](https://github.com/Amsterdam/design-system/commit/cb2e70ce04e05aed64299e1df8c40b9d8873ca83)) * **Page Header:** Restore alignment with edges of Grid ([#1976](https://github.com/Amsterdam/design-system/issues/1976)) ([723a757](https://github.com/Amsterdam/design-system/commit/723a757511c921e8e5a4181c348ebd2077527a44)) ## [0.15.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.14.1...design-system-css-v0.15.0) (2025-03-28) ### ⚠ BREAKING CHANGES * Shorten size labels in prop values for Row and Column, space tokens and classes ([#1940](https://github.com/Amsterdam/design-system/issues/1940), [#1951](https://github.com/Amsterdam/design-system/issues/1951)) * **Description List:** Rename values for terms column widths ([#1942](https://github.com/Amsterdam/design-system/issues/1942)) * **Aspect Ratio, Gap, Margin:** Use single dash in utility classes ([#1938](https://github.com/Amsterdam/design-system/issues/1938)) * Update aspect ratio tokens and CSS utility classes ([#1913](https://github.com/Amsterdam/design-system/issues/1913)) * **Header:** Add responsive version of Amsterdam Logo, remove Heading level 1 ([#1880](https://github.com/Amsterdam/design-system/issues/1880)) * **Heading:** Remove ‘level’ from class name ([#1904](https://github.com/Amsterdam/design-system/issues/1904)) * **Icon:** Rename size classes ([#1890](https://github.com/Amsterdam/design-system/issues/1890)) * **Footer:** add FooterMenu component to replace PageMenu in Footer ([#1871](https://github.com/Amsterdam/design-system/issues/1871)) * **Avatar:** Use updated color names for azure, lime and green ([#1867](https://github.com/Amsterdam/design-system/issues/1867)) * **Badge:** Use updated color names for azure and lime ([#1866](https://github.com/Amsterdam/design-system/issues/1866)) * **Spotlight:** Use updated color names for lime and green and remove purple as an explicit option ([#1865](https://github.com/Amsterdam/design-system/issues/1865)) ### Features * Add missing hyphenation behaviour to all text components ([#1864](https://github.com/Amsterdam/design-system/issues/1864)) ([6e933a6](https://github.com/Amsterdam/design-system/commit/6e933a6b9610ab76c187ae1d42c3e8817b9b7e66)) * **Aspect Ratio, Gap, Margin:** Use single dash in utility classes ([#1938](https://github.com/Amsterdam/design-system/issues/1938)) ([4762cdb](https://github.com/Amsterdam/design-system/commit/4762cdb05aa66b0afa89da264e84987e1d4b3e16)) * **Avatar:** Use updated color names for azure, lime and green ([#1867](https://github.com/Amsterdam/design-system/issues/1867)) ([e8a2638](https://github.com/Amsterdam/design-system/commit/e8a2638882b95141c5e5e345bb7656f1f9968253)) * **Badge:** Use updated color names for azure and lime ([#1866](https://github.com/Amsterdam/design-system/issues/1866)) ([fd25778](https://github.com/Amsterdam/design-system/commit/fd25778db56eeeecf2e716a72d25b91c49193fa1)) * Consolidate Grid Space and Component Space into one set of spacing tokens ([#1910](https://github.com/Amsterdam/design-system/issues/1910)) ([f36e985](https://github.com/Amsterdam/design-system/commit/f36e9855c78f582df95fa0906f0849c2832c25a3)) * **Description List:** Rename values for terms column widths ([#1942](https://github.com/Amsterdam/design-system/issues/1942)) ([e1a9669](https://github.com/Amsterdam/design-system/commit/e1a9669925927f1608433a4ae68676b925ba8bd2)) * **Dialog:** Change background colour of backdrop and add token for it ([#1876](https://github.com/Amsterdam/design-system/issues/1876)) ([d071bb4](https://github.com/Amsterdam/design-system/commit/d071bb4149d2789d967abcdb84ccdfa4d5b7aecc)) * **Footer:** add FooterMenu component to replace PageMenu in Footer ([#1871](https://github.com/Amsterdam/design-system/issues/1871)) ([85e0f0f](https://github.com/Amsterdam/design-system/commit/85e0f0f8c7fd9c281ba68155999e835921e4443d)) * **Header:** Add responsive version of Amsterdam Logo, remove Heading level 1 ([#1880](https://github.com/Amsterdam/design-system/issues/1880)) ([7de8138](https://github.com/Amsterdam/design-system/commit/7de813861a565da89fee246731dc1525bc5d2643)) * **Icon:** Add invisble text content to simplify baseline alignment ([#1905](https://github.com/Amsterdam/design-system/issues/1905)) ([190b588](https://github.com/Amsterdam/design-system/commit/190b58865dee4552cf2c304cbc4d193cf7e14036)) * Remove action tokens, add and implement cursor tokens ([#1860](https://github.com/Amsterdam/design-system/issues/1860)) ([40a04a8](https://github.com/Amsterdam/design-system/commit/40a04a88e8c5829df54eb3a6ca338557249aec5d)) * Rename and document common tokens for links ([#1870](https://github.com/Amsterdam/design-system/issues/1870)) ([551743d](https://github.com/Amsterdam/design-system/commit/551743d11436ff2363f8dd1187afe166e6c4a02b)) * Shorten size labels in border tokens ([#1941](https://github.com/Amsterdam/design-system/issues/1941)) ([fa154a6](https://github.com/Amsterdam/design-system/commit/fa154a6c96a11a43623f959a51f782abae27449e)) * Shorten size labels in prop values for Row and Column, space tokens and utility classes ([#1940](https://github.com/Amsterdam/design-system/issues/1940)) ([694987c](https://github.com/Amsterdam/design-system/commit/694987c88773983e4cd12d518cc957d34ec29d7e)) * **Icon:** Rename size classes ([#1890](https://github.com/Amsterdam/design-system/issues/1890)) ([3126aa2](https://github.com/Amsterdam/design-system/commit/3126aa29d5aebccfca272892d55f140783a94d43)) * **Spotlight:** Use updated color names for lime and green and remove purple as an explicit option ([#1865](https://github.com/Amsterdam/design-system/issues/1865)) ([387ae45](https://github.com/Amsterdam/design-system/commit/387ae45ce263ae3b6a12fc9a3b22a37dc0aed997)) * Update and document focus tokens ([#1919](https://github.com/Amsterdam/design-system/issues/1919)) ([4c85170](https://github.com/Amsterdam/design-system/commit/4c85170f2b8eec5ce956cecdbb41430ce2c37639)) * Update aspect ratio tokens and CSS utility classes ([#1913](https://github.com/Amsterdam/design-system/issues/1913)) ([968ef2b](https://github.com/Amsterdam/design-system/commit/968ef2bf053803c356e36424836fd9934da123fd)) * Update hyphenation tokens ([#1914](https://github.com/Amsterdam/design-system/issues/1914)) ([0c7f359](https://github.com/Amsterdam/design-system/commit/0c7f359ff094e281022441d171bd617047c660b2)) ### Bug Fixes * **Action Group:** Align content to center instead of baseline ([#1931](https://github.com/Amsterdam/design-system/issues/1931)) ([2ad1739](https://github.com/Amsterdam/design-system/commit/2ad17397009438d0d39a03a6fda5271e12e65e28)) * **Card:** Prevent other links than the Card Link from stretching ([#1898](https://github.com/Amsterdam/design-system/issues/1898)) ([a6d79b0](https://github.com/Amsterdam/design-system/commit/a6d79b01e50792c0c8a38629d4b403c1c63e1757)) * **Column, Row:** Do not use utility classes ([#1951](https://github.com/Amsterdam/design-system/issues/1951)) ([a5a74f8](https://github.com/Amsterdam/design-system/commit/a5a74f8bbb55ab54c7b179be29d4a804b088044a)) * **Dialog:** Prevent a focus indicator from being cut off ([#1879](https://github.com/Amsterdam/design-system/issues/1879)) ([336ff55](https://github.com/Amsterdam/design-system/commit/336ff554d2a4a213c1f62bd32b02219ca41a802c)) * **Gap:** Make sure grid display is always set ([#1945](https://github.com/Amsterdam/design-system/issues/1945)) ([cec37ae](https://github.com/Amsterdam/design-system/commit/cec37ae5482a3bace3afb59e903285aeb587396a)) * **Heading:** Remove ‘level’ from class name ([#1904](https://github.com/Amsterdam/design-system/issues/1904)) ([71ef1db](https://github.com/Amsterdam/design-system/commit/71ef1db68405455087065e73dadf90581173398d)) * **Icon:** Restore square appearance ([#1933](https://github.com/Amsterdam/design-system/issues/1933)) ([3237e9d](https://github.com/Amsterdam/design-system/commit/3237e9dda1536756d4202fb1e95489a39683ab13)) * **Tabs:** Remove unnecessary token, reuse color value ([#1932](https://github.com/Amsterdam/design-system/issues/1932)) ([cabfd59](https://github.com/Amsterdam/design-system/commit/cabfd5967a9c0cb17ab0bac627f19261f29bcf2e)) ## [0.14.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.14.0...design-system-css-v0.14.1) (2025-02-12) ### Features * **Tabs:** Scroll wide content of a Tab Panel horizontally ([#1855](https://github.com/Amsterdam/design-system/issues/1855)) ([8ece501](https://github.com/Amsterdam/design-system/commit/8ece501ad592728ef853a432b427b8b3b037e13e)) ## [0.14.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.13.1...design-system-css-v0.14.0) (2025-01-10) ### ⚠ BREAKING CHANGES * Add collapsible menu to Header ([#1784](https://github.com/Amsterdam/design-system/issues/1784)) * Disallow blue Spotlight and make purple the default ([#1798](https://github.com/Amsterdam/design-system/issues/1798)) * Replace Aspect Ratio component with utility classes and prop on Image ([#1593](https://github.com/Amsterdam/design-system/issues/1593)) * Use new Button features for SearchField ([#1695](https://github.com/Amsterdam/design-system/issues/1695)) ### Features * Add collapsible menu to Header ([#1784](https://github.com/Amsterdam/design-system/issues/1784)) ([44ce6d8](https://github.com/Amsterdam/design-system/commit/44ce6d8ac5a3fc48fd7de258c48fbafdd9928b9f)) * Add Figure component ([#1795](https://github.com/Amsterdam/design-system/issues/1795)) ([3505dcc](https://github.com/Amsterdam/design-system/commit/3505dcca183551dce318046f54ad4570cc6e6d2b)) * Add File List component to display below a File Input ([#1751](https://github.com/Amsterdam/design-system/issues/1751)) ([0192404](https://github.com/Amsterdam/design-system/commit/01924048c53805eb1536d2aa9b5454bcd44375b8)) * Add Icon to Error Message ([#1746](https://github.com/Amsterdam/design-system/issues/1746)) ([eca5fe4](https://github.com/Amsterdam/design-system/commit/eca5fe4ed0325b01860f816c70247c26e2158f9c)) * Allow an icon to display with an inverse color ([#1787](https://github.com/Amsterdam/design-system/issues/1787)) ([1f5d166](https://github.com/Amsterdam/design-system/commit/1f5d16697a1b332b6c1bbd830cda1220010a78d6)) * Disallow blue Spotlight and make purple the default ([#1798](https://github.com/Amsterdam/design-system/issues/1798)) ([8d1c266](https://github.com/Amsterdam/design-system/commit/8d1c266f3f7e90b02bcb240c41256578a80c7668)) * Let Footer set its own background colour ([#1797](https://github.com/Amsterdam/design-system/issues/1797)) ([310f595](https://github.com/Amsterdam/design-system/commit/310f59553a9ad057f3fe80b23bfda5acf108906d)) * Make active Tab look less like a primary Button ([#1773](https://github.com/Amsterdam/design-system/issues/1773)) ([2ec0102](https://github.com/Amsterdam/design-system/commit/2ec010286dd64ecebefa040a0ab18cf192542d0f)) * Make border of Radio thicker when hovering ([#1696](https://github.com/Amsterdam/design-system/issues/1696)) ([8839012](https://github.com/Amsterdam/design-system/commit/88390124aa5197f6c784dae4fc2a7c3e18d75ca6)) * Rename reset mixins to include element name ([#1738](https://github.com/Amsterdam/design-system/issues/1738)) ([92312fa](https://github.com/Amsterdam/design-system/commit/92312faf845fbb8d28494aa46a57bdc8f378f402)) * Replace Aspect Ratio component with utility classes and prop on Image ([#1593](https://github.com/Amsterdam/design-system/issues/1593)) ([766efba](https://github.com/Amsterdam/design-system/commit/766efbac45e8831a19f3e99bd9d0550028d8d4fd)) * Replace deprecated import statements in Sass with new API ([#1777](https://github.com/Amsterdam/design-system/issues/1777)) ([adcd819](https://github.com/Amsterdam/design-system/commit/adcd81962a757d5afd4864a5c79cfd99c141a065)) * Require an alt prop for every Image ([#1739](https://github.com/Amsterdam/design-system/issues/1739)) ([9145dff](https://github.com/Amsterdam/design-system/commit/9145dffd2a3767f5be19adc2683ba11c50dd9485)) * Stretch File Input to full width to match other inputs ([#1752](https://github.com/Amsterdam/design-system/issues/1752)) ([eeea7b6](https://github.com/Amsterdam/design-system/commit/eeea7b69df33d779ec9436113c3cba5aa11b7068)) * Use new Button features for SearchField ([#1695](https://github.com/Amsterdam/design-system/issues/1695)) ([7b275d0](https://github.com/Amsterdam/design-system/commit/7b275d0c803b309095ba7c425bb6bf04630775a9)) ### Bug Fixes * Correct layout of Description List if multiple terms share a description ([#1763](https://github.com/Amsterdam/design-system/issues/1763)) ([ca913af](https://github.com/Amsterdam/design-system/commit/ca913afd56aba3a8c2305479df9177bceea09804)) * Explicitly set row and column start and end in Overlap CSS ([#1776](https://github.com/Amsterdam/design-system/issues/1776)) ([efd2b99](https://github.com/Amsterdam/design-system/commit/efd2b99b353c92c2a95bae76d5f20802c144de50)) ## [0.13.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.13.0...design-system-css-v0.13.1) (2024-11-04) ### Bug Fixes * Broken link Dialog docs ([#1731](https://github.com/Amsterdam/design-system/issues/1731)) ([be0cf82](https://github.com/Amsterdam/design-system/commit/be0cf82a147ebdacc44903eb72a3840926f77886)) ## [0.13.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.12.0...design-system-css-v0.13.0) (2024-10-28) ### ⚠ BREAKING CHANGES * Rename Description List ‘details’ to ’description’ ([#1703](https://github.com/Amsterdam/design-system/issues/1703)) ### Bug Fixes * Rename Description List ‘details’ to ’description’ ([#1703](https://github.com/Amsterdam/design-system/issues/1703)) ([139d8cb](https://github.com/Amsterdam/design-system/commit/139d8cb5c8fc4ffc93a2283abeabda6b8364b7cc)) ## [0.12.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.11.1...design-system-css-v0.12.0) (2024-10-25) ### ⚠ BREAKING CHANGES * Add Action Group component, e.g. to wrap Dialog buttons in ([#1592](https://github.com/Amsterdam/design-system/issues/1592)) * Use inline SVG icon for Radio button ([#1460](https://github.com/Amsterdam/design-system/issues/1460)) * Remove unnecessary Dialog wrapper ([#1591](https://github.com/Amsterdam/design-system/issues/1591)) * Remove form from Dialog ([#1582](https://github.com/Amsterdam/design-system/issues/1582)) * Replace ‘on background’ props with ‘inverseColor’ and ‘contrastColor’ for Link, Link List Link, and Icon Button ([#1448](https://github.com/Amsterdam/design-system/issues/1448)) ### Features * Add Action Group component, e.g. to wrap Dialog buttons in ([#1592](https://github.com/Amsterdam/design-system/issues/1592)) ([d0ea054](https://github.com/Amsterdam/design-system/commit/d0ea054b98a7f2ee41bd9a8434b76a85e9b8c9f2)) * Add border to Avatar in forced colors mode ([#1578](https://github.com/Amsterdam/design-system/issues/1578)) ([1f29f35](https://github.com/Amsterdam/design-system/commit/1f29f358ab7b831c502e8fa2cbd284d1853ff6af)) * Add Breakout component that lets a figure stick out of a Spotlight ([#1397](https://github.com/Amsterdam/design-system/issues/1397)) ([715f4d6](https://github.com/Amsterdam/design-system/commit/715f4d6241353b9b9f1f68dad7b7773b9c618492)) * Add Hint as component and Label and FieldSet props ([#1499](https://github.com/Amsterdam/design-system/issues/1499)) ([3d86882](https://github.com/Amsterdam/design-system/commit/3d86882f22e4629a17a98cbbf96f03ad56620be9)) * Add initial Password Input component ([#1449](https://github.com/Amsterdam/design-system/issues/1449)) ([3cc863](https://github.com/Amsterdam/design-system/commit/3cc863ec8f1f2b50f79a426fd41676ab05838768)) * Add utility functions as methods to Dialog ([#1576](https://github.com/Amsterdam/design-system/issues/1576)) ([f25bc01](https://github.com/Amsterdam/design-system/commit/f25bc016f1cea8c81e4b341af515fcad2f00a416)) * Allow Button to display an icon without a label ([#1654](https://github.com/Amsterdam/design-system/issues/1654), [#1700](https://github.com/Amsterdam/design-system/issues/1700)) ([2d347b6](https://github.com/Amsterdam/design-system/commit/2d347b654b701cd6cce9182d5b6837960f41b551), [33c4c0e](https://github.com/Amsterdam/design-system/commit/33c4c0edefdf9c785bb828b0c61f0a120d697b02)) * Image slider ([#1595](https://github.com/Amsterdam/design-system/issues/1595)) ([58e7766](https://github.com/Amsterdam/design-system/commit/58e77661ad99acb5d3f6e10cbfca981345dc8704)) * Make terms bold instead of descriptions in Description List ([#1693](https://github.com/Amsterdam/design-system/issues/1693)) ([cc8f40e](https://github.com/Amsterdam/design-system/commit/cc8f40e631669a2f3423b7f55b8b129c025efcf9)) * Replace ‘on background’ props with ‘inverseColor’ and ‘contrastColor’ for Link, Link List Link, and Icon Button ([#1448](https://github.com/Amsterdam/design-system/issues/1448)) ([f5176b1](https://github.com/Amsterdam/design-system/commit/f5176b1e2c85c166fa2b6cb67d11ce0b1f9727a3)) * Remove form from Dialog ([#1582](https://github.com/Amsterdam/design-system/issues/1582)) ([4fb6e53](https://github.com/Amsterdam/design-system/commit/4fb6e53441f3bae914eb483da2f0537a65273fd2)) * Remove margin Safari sets on buttons ([#1529](https://github.com/Amsterdam/design-system/issues/1529)) ([2ccc1b](https://github.com/Amsterdam/design-system/commit/2ccc1bc4eba83a49c37213582fae5d9e7ee6fc98)) * Remove unnecessary Dialog wrapper ([#1591](https://github.com/Amsterdam/design-system/issues/1591)) ([450b0c3](https://github.com/Amsterdam/design-system/commit/450b0c3e9adf5bdd9fb868400e17aaaea4b2c545)) * Show selected and disabled Tabs in forced colors mode ([#1517](https://github.com/Amsterdam/design-system/issues/1517)) ([339bd1](https://github.com/Amsterdam/design-system/commit/339bd1eff89e095a96be048ea6f6311bbf3e7980)) * Show Switch in forced colors mode ([#1528](https://github.com/Amsterdam/design-system/issues/1528)) ([302ae7](https://github.com/Amsterdam/design-system/commit/302ae75ecc5de23cbb0f371d169daa9ed0a1a61c)) * Support various column widths for Description List ([#1697](https://github.com/Amsterdam/design-system/issues/1697)) ([5a98c07](https://github.com/Amsterdam/design-system/commit/5a98c07cad19eea38a2ff299378dc4dc5b80018c)) * Update spacing in Ordered and Unordered List ([#1632](https://github.com/Amsterdam/design-system/issues/1632)) ([986e023](https://github.com/Amsterdam/design-system/commit/986e023b83007560911724e819f54fb18c97f1dc)) * Use inline SVG icon for Radio button ([#1460](https://github.com/Amsterdam/design-system/issues/1460)) ([c19055b](https://github.com/Amsterdam/design-system/commit/c19055bd6453ce40ca43b31d599f14ec65d6037a)) ## [0.11.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.11.0...design-system-css-v0.11.1) (2024-08-29) ### Bug Fixes * Close Dialog without submit ([#1547](https://github.com/Amsterdam/design-system/issues/1547)) ([d9cc107](https://github.com/Amsterdam/design-system/commit/d9cc1079e2f784fd7002b7f785fcfdaa750cb240)) ## [0.11.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.10.0...design-system-css-v0.11.0) (2024-07-25) ### ⚠ BREAKING CHANGES * Apply default gap in Row and Column without extra class ([#1422](https://github.com/Amsterdam/design-system/issues/1422)) * Include ‘gap-’ in class names for Row and Column gap ([#1421](https://github.com/Amsterdam/design-system/issues/1421)) * Rename Form Field Character Counter to Character Count ([#1363](https://github.com/Amsterdam/design-system/issues/1363)) * Change CSS classes for Heading level for consistency with token names ([#1355](https://github.com/Amsterdam/design-system/issues/1355)) ### Features * Add documention for Gap and Margin utility classes ([#1427](https://github.com/Amsterdam/design-system/issues/1427)) ([6adbd13](https://github.com/Amsterdam/design-system/commit/6adbd13f2437c017e379caf315b0546d052ffd6d)) * Add focus on initial render to Form Error List ([#1328](https://github.com/Amsterdam/design-system/issues/1328)) ([09387b7](https://github.com/Amsterdam/design-system/commit/09387b7b7d5f03a7422910314de4ae4d0ccbb983)) * Add horizontal and vertical alignment options to Column ([#1428](https://github.com/Amsterdam/design-system/issues/1428)) ([d5a7766](https://github.com/Amsterdam/design-system/commit/d5a7766bfd60f62e4a9b69e369bfa08bbd425fa6)) * Add horizontal and vertical alignment options to Row ([#1330](https://github.com/Amsterdam/design-system/issues/1330)) ([1b9c269](https://github.com/Amsterdam/design-system/commit/1b9c269f10392d1ab6503e6b047849a586d56502)) * Allow a row to wrap its items onto multiple lines ([#1319](https://github.com/Amsterdam/design-system/issues/1319)) ([42424eb](https://github.com/Amsterdam/design-system/commit/42424ebb413b9976958883a7b03f5b0d31225c39)) * Apply default gap in Row and Column without extra class ([#1422](https://github.com/Amsterdam/design-system/issues/1422)) ([3af0b1f](https://github.com/Amsterdam/design-system/commit/3af0b1fb40ca941fd3966d08e6afe18995e6d02f)) * Improve sizing behaviour of Dialog ([#1329](https://github.com/Amsterdam/design-system/issues/1329)) ([a54d239](https://github.com/Amsterdam/design-system/commit/a54d239e2aff832bc15f8f90ea8880c02fa0d6ce)) * Let Form Error List add the error count to the document title ([#1309](https://github.com/Amsterdam/design-system/issues/1309)) ([f18f03b](https://github.com/Amsterdam/design-system/commit/f18f03bc3ce582099ec120176ea5c6abe265451e)) * Merge ‘stack’ and ‘inside’ space categories and update components ([#1267](https://github.com/Amsterdam/design-system/issues/1267)) ([a0de626](https://github.com/Amsterdam/design-system/commit/a0de626d4fbdc9e0eac71492d544d35ad4dc8769)) * Remove HeadingLevel type, group Heading sizes in story ([#1387](https://github.com/Amsterdam/design-system/issues/1387)) ([8d05017](https://github.com/Amsterdam/design-system/commit/8d050178d2a7991ae9bd620d096bfb956d14f9cf)) * Remove Visually Hidden component ([#1391](https://github.com/Amsterdam/design-system/issues/1391)) ([83a60ca](https://github.com/Amsterdam/design-system/commit/83a60ca5310704b3348440dd9f1ee8bc1f22811f)) * Rename Form Field Character Counter to Character Count ([#1363](https://github.com/Amsterdam/design-system/issues/1363)) ([a5299db](https://github.com/Amsterdam/design-system/commit/a5299dbfb3659bada5565893be63f615b511c0ee)) * Use flexbox and regular space in Column as we do in Row ([#1388](https://github.com/Amsterdam/design-system/issues/1388)) ([86d693c](https://github.com/Amsterdam/design-system/commit/86d693cf75be205cd096abe339cdd3f97e9b1a2f)) ### Bug Fixes * Change CSS classes for Heading level for consistency with token names ([#1355](https://github.com/Amsterdam/design-system/issues/1355)) ([7c34bbe](https://github.com/Amsterdam/design-system/commit/7c34bbea69b377b8e5efffd169374d383cddc54b)) * Include ‘gap-’ in class names for Row and Column gap ([#1421](https://github.com/Amsterdam/design-system/issues/1421)) ([21cfcbf](https://github.com/Amsterdam/design-system/commit/21cfcbfc80b8fd3dac797428ee42a52447a9b9de)) ## [0.10.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.9.0...design-system-css-v0.10.0) (2024-06-28) ### ⚠ BREAKING CHANGES * Allow additional background colours for Avatar and remove dark blue option ([#1257](https://github.com/Amsterdam/design-system/issues/1257)) * Rename title props for Alert, Header and Dialog and require it for Dialog ([#1251](https://github.com/Amsterdam/design-system/issues/1251)) ### Features * Add Form Error List ([#1252](https://github.com/Amsterdam/design-system/issues/1252)) ([e879942](https://github.com/Amsterdam/design-system/commit/e87994292f62434a1ebff704c909bea4a0feff25)) * Add Table of Contents component ([#1248](https://github.com/Amsterdam/design-system/issues/1248)) ([1f4c09a](https://github.com/Amsterdam/design-system/commit/1f4c09a08d2aa96d1c584eceb498d33c31aa52ad)) * Allow additional background colours for Avatar and remove dark blue option ([#1257](https://github.com/Amsterdam/design-system/issues/1257)) ([a1a3c8f](https://github.com/Amsterdam/design-system/commit/a1a3c8fc58f249f0cd9c7d8bd09cc46f3f48cb5c)) * Allow various types of text input ([#1259](https://github.com/Amsterdam/design-system/issues/1259)) ([dc1e5d5](https://github.com/Amsterdam/design-system/commit/dc1e5d5d0e1f7a1f9baa29581de11a3400d4d9da)) * Change values for tall, wide, and extra wide aspect ratios ([#1254](https://github.com/Amsterdam/design-system/issues/1254)) ([478508a](https://github.com/Amsterdam/design-system/commit/478508a758f311b89dfb8214813b25e50d875ff0)) * Rename title props for Alert, Header and Dialog and require it for Dialog ([#1251](https://github.com/Amsterdam/design-system/issues/1251)) ([bbec4de](https://github.com/Amsterdam/design-system/commit/bbec4de523bebb4d8187e713d4d79af228953674)) ### Bug Fixes * Fix FieldSet float issue ([#1268](https://github.com/Amsterdam/design-system/issues/1268)) ([5593916](https://github.com/Amsterdam/design-system/commit/5593916904db612f4dfa1c5d02c88add35d0103a)) * Start-align text in Accordion Button ([#1266](https://github.com/Amsterdam/design-system/issues/1266)) ([6eb474d](https://github.com/Amsterdam/design-system/commit/6eb474ddd50c344dd06da064689d5ed1a374d907)) ## [0.9.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.8.0...design-system-css-v0.9.0) (2024-06-05) ### ⚠ BREAKING CHANGES * Disallow directional style rules ([#1245](https://github.com/Amsterdam/design-system/issues/1245)) * Use invalid prop for most inputs ([#1240](https://github.com/Amsterdam/design-system/issues/1240)) * Add invalid prop to Field Set and update Field and Field Set docs ([#1237](https://github.com/Amsterdam/design-system/issues/1237)) * Allow additional background colours for Badge and remove dark blue option ([#1236](https://github.com/Amsterdam/design-system/issues/1236)) * Rename Breadcrumb Item to Link ([#1232](https://github.com/Amsterdam/design-system/issues/1232)) * Use logical properties for Search Field, Select, Text Area and Text Input ([#1226](https://github.com/Amsterdam/design-system/issues/1226)) * Flatten token names for default text size and line height ([#1221](https://github.com/Amsterdam/design-system/issues/1221)) ### Features * Add Error Message ([#1247](https://github.com/Amsterdam/design-system/issues/1247)) ([1dec2ea](https://github.com/Amsterdam/design-system/commit/1dec2ead41fba24e4128c2e1d60b72a7ccb29a92)) * Add Field component ([#1228](https://github.com/Amsterdam/design-system/issues/1228)) ([66832aa](https://github.com/Amsterdam/design-system/commit/66832aaf14a209915b60498acecf90cecff27c23)) * Add invalid prop to Field Set and update Field and Field Set docs ([#1237](https://github.com/Amsterdam/design-system/issues/1237)) ([d7316e8](https://github.com/Amsterdam/design-system/commit/d7316e81cd424f79f9bd655265d1c9b41296fecf)) * Allow additional background colours for Badge and remove dark blue option ([#1236](https://github.com/Amsterdam/design-system/issues/1236)) ([eec669a](https://github.com/Amsterdam/design-system/commit/eec669ad79353fc205e12a35aa7d0a8297c72e41)) * Allow installing only the React or CSS package ([#1206](https://github.com/Amsterdam/design-system/issues/1206)) ([963860d](https://github.com/Amsterdam/design-system/commit/963860d916d54ce3a0b191eb51a83cf3023ab88b)) * Allow small text for ordered lists ([#1219](https://github.com/Amsterdam/design-system/issues/1219)) ([0e77bd6](https://github.com/Amsterdam/design-system/commit/0e77bd60d8f395417c3c736d8e51a3ca3729ece5)) * Allow small text for unordered lists ([#1217](https://github.com/Amsterdam/design-system/issues/1217)) ([5012851](https://github.com/Amsterdam/design-system/commit/5012851492e50e50e2a651250622740e517fd22f)) * File Input ([#1218](https://github.com/Amsterdam/design-system/issues/1218)) ([7b6ba98](https://github.com/Amsterdam/design-system/commit/7b6ba98530caaefafedada5b89a175ef0b1a8784)) * Rename Breadcrumb Item to Link ([#1232](https://github.com/Amsterdam/design-system/issues/1232)) ([6cf2e5e](https://github.com/Amsterdam/design-system/commit/6cf2e5e51217900a24d739c4569c13237b9fb4ab)) * Start-align Dialog buttons and place the primary button first ([#1143](https://github.com/Amsterdam/design-system/issues/1143)) ([fd668c1](https://github.com/Amsterdam/design-system/commit/fd668c15c5fce9cf28b66b811d2463ada7165f7f)) * Use invalid prop for most inputs ([#1240](https://github.com/Amsterdam/design-system/issues/1240)) ([9477186](https://github.com/Amsterdam/design-system/commit/9477186b8432d6d20991e93d92c64a4357d6f391)) * Use logical properties for Search Field, Select, Text Area and Text Input ([#1226](https://github.com/Amsterdam/design-system/issues/1226)) ([4471c7a](https://github.com/Amsterdam/design-system/commit/4471c7a154e9f1f31dd92298f932f4bbc134dbf9)) ### Bug Fixes * Disallow directional style rules ([#1245](https://github.com/Amsterdam/design-system/issues/1245)) ([8ab6f81](https://github.com/Amsterdam/design-system/commit/8ab6f81d4cbcdb75b7acb986a145d49ccd1895c8)) * Fix issues with inputs on iOS ([#1241](https://github.com/Amsterdam/design-system/issues/1241)) ([dcd2f6e](https://github.com/Amsterdam/design-system/commit/dcd2f6e609699a5db6ee026d9d3024e13aff06c9)) * Flatten token names for default text size and line height ([#1221](https://github.com/Amsterdam/design-system/issues/1221)) ([6eeaeb4](https://github.com/Amsterdam/design-system/commit/6eeaeb41fae90a2d455b4e41da3ff3a4561dcbe4)) * Reset the lower placeholder opacity set by Firefox ([#1239](https://github.com/Amsterdam/design-system/issues/1239)) ([d2b371e](https://github.com/Amsterdam/design-system/commit/d2b371e02c385b2ee8371c9ca0c85ea5c0e706aa)) ## [0.8.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.7.1...design-system-css-v0.8.0) (2024-04-22) ### ⚠ BREAKING CHANGES * Rename Form Label to Label ([#1201](https://github.com/Amsterdam/design-system/issues/1201)) * Allow setting a background colour on Tabs List ([#1142](https://github.com/Amsterdam/design-system/issues/1142)) ### Features * Add background colour and full-height prop to Screen ([#1144](https://github.com/Amsterdam/design-system/issues/1144)) ([c4621e8](https://github.com/Amsterdam/design-system/commit/c4621e817cb0306fe109046d41847725d47b33a2)) * Add border tokens and use rems for widths ([#1147](https://github.com/Amsterdam/design-system/issues/1147)) ([d91d889](https://github.com/Amsterdam/design-system/commit/d91d889c3a529a90167bd9b9d0d9c3174b2b0e05)) * Add date input ([#1152](https://github.com/Amsterdam/design-system/issues/1152)) ([afbbef8](https://github.com/Amsterdam/design-system/commit/afbbef8bb1a3d13fa47638ce2856def0c028b13f)) * Add Description List component ([#1139](https://github.com/Amsterdam/design-system/issues/1139)) ([ee3428a](https://github.com/Amsterdam/design-system/commit/ee3428ab701ea3980f26a8562acbecc6e4eb031e)) * Add document-level classes and guidelines ([#1136](https://github.com/Amsterdam/design-system/issues/1136)) ([c13d91d](https://github.com/Amsterdam/design-system/commit/c13d91d418dd0a596de9e65e3c4f729e04e75bfd)) * Allow setting a background colour on Tabs List ([#1142](https://github.com/Amsterdam/design-system/issues/1142)) ([fedb1a1](https://github.com/Amsterdam/design-system/commit/fedb1a1d8f54decc81e5bd5081f8eb9a35dfb9b6)) * Remove border from accordion section and move chevron to the left ([#1116](https://github.com/Amsterdam/design-system/issues/1116)) ([3e23677](https://github.com/Amsterdam/design-system/commit/3e2367738664dcd0e4d3d4267c021c0992572da7)) * Rename Form Label to Label ([#1201](https://github.com/Amsterdam/design-system/issues/1201)) ([c5f82ab](https://github.com/Amsterdam/design-system/commit/c5f82abcc41ac4652af6c270325441d448d65525)) * Restore wrapping of items in Page Menu ([#1145](https://github.com/Amsterdam/design-system/issues/1145)) ([4068e52](https://github.com/Amsterdam/design-system/commit/4068e52bee9bba087ef9fd94bcf2a292c4affad9)) * Select component ([#1151](https://github.com/Amsterdam/design-system/issues/1151)) ([7679acc](https://github.com/Amsterdam/design-system/commit/7679acc7542c2e3d1279b9eaa364031092d16016)) * Set explicit white background on text fields ([#1200](https://github.com/Amsterdam/design-system/issues/1200)) ([e22d48e](https://github.com/Amsterdam/design-system/commit/e22d48eae8994eb370e3edef38a0ca1e015925bf)) * Time input component ([#1202](https://github.com/Amsterdam/design-system/issues/1202)) ([ccec68e](https://github.com/Amsterdam/design-system/commit/ccec68efafa02d5f9ac9bd4abea6c5e7cb72d556)) ### Bug Fixes * Fix SearchField styling on Safari on iOS ([#1203](https://github.com/Amsterdam/design-system/issues/1203)) ([eb05fff](https://github.com/Amsterdam/design-system/commit/eb05fff8295af3c59ef584700e3c1bc06da0c924)) ## [0.7.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.7.0...design-system-css-v0.7.1) (2024-03-22) ### Features * Add Avatar component ([#1134](https://github.com/Amsterdam/design-system/issues/1134)) ([8dec2cf](https://github.com/Amsterdam/design-system/commit/8dec2cff8f7885ccb163774c0dc979fb2c781256)) * Add Form Field Character Counter ([#1114](https://github.com/Amsterdam/design-system/issues/1114)) ([779ae8c](https://github.com/Amsterdam/design-system/commit/779ae8c9764b23508ffbfb38c6dc2f7a7c1cbd28)) ### Bug Fixes * Use semantic Heading for the title of a Dialog ([#1123](https://github.com/Amsterdam/design-system/issues/1123)) ([0493fd8](https://github.com/Amsterdam/design-system/commit/0493fd87587d36a83bb7aa9cbb69b8debf5d66f0)) ## [0.7.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.6.1...design-system-css-v0.7.0) (2024-03-12) ### ⚠ BREAKING CHANGES * Shorten namespaces in theme and tokens ([#1125](https://github.com/Amsterdam/design-system/issues/1125)) ### Features * Shorten namespaces in theme and tokens ([#1125](https://github.com/Amsterdam/design-system/issues/1125)) ([1c81f3b](https://github.com/Amsterdam/design-system/commit/1c81f3bd14c1f202eec2341aec1888fb74d956d5)) ## [0.6.1](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.6.0...design-system-css-v0.6.1) (2024-03-11) ### Bug Fixes * Button fixes ([#1122](https://github.com/Amsterdam/design-system/issues/1122)) ([b5a9504](https://github.com/Amsterdam/design-system/commit/b5a950491f46710d92526ce6012f7d76992a569f)) ## [0.6.0](https://github.com/Amsterdam/design-system/compare/design-system-css-v0.5.0...design-system-css-v0.6.0) (2024-03-08) ### ⚠ BREAKING CHANGES * Rename ‘header logo’ to ‘header logo link’ and add missing token for outline offset ([#1108](https://github.com/Amsterdam/design-system/issues/1108)) * Merge tokens for start and end padding ([#1112](https://github.com/Amsterdam/design-system/issues/1112)) * Use spacing tokens in Grid component ([#1089](https://github.com/Amsterdam/design-system/issues/1089)) * Remove whitespace at the right end of dialog content ([#1091](https://github.com/Amsterdam/design-system/issues/1091)) ### Features * Add and use tokens for inside space ([#1093](https://github.com/Amsterdam/design-system/issues/1093)) ([81c9f7a](https://github.com/Amsterdam/design-system/commit/81c9f7acece4f6747150416a3db9f1258c2f6b3d)) * Add Column component and Gap and Margin utilities for vertical spacing ([#1083](https://github.com/Amsterdam/design-system/issues/1083)) ([d092cb3](https://github.com/Amsterdam/design-system/commit/d092cb30e865f712b91b9b197803db7443e2c8cc)) * Add Fieldset component ([#1081](https://github.com/Amsterdam/design-system/issues/1081)) ([e9683c7](https://github.com/Amsterdam/design-system/commit/e9683c7a603fcfd031d6f24769789cc0d63b3c3d)) * Add Radio, update Checkbox and Switch ([#1100](https://github.