@amsterdam/design-system-tokens 0.1.7 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/_variables.scss +240 -152
  3. package/dist/index.css +240 -152
  4. package/dist/index.d.ts +222 -134
  5. package/dist/index.js +227 -139
  6. package/dist/index.json +226 -138
  7. package/dist/index.tokens.json +388 -271
  8. package/dist/root.css +240 -152
  9. package/dist/tokens.d.ts +372 -255
  10. package/dist/tokens.js +4043 -2036
  11. package/dist/variables.less +240 -152
  12. package/package.json +2 -2
  13. package/src/brand/amsterdam/typography.tokens.json +70 -84
  14. package/src/common/amsterdam/link-appearance.tokens.json +31 -0
  15. package/src/components/amsterdam/accordion.tokens.json +8 -7
  16. package/src/components/amsterdam/alert.tokens.json +6 -5
  17. package/src/components/amsterdam/blockquote.tokens.json +6 -5
  18. package/src/components/amsterdam/breadcrumb.tokens.json +19 -34
  19. package/src/components/amsterdam/button.tokens.json +6 -4
  20. package/src/components/amsterdam/card.tokens.json +6 -2
  21. package/src/components/amsterdam/checkbox.tokens.json +7 -13
  22. package/src/components/amsterdam/dialog.tokens.json +48 -0
  23. package/src/components/amsterdam/form-label.tokens.json +6 -5
  24. package/src/components/amsterdam/grid.tokens.json +6 -6
  25. package/src/components/amsterdam/heading.tokens.json +44 -28
  26. package/src/components/amsterdam/icon.tokens.json +37 -28
  27. package/src/components/amsterdam/link.tokens.json +41 -33
  28. package/src/components/amsterdam/logo.tokens.json +10 -0
  29. package/src/components/amsterdam/ordered-list.tokens.json +6 -5
  30. package/src/components/amsterdam/page-heading.tokens.json +17 -8
  31. package/src/components/amsterdam/page-menu.tokens.json +13 -9
  32. package/src/components/amsterdam/pagination.tokens.json +17 -18
  33. package/src/components/amsterdam/paragraph.tokens.json +22 -19
  34. package/src/components/amsterdam/top-task-link.tokens.json +25 -47
  35. package/src/components/amsterdam/unordered-list.tokens.json +6 -5
  36. package/src/components/utrecht/button.tokens.json +1 -3
  37. package/src/components/amsterdam/footer.tokens.json +0 -11
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 17 Nov 2023 13:11:47 GMT
3
+ * Generated on Fri, 01 Dec 2023 15:48:43 GMT
4
4
  */
5
5
 
6
6
  export const amsterdamColorPrimaryBlack = "#000000";
@@ -28,34 +28,53 @@ export const amsterdamProportion2xWide = "32 / 9";
28
28
  export const amsterdamTypographyFontFamily = "'Amsterdam Sans', Arial, sans-serif";
29
29
  export const amsterdamTypographyFontWeightNormal = 400;
30
30
  export const amsterdamTypographyFontWeightBold = 800;
31
- export const amsterdamTypographyTextLevel0NarrowFontSize = "clamp(2rem, calc(2rem + (2 * (100vw - 20rem)) / 33.3125), 4rem)";
32
- export const amsterdamTypographyTextLevel0WideFontSize = "clamp(4rem, calc(4rem + (1 * (100vw - 53.375rem)) / 36.625), 5rem)";
33
- export const amsterdamTypographyTextLevel0LineHeight = "1.1";
34
- export const amsterdamTypographyTextLevel1NarrowFontSize = "clamp(2rem, calc(2rem + (1 * (100vw - 20rem)) / 33.3125), 3rem)";
35
- export const amsterdamTypographyTextLevel1WideFontSize = "clamp(3rem, calc(3rem + (0.5 * (100vw - 53.375rem)) / 36.625), 3.5rem)";
36
- export const amsterdamTypographyTextLevel1LineHeight = "1.2";
37
- export const amsterdamTypographyTextLevel2NarrowFontSize = "clamp(1.75rem, calc(1.75rem + (0.5 * (100vw - 20rem)) / 33.3125), 2.25rem)";
38
- export const amsterdamTypographyTextLevel2WideFontSize = "clamp(2.25rem, calc(2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625), 2.5rem)";
39
- export const amsterdamTypographyTextLevel2LineHeight = "1.3";
40
- export const amsterdamTypographyTextLevel3NarrowFontSize = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
41
- export const amsterdamTypographyTextLevel3WideFontSize = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
42
- export const amsterdamTypographyTextLevel3LineHeight = "1.4";
43
- export const amsterdamTypographyTextLevel4NarrowFontSize = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
44
- export const amsterdamTypographyTextLevel4WideFontSize = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
45
- export const amsterdamTypographyTextLevel4LineHeight = "1.4";
46
- export const amsterdamTypographyTextLevel5NarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
47
- export const amsterdamTypographyTextLevel5WideFontSize = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
48
- export const amsterdamTypographyTextLevel5LineHeight = "1.5";
49
- export const amsterdamTypographyTextLevel6NarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
50
- export const amsterdamTypographyTextLevel6WideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
51
- export const amsterdamTypographyTextLevel6LineHeight = "1.6";
52
- export const amsterdamTypographyTextLevel7NarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
53
- export const amsterdamTypographyTextLevel7WideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
54
- export const amsterdamTypographyTextLevel7LineHeight = "1.6";
31
+ export const amsterdamTypographySpaciousTextLevel0FontSize = "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)";
32
+ export const amsterdamTypographySpaciousTextLevel0LineHeight = "1.1";
33
+ export const amsterdamTypographySpaciousTextLevel1FontSize = "clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem)";
34
+ export const amsterdamTypographySpaciousTextLevel1LineHeight = "1.2";
35
+ export const amsterdamTypographySpaciousTextLevel2FontSize = "clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem)";
36
+ export const amsterdamTypographySpaciousTextLevel2LineHeight = "1.3";
37
+ export const amsterdamTypographySpaciousTextLevel3FontSize = "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)";
38
+ export const amsterdamTypographySpaciousTextLevel3LineHeight = "1.4";
39
+ export const amsterdamTypographySpaciousTextLevel4FontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
40
+ export const amsterdamTypographySpaciousTextLevel4LineHeight = "1.4";
41
+ export const amsterdamTypographySpaciousTextLevel5FontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
42
+ export const amsterdamTypographySpaciousTextLevel5LineHeight = "1.5";
43
+ export const amsterdamTypographySpaciousTextLevel6FontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
44
+ export const amsterdamTypographySpaciousTextLevel6LineHeight = "1.6";
45
+ export const amsterdamTypographySpaciousTextLevel7FontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
46
+ export const amsterdamTypographySpaciousTextLevel7LineHeight = "1.6";
47
+ export const amsterdamTypographyCompactTextLevel0FontSize = "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)";
48
+ export const amsterdamTypographyCompactTextLevel0LineHeight = "1.1";
49
+ export const amsterdamTypographyCompactTextLevel1FontSize = "clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem)";
50
+ export const amsterdamTypographyCompactTextLevel1LineHeight = "1.2";
51
+ export const amsterdamTypographyCompactTextLevel2FontSize = "clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem)";
52
+ export const amsterdamTypographyCompactTextLevel2LineHeight = "1.3";
53
+ export const amsterdamTypographyCompactTextLevel3FontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
54
+ export const amsterdamTypographyCompactTextLevel3LineHeight = "1.4";
55
+ export const amsterdamTypographyCompactTextLevel4FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
56
+ export const amsterdamTypographyCompactTextLevel4LineHeight = "1.4";
57
+ export const amsterdamTypographyCompactTextLevel5FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
58
+ export const amsterdamTypographyCompactTextLevel5LineHeight = "1.5";
59
+ export const amsterdamTypographyCompactTextLevel6FontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
60
+ export const amsterdamTypographyCompactTextLevel6LineHeight = "1.6";
61
+ export const amsterdamTypographyCompactTextLevel7FontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
62
+ export const amsterdamTypographyCompactTextLevel7LineHeight = "1.6";
55
63
  export const amsterdamBorderWidthSm = "1px";
56
64
  export const amsterdamBorderWidthMd = "2px";
57
65
  export const amsterdamBorderWidthLg = "3px";
58
66
  export const amsterdamFocusOutlineOffset = "2px";
67
+ export const amsterdamLinkAppearanceColor = "#004699";
68
+ export const amsterdamLinkAppearanceTextDecorationThickness = "0.125rem";
69
+ export const amsterdamLinkAppearanceTextUnderlineOffset = "0.375rem";
70
+ export const amsterdamLinkAppearanceHoverColor = "#102E62";
71
+ export const amsterdamLinkAppearanceOnBackgroundDarkColor = "#ffffff";
72
+ export const amsterdamLinkAppearanceOnBackgroundLightColor = "#000000";
73
+ export const amsterdamLinkAppearanceRegularTextDecorationLine = "underline";
74
+ export const amsterdamLinkAppearanceRegularHoverTextDecorationThickness = "0.1875rem";
75
+ export const amsterdamLinkAppearanceRegularHoverTextUnderlineOffset = "0.3125rem";
76
+ export const amsterdamLinkAppearanceSubtleTextDecorationLine = "none";
77
+ export const amsterdamLinkAppearanceSubtleHoverTextDecorationLine = "underline";
59
78
  export const amsterdamSpacingInsetSm = "0.5rem";
60
79
  export const amsterdamSpacingInsetMd = "1rem";
61
80
  export const amsterdamSpacingInsetLg = "1.5rem";
@@ -64,10 +83,11 @@ export const amsterdamAccordionButtonColor = "#004699";
64
83
  export const amsterdamAccordionButtonFocusOutlineOffset = "2px";
65
84
  export const amsterdamAccordionButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
66
85
  export const amsterdamAccordionButtonFontWeight = 800;
67
- export const amsterdamAccordionButtonLineHeight = "1.5";
68
- export const amsterdamAccordionButtonNarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
69
- export const amsterdamAccordionButtonWideFontSize = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
70
86
  export const amsterdamAccordionButtonHoverBoxShadow = "inset 0 0 0 2px #767676";
87
+ export const amsterdamAccordionButtonSpaciousFontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
88
+ export const amsterdamAccordionButtonSpaciousLineHeight = "1.5";
89
+ export const amsterdamAccordionButtonCompactFontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
90
+ export const amsterdamAccordionButtonCompactLineHeight = "1.5";
71
91
  export const amsterdamAlertBackgroundColor = "#FFE600";
72
92
  export const amsterdamAlertBorder = "4px solid #FFE600";
73
93
  export const amsterdamAlertGap = "1rem";
@@ -78,9 +98,10 @@ export const amsterdamAlertPaddingInlineEnd = "1.5rem";
78
98
  export const amsterdamAlertTitleColor = "#000000";
79
99
  export const amsterdamAlertTitleFontFamily = "'Amsterdam Sans', Arial, sans-serif";
80
100
  export const amsterdamAlertTitleFontWeight = 800;
81
- export const amsterdamAlertTitleLineHeight = "1.5";
82
- export const amsterdamAlertTitleNarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
83
- export const amsterdamAlertTitleWideFontSize = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
101
+ export const amsterdamAlertTitleSpaciousFontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
102
+ export const amsterdamAlertTitleSpaciousLineHeight = "1.5";
103
+ export const amsterdamAlertTitleCompactFontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
104
+ export const amsterdamAlertTitleCompactLineHeight = "1.5";
84
105
  export const amsterdamAlertErrorBackgroundColor = "#ffffff";
85
106
  export const amsterdamAlertErrorBorderColor = "#EC0000";
86
107
  export const amsterdamAlertSuccessBackgroundColor = "#ffffff";
@@ -98,29 +119,39 @@ export const amsterdamBlockquoteColor = "#000000";
98
119
  export const amsterdamBlockquoteFontFamily = "'Amsterdam Sans', Arial, sans-serif";
99
120
  export const amsterdamBlockquoteFontWeight = 800;
100
121
  export const amsterdamBlockquoteInverseColor = "#ffffff";
101
- export const amsterdamBlockquoteLineHeight = "1.4";
102
- export const amsterdamBlockquoteNarrowFontSize = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
103
- export const amsterdamBlockquoteWideFontSize = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
104
- export const amsterdamBreadcrumbColor = "#004699";
122
+ export const amsterdamBlockquoteSpaciousFontSize = "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)";
123
+ export const amsterdamBlockquoteSpaciousLineHeight = "1.4";
124
+ export const amsterdamBlockquoteCompactFontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
125
+ export const amsterdamBlockquoteCompactLineHeight = "1.4";
105
126
  export const amsterdamBreadcrumbFontFamily = "'Amsterdam Sans', Arial, sans-serif";
106
127
  export const amsterdamBreadcrumbFontWeight = 400;
107
- export const amsterdamBreadcrumbLineHeight = "1.6";
108
- export const amsterdamBreadcrumbNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
109
- export const amsterdamBreadcrumbWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
128
+ export const amsterdamBreadcrumbSeparatorBackgroundColor = "#004699";
129
+ export const amsterdamBreadcrumbItemLinkColor = "#004699";
110
130
  export const amsterdamBreadcrumbItemLinkOutlineOffset = "2px";
131
+ export const amsterdamBreadcrumbItemLinkTextDecorationLine = "none";
132
+ export const amsterdamBreadcrumbItemLinkTextDecorationThickness = "0.125rem";
133
+ export const amsterdamBreadcrumbItemLinkTextUnderlineOffset = "0.375rem";
111
134
  export const amsterdamBreadcrumbItemLinkHoverColor = "#102E62";
112
- export const amsterdamBreadcrumbItemLinkHoverBoxShadow = "inset 0 -2px 0 0 #102E62";
113
- export const amsterdamBreadcrumbItemLinkFocusColor = "#102E62";
114
- export const amsterdamBreadcrumbItemLinkFocusTextDecoration = "underline";
115
- export const amsterdamButtonNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
116
- export const amsterdamButtonWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
135
+ export const amsterdamBreadcrumbItemLinkHoverTextDecorationLine = "underline";
136
+ export const amsterdamBreadcrumbSpaciousFontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
137
+ export const amsterdamBreadcrumbSpaciousLineHeight = "1.6";
138
+ export const amsterdamBreadcrumbCompactFontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
139
+ export const amsterdamBreadcrumbCompactLineHeight = "1.6";
140
+ export const amsterdamButtonSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
141
+ export const amsterdamButtonSpaciousLineHeight = "1.6";
142
+ export const amsterdamButtonCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
143
+ export const amsterdamButtonCompactLineHeight = "1.6";
117
144
  export const amsterdamButtonSecondaryBoxShadow = "inset 0 0 0 2px #004699";
118
145
  export const amsterdamButtonSecondaryHoverBoxShadow = "inset 0 0 0 3px #102E62";
119
146
  export const amsterdamButtonSecondaryDisabledBoxShadow = "inset 0 0 0 2px #B4B4B4";
120
147
  export const amsterdamButtonSecondaryFocusBoxShadow = "inset 0 0 0 2px #004699";
121
148
  export const amsterdamButtonTertiaryHoverBoxShadow = "inset 0 0 0 2px #767676";
122
149
  export const amsterdamCardLinkColor = "#004699";
150
+ export const amsterdamCardLinkTextDecorationLine = "none";
151
+ export const amsterdamCardLinkTextDecorationThickness = "0.125rem";
152
+ export const amsterdamCardLinkTextUnderlineOffset = "0.375rem";
123
153
  export const amsterdamCardLinkHoverColor = "#102E62";
154
+ export const amsterdamCardLinkHoverTextDecorationLine = "underline";
124
155
  export const amsterdamCardOutlineOffset = "2px";
125
156
  export const amsterdamCheckboxColor = "#000000";
126
157
  export const amsterdamCheckboxCheckmarkBorderColor = "#004699";
@@ -140,47 +171,71 @@ export const amsterdamCheckboxCheckmarkInvalidIndeterminateBackgroundColor = "#E
140
171
  export const amsterdamCheckboxCheckmarkInvalidIndeterminateHoverBackgroundColor = "#EC0000";
141
172
  export const amsterdamCheckboxCheckmarkIndeterminateBackgroundColor = "#004699";
142
173
  export const amsterdamCheckboxCheckmarkIndeterminateHoverBackgroundColor = "#102E62";
143
- export const amsterdamCheckboxCheckmarkNarrowSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
144
- export const amsterdamCheckboxCheckmarkWideSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
145
- export const amsterdamCheckboxCheckmarkMultiplier = "1.6";
146
174
  export const amsterdamCheckboxDisabledColor = "#767676";
147
175
  export const amsterdamCheckboxFontFamily = "'Amsterdam Sans', Arial, sans-serif";
148
176
  export const amsterdamCheckboxFontWeight = 400;
149
177
  export const amsterdamCheckboxHoverColor = "#102E62";
150
178
  export const amsterdamCheckboxOutlineOffset = "2px";
151
- export const amsterdamCheckboxLineHeight = "1.6";
152
- export const amsterdamCheckboxNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
153
- export const amsterdamCheckboxWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
154
- export const amsterdamFooterTopBackgroundColor = "#004699";
179
+ export const amsterdamCheckboxSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
180
+ export const amsterdamCheckboxSpaciousLineHeight = "1.6";
181
+ export const amsterdamCheckboxCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
182
+ export const amsterdamCheckboxCompactLineHeight = "1.6";
183
+ export const amsterdamDialogBackgroundColor = "#ffffff";
184
+ export const amsterdamDialogBorder = "0";
185
+ export const amsterdamDialogMaxInlineSize = "min(87.69vw, 45rem)";
186
+ export const amsterdamDialogTitleColor = "#000000";
187
+ export const amsterdamDialogTitleFontFamily = "'Amsterdam Sans', Arial, sans-serif";
188
+ export const amsterdamDialogTitleFontWeight = 800;
189
+ export const amsterdamDialogTitleSpaciousFontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
190
+ export const amsterdamDialogTitleSpaciousLineHeight = "1.5";
191
+ export const amsterdamDialogTitleCompactFontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
192
+ export const amsterdamDialogTitleCompactLineHeight = "1.5";
193
+ export const amsterdamDialogBackdropBackground = "#0006";
194
+ export const amsterdamDialogCloseBackgroundColor = "transparent";
195
+ export const amsterdamDialogCloseFill = "#000000";
196
+ export const amsterdamDialogCloseHoverFill = "#004699";
197
+ export const amsterdamDialogFormGap = "1.5rem";
198
+ export const amsterdamDialogFormPaddingBlock = "clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem)";
199
+ export const amsterdamDialogFormPaddingInline = "clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem)";
200
+ export const amsterdamDialogFormMaxBlockSize = "75vh";
201
+ export const amsterdamDialogArticlePaddingInlineEnd = "1.5rem";
202
+ export const amsterdamDialogHeaderGap = "1rem";
203
+ export const amsterdamDialogFooterGap = "1rem";
204
+ export const amsterdamDialogFooterPaddingBlock = "1.5rem 0";
155
205
  export const amsterdamFormLabelColor = "#000000";
156
206
  export const amsterdamFormLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
157
207
  export const amsterdamFormLabelFontWeight = 800;
158
- export const amsterdamFormLabelLineHeight = "1.6";
159
- export const amsterdamFormLabelNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
160
- export const amsterdamFormLabelWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
208
+ export const amsterdamFormLabelSpaciousFontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
209
+ export const amsterdamFormLabelSpaciousLineHeight = "1.6";
210
+ export const amsterdamFormLabelCompactFontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
211
+ export const amsterdamFormLabelCompactLineHeight = "1.6";
161
212
  export const amsterdamGridColumnCount = "4";
162
- export const amsterdamGridDensityLowGap = "clamp(1rem, 3.125vw + 0.375rem, 3.5rem)"; // Grows from 16px at 320px wide to 56px at 1600px wide.
163
- export const amsterdamGridDensityLowPaddingInline = "clamp(1.5rem, 4.6875vw + 0.5625rem, 5.25rem)"; // Equals 1.5 times the gap.
164
- export const amsterdamGridDensityHighGap = "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)"; // Grows from 16px at 1088px wide to 40px at 2624px wide.
165
- export const amsterdamGridDensityHighPaddingInline = "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)"; // Equals the gap.
213
+ export const amsterdamGridSpaciousGap = "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)"; // Grows from 16px at 320px wide to 56px at 1600px wide.
214
+ export const amsterdamGridSpaciousPaddingInline = "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)"; // Equals 1.5 times the gap.
215
+ export const amsterdamGridCompactGap = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)"; // Grows from 16px at 1088px wide to 40px at 2624px wide.
216
+ export const amsterdamGridCompactPaddingInline = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)"; // Equals the gap.
166
217
  export const amsterdamGridMediumColumnCount = "8";
167
218
  export const amsterdamGridWideColumnCount = "12";
168
- export const amsterdamHeading1LineHeight = "1.2";
169
- export const amsterdamHeading1NarrowFontSize = "clamp(2rem, calc(2rem + (1 * (100vw - 20rem)) / 33.3125), 3rem)";
170
- export const amsterdamHeading1WideFontSize = "clamp(3rem, calc(3rem + (0.5 * (100vw - 53.375rem)) / 36.625), 3.5rem)";
171
- export const amsterdamHeading2LineHeight = "1.3";
172
- export const amsterdamHeading2NarrowFontSize = "clamp(1.75rem, calc(1.75rem + (0.5 * (100vw - 20rem)) / 33.3125), 2.25rem)";
173
- export const amsterdamHeading2WideFontSize = "clamp(2.25rem, calc(2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625), 2.5rem)";
174
- export const amsterdamHeading3LineHeight = "1.4";
175
- export const amsterdamHeading3NarrowFontSize = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
176
- export const amsterdamHeading3WideFontSize = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
177
- export const amsterdamHeading4LineHeight = "1.4";
178
- export const amsterdamHeading4NarrowFontSize = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
179
- export const amsterdamHeading4WideFontSize = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
180
219
  export const amsterdamHeadingColor = "#000000";
181
220
  export const amsterdamHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
182
221
  export const amsterdamHeadingFontWeight = 800;
183
222
  export const amsterdamHeadingInverseColor = "#ffffff";
223
+ export const amsterdamHeadingSpaciousLevel1LineHeight = "1.2";
224
+ export const amsterdamHeadingSpaciousLevel1FontSize = "clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem)";
225
+ export const amsterdamHeadingSpaciousLevel2LineHeight = "1.3";
226
+ export const amsterdamHeadingSpaciousLevel2FontSize = "clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem)";
227
+ export const amsterdamHeadingSpaciousLevel3LineHeight = "1.4";
228
+ export const amsterdamHeadingSpaciousLevel3FontSize = "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)";
229
+ export const amsterdamHeadingSpaciousLevel4LineHeight = "1.4";
230
+ export const amsterdamHeadingSpaciousLevel4FontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
231
+ export const amsterdamHeadingCompactLevel1LineHeight = "1.2";
232
+ export const amsterdamHeadingCompactLevel1FontSize = "clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem)";
233
+ export const amsterdamHeadingCompactLevel2LineHeight = "1.3";
234
+ export const amsterdamHeadingCompactLevel2FontSize = "clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem)";
235
+ export const amsterdamHeadingCompactLevel3LineHeight = "1.4";
236
+ export const amsterdamHeadingCompactLevel3FontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
237
+ export const amsterdamHeadingCompactLevel4LineHeight = "1.4";
238
+ export const amsterdamHeadingCompactLevel4FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
184
239
  export const amsterdamHighlightBlueBackgroundColor = "#004699";
185
240
  export const amsterdamHighlightDarkGreenBackgroundColor = "#00A03C";
186
241
  export const amsterdamHighlightGreenBackgroundColor = "#BED200";
@@ -189,63 +244,77 @@ export const amsterdamHighlightMagentaBackgroundColor = "#E50082";
189
244
  export const amsterdamHighlightOrangeBackgroundColor = "#FF9100";
190
245
  export const amsterdamHighlightPurpleBackgroundColor = "#A00078";
191
246
  export const amsterdamHighlightYellowBackgroundColor = "#FFE600";
192
- export const amsterdamIconSize3IconSizeNarrow = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
193
- export const amsterdamIconSize3IconSizeWide = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
194
- export const amsterdamIconSize3ContainerMultiplier = "1.4";
195
- export const amsterdamIconSize4IconSizeNarrow = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
196
- export const amsterdamIconSize4IconSizeWide = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
197
- export const amsterdamIconSize4ContainerMultiplier = "1.4";
198
- export const amsterdamIconSize5IconSizeNarrow = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
199
- export const amsterdamIconSize5IconSizeWide = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
200
- export const amsterdamIconSize5ContainerMultiplier = "1.5";
201
- export const amsterdamIconSize6IconSizeNarrow = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
202
- export const amsterdamIconSize6IconSizeWide = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
203
- export const amsterdamIconSize6ContainerMultiplier = "1.6";
204
- export const amsterdamIconSize7IconSizeNarrow = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
205
- export const amsterdamIconSize7IconSizeWide = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
206
- export const amsterdamIconSize7ContainerMultiplier = "1.6";
247
+ export const amsterdamIconSpaciousSize3FontSize = "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)";
248
+ export const amsterdamIconSpaciousSize3LineHeight = "1.4";
249
+ export const amsterdamIconSpaciousSize4FontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
250
+ export const amsterdamIconSpaciousSize4LineHeight = "1.4";
251
+ export const amsterdamIconSpaciousSize5FontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
252
+ export const amsterdamIconSpaciousSize5LineHeight = "1.5";
253
+ export const amsterdamIconSpaciousSize6FontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
254
+ export const amsterdamIconSpaciousSize6LineHeight = "1.6";
255
+ export const amsterdamIconSpaciousSize7FontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
256
+ export const amsterdamIconSpaciousSize7LineHeight = "1.6";
257
+ export const amsterdamIconCompactSize3FontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
258
+ export const amsterdamIconCompactSize3LineHeight = "1.4";
259
+ export const amsterdamIconCompactSize4FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
260
+ export const amsterdamIconCompactSize4LineHeight = "1.4";
261
+ export const amsterdamIconCompactSize5FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
262
+ export const amsterdamIconCompactSize5LineHeight = "1.5";
263
+ export const amsterdamIconCompactSize6FontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
264
+ export const amsterdamIconCompactSize6LineHeight = "1.6";
265
+ export const amsterdamIconCompactSize7FontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
266
+ export const amsterdamIconCompactSize7LineHeight = "1.6";
207
267
  export const amsterdamLinkColor = "#004699";
208
- export const amsterdamLinkOutlineOffset = "2px";
209
268
  export const amsterdamLinkFontFamily = "'Amsterdam Sans', Arial, sans-serif";
210
269
  export const amsterdamLinkFontWeight = 400;
270
+ export const amsterdamLinkOutlineOffset = "2px";
211
271
  export const amsterdamLinkHoverColor = "#102E62";
212
- export const amsterdamLinkInlineHoverTextDecoration = "underline";
213
- export const amsterdamLinkInlineHoverTextUnderlineOffset = "3px";
272
+ export const amsterdamLinkInlineTextDecorationLine = "underline";
273
+ export const amsterdamLinkInlineTextDecorationThickness = "0.125rem";
274
+ export const amsterdamLinkInlineTextUnderlineOffset = "0.375rem";
214
275
  export const amsterdamLinkInlineFontFamily = "inherit";
215
276
  export const amsterdamLinkInlineFontSize = "inherit";
216
277
  export const amsterdamLinkInlineLineHeight = "inherit";
217
- export const amsterdamLinkInlineTextDecoration = "none";
218
- export const amsterdamLinkInlineTextDecorationThickness = "2px";
278
+ export const amsterdamLinkInlineHoverTextDecorationThickness = "0.1875rem";
279
+ export const amsterdamLinkInlineHoverTextUnderlineOffset = "0.3125rem";
219
280
  export const amsterdamLinkInlineVisitedColor = "#A00078";
220
281
  export const amsterdamLinkInListGap = "0.5em";
221
- export const amsterdamLinkInListHoverTextDecoration = "underline";
222
- export const amsterdamLinkInListHoverTextDecorationThickness = "2px";
223
- export const amsterdamLinkInListHoverTextUnderlineOffset = "7px";
224
- export const amsterdamLinkInListTextDecoration = "none";
225
- export const amsterdamLinkInListLineHeight = "1.6";
226
- export const amsterdamLinkInListNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
227
- export const amsterdamLinkInListWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
228
- export const amsterdamLinkStandaloneTextUnderlineOffset = "8px";
229
- export const amsterdamLinkStandaloneTextDecorationThickness = "2px";
230
- export const amsterdamLinkStandaloneHoverTextDecorationThickness = "3px";
231
- export const amsterdamLinkStandaloneHoverTextUnderlineOffset = "7px";
232
- export const amsterdamLinkStandaloneLineHeight = "1.6";
233
- export const amsterdamLinkStandaloneNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
234
- export const amsterdamLinkStandaloneWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
282
+ export const amsterdamLinkInListTextDecorationLine = "none";
283
+ export const amsterdamLinkInListTextDecorationThickness = "0.125rem";
284
+ export const amsterdamLinkInListTextUnderlineOffset = "0.375rem";
285
+ export const amsterdamLinkInListHoverTextDecorationLine = "underline";
286
+ export const amsterdamLinkInListSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
287
+ export const amsterdamLinkInListSpaciousLineHeight = "1.6";
288
+ export const amsterdamLinkInListCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
289
+ export const amsterdamLinkInListCompactLineHeight = "1.6";
290
+ export const amsterdamLinkStandaloneTextDecorationLine = "underline";
291
+ export const amsterdamLinkStandaloneTextDecorationThickness = "0.125rem";
292
+ export const amsterdamLinkStandaloneTextUnderlineOffset = "0.375rem";
293
+ export const amsterdamLinkStandaloneHoverTextDecorationThickness = "0.1875rem";
294
+ export const amsterdamLinkStandaloneHoverTextUnderlineOffset = "0.3125rem";
295
+ export const amsterdamLinkStandaloneSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
296
+ export const amsterdamLinkStandaloneSpaciousLineHeight = "1.6";
297
+ export const amsterdamLinkStandaloneCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
298
+ export const amsterdamLinkStandaloneCompactLineHeight = "1.6";
235
299
  export const amsterdamLinkOnBackgroundDarkColor = "#ffffff";
236
300
  export const amsterdamLinkOnBackgroundDarkHoverColor = "#ffffff";
237
301
  export const amsterdamLinkOnBackgroundDarkVisitedColor = "#ffffff";
238
302
  export const amsterdamLinkOnBackgroundLightColor = "#000000";
239
303
  export const amsterdamLinkOnBackgroundLightHoverColor = "#000000";
240
304
  export const amsterdamLinkOnBackgroundLightVisitedColor = "#000000";
305
+ export const amsterdamLogoHeight = "2.5rem";
306
+ export const amsterdamLogoEmblemColor = "#EC0000";
307
+ export const amsterdamLogoTitleColor = "#EC0000";
308
+ export const amsterdamLogoSubsiteColor = "#000000";
241
309
  export const amsterdamOrderedListColor = "#000000";
242
310
  export const amsterdamOrderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
243
311
  export const amsterdamOrderedListFontWeight = 400;
244
312
  export const amsterdamOrderedListGap = "0.75rem";
245
- export const amsterdamOrderedListLineHeight = "1.6";
246
313
  export const amsterdamOrderedListListStyleType = "decimal";
247
- export const amsterdamOrderedListNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
248
- export const amsterdamOrderedListWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
314
+ export const amsterdamOrderedListSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
315
+ export const amsterdamOrderedListSpaciousLineHeight = "1.6";
316
+ export const amsterdamOrderedListCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
317
+ export const amsterdamOrderedListCompactLineHeight = "1.6";
249
318
  export const amsterdamOrderedListItemMarginInlineStart = "2.25rem"; // Divide your total indentation width over margin and padding to position the marker.
250
319
  export const amsterdamOrderedListItemPaddingInlineStart = "0.25rem"; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
251
320
  export const amsterdamOrderedListOrderedListListStyleType = "lower-alpha";
@@ -253,45 +322,58 @@ export const amsterdamOrderedListOrderedListItemMarginInlineStart = "1.5rem"; //
253
322
  export const amsterdamOrderedListOrderedListItemPaddingInlineStart = "0.25rem"; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
254
323
  export const amsterdamPageHeadingColor = "#000000";
255
324
  export const amsterdamPageHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
256
- export const amsterdamPageHeadingLineHeight = "1.1";
257
- export const amsterdamPageHeadingNarrowFontSize = "clamp(2rem, calc(2rem + (2 * (100vw - 20rem)) / 33.3125), 4rem)";
258
- export const amsterdamPageHeadingWideFontSize = "clamp(4rem, calc(4rem + (1 * (100vw - 53.375rem)) / 36.625), 5rem)";
259
325
  export const amsterdamPageHeadingFontWeight = 800;
260
326
  export const amsterdamPageHeadingInverseColor = "#ffffff";
327
+ export const amsterdamPageHeadingSpaciousFontSize = "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)";
328
+ export const amsterdamPageHeadingSpaciousLineHeight = "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)";
329
+ export const amsterdamPageHeadingCompactFontSize = "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)";
330
+ export const amsterdamPageHeadingCompactLineHeight = "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)";
261
331
  export const amsterdamPageMenuColumnGap = "2.5rem";
262
332
  export const amsterdamPageMenuRowGap = "0.5rem";
263
- export const amsterdamPageMenuItemColor = "#000000";
333
+ export const amsterdamPageMenuItemColor = "#004699";
264
334
  export const amsterdamPageMenuItemFontFamily = "'Amsterdam Sans', Arial, sans-serif";
265
335
  export const amsterdamPageMenuItemFontWeight = 400;
266
336
  export const amsterdamPageMenuItemGap = "0.5rem";
267
- export const amsterdamPageMenuItemLineHeight = "1.6";
268
- export const amsterdamPageMenuItemTextDecoration = "none";
269
- export const amsterdamPageMenuItemNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
270
- export const amsterdamPageMenuItemWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
271
- export const amsterdamPageMenuItemHoverColor = "#000000";
272
- export const amsterdamPageMenuItemHoverTextDecoration = "underline";
337
+ export const amsterdamPageMenuItemOutlineOffset = "2px";
338
+ export const amsterdamPageMenuItemTextDecorationLine = "none";
339
+ export const amsterdamPageMenuItemTextDecorationThickness = "0.125rem";
340
+ export const amsterdamPageMenuItemTextUnderlineOffset = "0.375rem";
341
+ export const amsterdamPageMenuItemSpaciousFontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
342
+ export const amsterdamPageMenuItemSpaciousLineHeight = "1.6";
343
+ export const amsterdamPageMenuItemCompactFontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
344
+ export const amsterdamPageMenuItemCompactLineHeight = "1.6";
345
+ export const amsterdamPageMenuItemHoverColor = "#102E62";
346
+ export const amsterdamPageMenuItemHoverTextDecorationLine = "underline";
273
347
  export const amsterdamPaginationColor = "#004699";
274
348
  export const amsterdamPaginationFontFamily = "'Amsterdam Sans', Arial, sans-serif";
275
349
  export const amsterdamPaginationFontWeight = 400;
276
- export const amsterdamPaginationLineHeight = "1.6";
277
- export const amsterdamPaginationNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
278
- export const amsterdamPaginationWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
350
+ export const amsterdamPaginationSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
351
+ export const amsterdamPaginationSpaciousLineHeight = "1.6";
352
+ export const amsterdamPaginationCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
353
+ export const amsterdamPaginationCompactLineHeight = "1.6";
354
+ export const amsterdamPaginationButtonOutlineOffset = "2px";
355
+ export const amsterdamPaginationButtonTextDecorationLine = "none";
356
+ export const amsterdamPaginationButtonTextDecorationThickness = "0.125rem";
357
+ export const amsterdamPaginationButtonTextUnderlineOffset = "0.375rem";
279
358
  export const amsterdamPaginationButtonCurrentFontWeight = 800;
280
359
  export const amsterdamPaginationButtonHoverColor = "#102E62";
281
- export const amsterdamPaginationButtonOutlineOffset = "2px";
360
+ export const amsterdamPaginationButtonHoverTextDecorationLine = "underline";
282
361
  export const amsterdamParagraphColor = "#000000";
283
362
  export const amsterdamParagraphFontFamily = "'Amsterdam Sans', Arial, sans-serif";
284
363
  export const amsterdamParagraphFontWeight = 400;
285
364
  export const amsterdamParagraphInverseColor = "#ffffff";
286
- export const amsterdamParagraphLineHeight = "1.6";
287
- export const amsterdamParagraphNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
288
- export const amsterdamParagraphWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
289
- export const amsterdamParagraphSmallLineHeight = "1.6";
290
- export const amsterdamParagraphSmallNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
291
- export const amsterdamParagraphSmallWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
292
- export const amsterdamParagraphLargeLineHeight = "1.5";
293
- export const amsterdamParagraphLargeNarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
294
- export const amsterdamParagraphLargeWideFontSize = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
365
+ export const amsterdamParagraphSpaciousSmallFontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
366
+ export const amsterdamParagraphSpaciousSmallLineHeight = "1.6";
367
+ export const amsterdamParagraphSpaciousMediumFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
368
+ export const amsterdamParagraphSpaciousMediumLineHeight = "1.6";
369
+ export const amsterdamParagraphSpaciousLargeFontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
370
+ export const amsterdamParagraphSpaciousLargeLineHeight = "1.5";
371
+ export const amsterdamParagraphCompactSmallFontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
372
+ export const amsterdamParagraphCompactSmallLineHeight = "1.6";
373
+ export const amsterdamParagraphCompactMediumFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
374
+ export const amsterdamParagraphCompactMediumLineHeight = "1.6";
375
+ export const amsterdamParagraphCompactLargeFontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
376
+ export const amsterdamParagraphCompactLargeLineHeight = "1.5";
295
377
  export const amsterdamScreenWideMaxWidth = "100rem";
296
378
  export const amsterdamScreenXWideMaxWidth = "132rem";
297
379
  export const amsterdamSwitchFontFamily = "'Amsterdam Sans', Arial, sans-serif";
@@ -307,25 +389,32 @@ export const amsterdamSwitchDisabledBackgroundColor = "#B4B4B4";
307
389
  export const amsterdamTopTaskLinkDescriptionColor = "#000000";
308
390
  export const amsterdamTopTaskLinkDescriptionFontFamily = "'Amsterdam Sans', Arial, sans-serif";
309
391
  export const amsterdamTopTaskLinkDescriptionFontWeight = 400;
310
- export const amsterdamTopTaskLinkDescriptionLineHeight = "1.6";
311
- export const amsterdamTopTaskLinkDescriptionNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
312
- export const amsterdamTopTaskLinkDescriptionWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
392
+ export const amsterdamTopTaskLinkDescriptionSpaciousFontSize = "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)";
393
+ export const amsterdamTopTaskLinkDescriptionSpaciousLineHeight = "1.6";
394
+ export const amsterdamTopTaskLinkDescriptionCompactFontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
395
+ export const amsterdamTopTaskLinkDescriptionCompactLineHeight = "1.6";
313
396
  export const amsterdamTopTaskLinkLabelColor = "#004699";
314
397
  export const amsterdamTopTaskLinkLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
315
398
  export const amsterdamTopTaskLinkLabelFontWeight = 800;
399
+ export const amsterdamTopTaskLinkLabelTextDecorationLine = "none";
400
+ export const amsterdamTopTaskLinkLabelTextDecorationThickness = "0.125rem";
401
+ export const amsterdamTopTaskLinkLabelTextUnderlineOffset = "0.375rem";
316
402
  export const amsterdamTopTaskLinkLabelHoverColor = "#102E62";
317
- export const amsterdamTopTaskLinkLabelLineHeight = "1.4";
318
- export const amsterdamTopTaskLinkLabelNarrowFontSize = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
319
- export const amsterdamTopTaskLinkLabelWideFontSize = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
403
+ export const amsterdamTopTaskLinkLabelHoverTextDecorationLine = "underline";
404
+ export const amsterdamTopTaskLinkLabelSpaciousFontSize = "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)";
405
+ export const amsterdamTopTaskLinkLabelSpaciousLineHeight = "1.4";
406
+ export const amsterdamTopTaskLinkLabelCompactFontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
407
+ export const amsterdamTopTaskLinkLabelCompactLineHeight = "1.4";
320
408
  export const amsterdamTopTaskLinkOutlineOffset = "2px";
321
409
  export const amsterdamUnorderedListColor = "#000000";
322
410
  export const amsterdamUnorderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
323
411
  export const amsterdamUnorderedListFontWeight = 400;
324
412
  export const amsterdamUnorderedListGap = "0.75rem";
325
- export const amsterdamUnorderedListLineHeight = "1.6";
326
413
  export const amsterdamUnorderedListListStyleType = "'\\2022'";
327
- export const amsterdamUnorderedListNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
328
- export const amsterdamUnorderedListWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
414
+ export const amsterdamUnorderedListSpaciousFontSize = "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)";
415
+ export const amsterdamUnorderedListSpaciousLineHeight = "1.6";
416
+ export const amsterdamUnorderedListCompactFontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
417
+ export const amsterdamUnorderedListCompactLineHeight = "1.6";
329
418
  export const amsterdamUnorderedListItemMarginInlineStart = "1.625rem"; // Divide your total indentation width over margin and padding to position the marker.
330
419
  export const amsterdamUnorderedListItemPaddingInlineStart = "0.875rem"; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
331
420
  export const amsterdamUnorderedListUnorderedListListStyleType = "'\\2013'";
@@ -341,7 +430,6 @@ export const utrechtFocusOutlineOffset = "2px";
341
430
  export const utrechtButtonBackgroundColor = "#004699";
342
431
  export const utrechtButtonColor = "#ffffff";
343
432
  export const utrechtButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
344
- export const utrechtButtonLineHeight = "1.6";
345
433
  export const utrechtButtonPaddingInlineStart = "1rem";
346
434
  export const utrechtButtonPaddingInlineEnd = "1rem";
347
435
  export const utrechtButtonPaddingBlockStart = "0.5rem";