@amsterdam/design-system-tokens 0.1.8 → 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 (35) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/_variables.scss +218 -154
  3. package/dist/index.css +218 -154
  4. package/dist/index.d.ts +200 -136
  5. package/dist/index.js +205 -141
  6. package/dist/index.json +204 -140
  7. package/dist/index.tokens.json +336 -269
  8. package/dist/root.css +218 -154
  9. package/dist/tokens.d.ts +324 -257
  10. package/dist/tokens.js +3343 -1864
  11. package/dist/variables.less +218 -154
  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 +6 -5
  23. package/src/components/amsterdam/form-label.tokens.json +6 -5
  24. package/src/components/amsterdam/grid.tokens.json +2 -2
  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/ordered-list.tokens.json +6 -5
  29. package/src/components/amsterdam/page-heading.tokens.json +17 -8
  30. package/src/components/amsterdam/page-menu.tokens.json +13 -9
  31. package/src/components/amsterdam/pagination.tokens.json +17 -18
  32. package/src/components/amsterdam/paragraph.tokens.json +22 -19
  33. package/src/components/amsterdam/top-task-link.tokens.json +25 -47
  34. package/src/components/amsterdam/unordered-list.tokens.json +6 -5
  35. package/src/components/utrecht/button.tokens.json +1 -3
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 27 Nov 2023 11:07:10 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,26 +171,25 @@ 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)";
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";
154
183
  export const amsterdamDialogBackgroundColor = "#ffffff";
155
184
  export const amsterdamDialogBorder = "0";
156
185
  export const amsterdamDialogMaxInlineSize = "min(87.69vw, 45rem)";
157
186
  export const amsterdamDialogTitleColor = "#000000";
158
187
  export const amsterdamDialogTitleFontFamily = "'Amsterdam Sans', Arial, sans-serif";
159
188
  export const amsterdamDialogTitleFontWeight = 800;
160
- export const amsterdamDialogTitleLineHeight = "1.5";
161
- export const amsterdamDialogTitleNarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
162
- export const amsterdamDialogTitleWideFontSize = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
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";
163
193
  export const amsterdamDialogBackdropBackground = "#0006";
164
194
  export const amsterdamDialogCloseBackgroundColor = "transparent";
165
195
  export const amsterdamDialogCloseFill = "#000000";
@@ -175,32 +205,37 @@ export const amsterdamDialogFooterPaddingBlock = "1.5rem 0";
175
205
  export const amsterdamFormLabelColor = "#000000";
176
206
  export const amsterdamFormLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
177
207
  export const amsterdamFormLabelFontWeight = 800;
178
- export const amsterdamFormLabelLineHeight = "1.6";
179
- export const amsterdamFormLabelNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
180
- 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";
181
212
  export const amsterdamGridColumnCount = "4";
182
- export const amsterdamGridDensityLowGap = "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)"; // Grows from 16px at 320px wide to 56px at 1600px wide.
183
- export const amsterdamGridDensityLowPaddingInline = "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)"; // Equals 1.5 times the gap.
184
- export const amsterdamGridDensityHighGap = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)"; // Grows from 16px at 1088px wide to 40px at 2624px wide.
185
- export const amsterdamGridDensityHighPaddingInline = "clamp(1rem, calc(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.
186
217
  export const amsterdamGridMediumColumnCount = "8";
187
218
  export const amsterdamGridWideColumnCount = "12";
188
- export const amsterdamHeading1LineHeight = "1.2";
189
- export const amsterdamHeading1NarrowFontSize = "clamp(2rem, calc(2rem + (1 * (100vw - 20rem)) / 33.3125), 3rem)";
190
- export const amsterdamHeading1WideFontSize = "clamp(3rem, calc(3rem + (0.5 * (100vw - 53.375rem)) / 36.625), 3.5rem)";
191
- export const amsterdamHeading2LineHeight = "1.3";
192
- export const amsterdamHeading2NarrowFontSize = "clamp(1.75rem, calc(1.75rem + (0.5 * (100vw - 20rem)) / 33.3125), 2.25rem)";
193
- export const amsterdamHeading2WideFontSize = "clamp(2.25rem, calc(2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625), 2.5rem)";
194
- export const amsterdamHeading3LineHeight = "1.4";
195
- export const amsterdamHeading3NarrowFontSize = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
196
- export const amsterdamHeading3WideFontSize = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
197
- export const amsterdamHeading4LineHeight = "1.4";
198
- export const amsterdamHeading4NarrowFontSize = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
199
- export const amsterdamHeading4WideFontSize = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
200
219
  export const amsterdamHeadingColor = "#000000";
201
220
  export const amsterdamHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
202
221
  export const amsterdamHeadingFontWeight = 800;
203
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)";
204
239
  export const amsterdamHighlightBlueBackgroundColor = "#004699";
205
240
  export const amsterdamHighlightDarkGreenBackgroundColor = "#00A03C";
206
241
  export const amsterdamHighlightGreenBackgroundColor = "#BED200";
@@ -209,49 +244,58 @@ export const amsterdamHighlightMagentaBackgroundColor = "#E50082";
209
244
  export const amsterdamHighlightOrangeBackgroundColor = "#FF9100";
210
245
  export const amsterdamHighlightPurpleBackgroundColor = "#A00078";
211
246
  export const amsterdamHighlightYellowBackgroundColor = "#FFE600";
212
- export const amsterdamIconSize3IconSizeNarrow = "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)";
213
- export const amsterdamIconSize3IconSizeWide = "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)";
214
- export const amsterdamIconSize3ContainerMultiplier = "1.4";
215
- export const amsterdamIconSize4IconSizeNarrow = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
216
- export const amsterdamIconSize4IconSizeWide = "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)";
217
- export const amsterdamIconSize4ContainerMultiplier = "1.4";
218
- export const amsterdamIconSize5IconSizeNarrow = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
219
- export const amsterdamIconSize5IconSizeWide = "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)";
220
- export const amsterdamIconSize5ContainerMultiplier = "1.5";
221
- export const amsterdamIconSize6IconSizeNarrow = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
222
- export const amsterdamIconSize6IconSizeWide = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
223
- export const amsterdamIconSize6ContainerMultiplier = "1.6";
224
- export const amsterdamIconSize7IconSizeNarrow = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
225
- export const amsterdamIconSize7IconSizeWide = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
226
- 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";
227
267
  export const amsterdamLinkColor = "#004699";
228
- export const amsterdamLinkOutlineOffset = "2px";
229
268
  export const amsterdamLinkFontFamily = "'Amsterdam Sans', Arial, sans-serif";
230
269
  export const amsterdamLinkFontWeight = 400;
270
+ export const amsterdamLinkOutlineOffset = "2px";
231
271
  export const amsterdamLinkHoverColor = "#102E62";
232
- export const amsterdamLinkInlineHoverTextDecoration = "underline";
233
- export const amsterdamLinkInlineHoverTextUnderlineOffset = "3px";
272
+ export const amsterdamLinkInlineTextDecorationLine = "underline";
273
+ export const amsterdamLinkInlineTextDecorationThickness = "0.125rem";
274
+ export const amsterdamLinkInlineTextUnderlineOffset = "0.375rem";
234
275
  export const amsterdamLinkInlineFontFamily = "inherit";
235
276
  export const amsterdamLinkInlineFontSize = "inherit";
236
277
  export const amsterdamLinkInlineLineHeight = "inherit";
237
- export const amsterdamLinkInlineTextDecoration = "none";
238
- export const amsterdamLinkInlineTextDecorationThickness = "2px";
278
+ export const amsterdamLinkInlineHoverTextDecorationThickness = "0.1875rem";
279
+ export const amsterdamLinkInlineHoverTextUnderlineOffset = "0.3125rem";
239
280
  export const amsterdamLinkInlineVisitedColor = "#A00078";
240
281
  export const amsterdamLinkInListGap = "0.5em";
241
- export const amsterdamLinkInListHoverTextDecoration = "underline";
242
- export const amsterdamLinkInListHoverTextDecorationThickness = "2px";
243
- export const amsterdamLinkInListHoverTextUnderlineOffset = "7px";
244
- export const amsterdamLinkInListTextDecoration = "none";
245
- export const amsterdamLinkInListLineHeight = "1.6";
246
- export const amsterdamLinkInListNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
247
- export const amsterdamLinkInListWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
248
- export const amsterdamLinkStandaloneTextUnderlineOffset = "8px";
249
- export const amsterdamLinkStandaloneTextDecorationThickness = "2px";
250
- export const amsterdamLinkStandaloneHoverTextDecorationThickness = "3px";
251
- export const amsterdamLinkStandaloneHoverTextUnderlineOffset = "7px";
252
- export const amsterdamLinkStandaloneLineHeight = "1.6";
253
- export const amsterdamLinkStandaloneNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
254
- 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";
255
299
  export const amsterdamLinkOnBackgroundDarkColor = "#ffffff";
256
300
  export const amsterdamLinkOnBackgroundDarkHoverColor = "#ffffff";
257
301
  export const amsterdamLinkOnBackgroundDarkVisitedColor = "#ffffff";
@@ -266,10 +310,11 @@ export const amsterdamOrderedListColor = "#000000";
266
310
  export const amsterdamOrderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
267
311
  export const amsterdamOrderedListFontWeight = 400;
268
312
  export const amsterdamOrderedListGap = "0.75rem";
269
- export const amsterdamOrderedListLineHeight = "1.6";
270
313
  export const amsterdamOrderedListListStyleType = "decimal";
271
- export const amsterdamOrderedListNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
272
- 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";
273
318
  export const amsterdamOrderedListItemMarginInlineStart = "2.25rem"; // Divide your total indentation width over margin and padding to position the marker.
274
319
  export const amsterdamOrderedListItemPaddingInlineStart = "0.25rem"; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
275
320
  export const amsterdamOrderedListOrderedListListStyleType = "lower-alpha";
@@ -277,45 +322,58 @@ export const amsterdamOrderedListOrderedListItemMarginInlineStart = "1.5rem"; //
277
322
  export const amsterdamOrderedListOrderedListItemPaddingInlineStart = "0.25rem"; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
278
323
  export const amsterdamPageHeadingColor = "#000000";
279
324
  export const amsterdamPageHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
280
- export const amsterdamPageHeadingLineHeight = "1.1";
281
- export const amsterdamPageHeadingNarrowFontSize = "clamp(2rem, calc(2rem + (2 * (100vw - 20rem)) / 33.3125), 4rem)";
282
- export const amsterdamPageHeadingWideFontSize = "clamp(4rem, calc(4rem + (1 * (100vw - 53.375rem)) / 36.625), 5rem)";
283
325
  export const amsterdamPageHeadingFontWeight = 800;
284
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)";
285
331
  export const amsterdamPageMenuColumnGap = "2.5rem";
286
332
  export const amsterdamPageMenuRowGap = "0.5rem";
287
- export const amsterdamPageMenuItemColor = "#000000";
333
+ export const amsterdamPageMenuItemColor = "#004699";
288
334
  export const amsterdamPageMenuItemFontFamily = "'Amsterdam Sans', Arial, sans-serif";
289
335
  export const amsterdamPageMenuItemFontWeight = 400;
290
336
  export const amsterdamPageMenuItemGap = "0.5rem";
291
- export const amsterdamPageMenuItemLineHeight = "1.6";
292
- export const amsterdamPageMenuItemTextDecoration = "none";
293
- export const amsterdamPageMenuItemNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
294
- export const amsterdamPageMenuItemWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
295
- export const amsterdamPageMenuItemHoverColor = "#000000";
296
- 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";
297
347
  export const amsterdamPaginationColor = "#004699";
298
348
  export const amsterdamPaginationFontFamily = "'Amsterdam Sans', Arial, sans-serif";
299
349
  export const amsterdamPaginationFontWeight = 400;
300
- export const amsterdamPaginationLineHeight = "1.6";
301
- export const amsterdamPaginationNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
302
- 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";
303
358
  export const amsterdamPaginationButtonCurrentFontWeight = 800;
304
359
  export const amsterdamPaginationButtonHoverColor = "#102E62";
305
- export const amsterdamPaginationButtonOutlineOffset = "2px";
360
+ export const amsterdamPaginationButtonHoverTextDecorationLine = "underline";
306
361
  export const amsterdamParagraphColor = "#000000";
307
362
  export const amsterdamParagraphFontFamily = "'Amsterdam Sans', Arial, sans-serif";
308
363
  export const amsterdamParagraphFontWeight = 400;
309
364
  export const amsterdamParagraphInverseColor = "#ffffff";
310
- export const amsterdamParagraphLineHeight = "1.6";
311
- export const amsterdamParagraphNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
312
- export const amsterdamParagraphWideFontSize = "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)";
313
- export const amsterdamParagraphSmallLineHeight = "1.6";
314
- export const amsterdamParagraphSmallNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
315
- export const amsterdamParagraphSmallWideFontSize = "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)";
316
- export const amsterdamParagraphLargeLineHeight = "1.5";
317
- export const amsterdamParagraphLargeNarrowFontSize = "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)";
318
- 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";
319
377
  export const amsterdamScreenWideMaxWidth = "100rem";
320
378
  export const amsterdamScreenXWideMaxWidth = "132rem";
321
379
  export const amsterdamSwitchFontFamily = "'Amsterdam Sans', Arial, sans-serif";
@@ -331,25 +389,32 @@ export const amsterdamSwitchDisabledBackgroundColor = "#B4B4B4";
331
389
  export const amsterdamTopTaskLinkDescriptionColor = "#000000";
332
390
  export const amsterdamTopTaskLinkDescriptionFontFamily = "'Amsterdam Sans', Arial, sans-serif";
333
391
  export const amsterdamTopTaskLinkDescriptionFontWeight = 400;
334
- export const amsterdamTopTaskLinkDescriptionLineHeight = "1.6";
335
- export const amsterdamTopTaskLinkDescriptionNarrowFontSize = "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)";
336
- 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";
337
396
  export const amsterdamTopTaskLinkLabelColor = "#004699";
338
397
  export const amsterdamTopTaskLinkLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
339
398
  export const amsterdamTopTaskLinkLabelFontWeight = 800;
399
+ export const amsterdamTopTaskLinkLabelTextDecorationLine = "none";
400
+ export const amsterdamTopTaskLinkLabelTextDecorationThickness = "0.125rem";
401
+ export const amsterdamTopTaskLinkLabelTextUnderlineOffset = "0.375rem";
340
402
  export const amsterdamTopTaskLinkLabelHoverColor = "#102E62";
341
- export const amsterdamTopTaskLinkLabelLineHeight = "1.4";
342
- export const amsterdamTopTaskLinkLabelNarrowFontSize = "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)";
343
- 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";
344
408
  export const amsterdamTopTaskLinkOutlineOffset = "2px";
345
409
  export const amsterdamUnorderedListColor = "#000000";
346
410
  export const amsterdamUnorderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
347
411
  export const amsterdamUnorderedListFontWeight = 400;
348
412
  export const amsterdamUnorderedListGap = "0.75rem";
349
- export const amsterdamUnorderedListLineHeight = "1.6";
350
413
  export const amsterdamUnorderedListListStyleType = "'\\2022'";
351
- export const amsterdamUnorderedListNarrowFontSize = "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)";
352
- 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";
353
418
  export const amsterdamUnorderedListItemMarginInlineStart = "1.625rem"; // Divide your total indentation width over margin and padding to position the marker.
354
419
  export const amsterdamUnorderedListItemPaddingInlineStart = "0.875rem"; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
355
420
  export const amsterdamUnorderedListUnorderedListListStyleType = "'\\2013'";
@@ -365,7 +430,6 @@ export const utrechtFocusOutlineOffset = "2px";
365
430
  export const utrechtButtonBackgroundColor = "#004699";
366
431
  export const utrechtButtonColor = "#ffffff";
367
432
  export const utrechtButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
368
- export const utrechtButtonLineHeight = "1.6";
369
433
  export const utrechtButtonPaddingInlineStart = "1rem";
370
434
  export const utrechtButtonPaddingInlineEnd = "1rem";
371
435
  export const utrechtButtonPaddingBlockStart = "0.5rem";