@amsterdam/design-system-tokens 0.15.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +61 -0
- package/LICENSE.md +2 -2
- package/README.md +4 -4
- package/dist/compact.css +3 -0
- package/dist/compact.d.ts +7 -0
- package/dist/compact.json +8 -1
- package/dist/compact.mjs +4 -0
- package/dist/compact.scss +3 -0
- package/dist/compact.theme.css +3 -0
- package/dist/index.css +239 -217
- package/dist/index.d.ts +292 -250
- package/dist/index.json +361 -319
- package/dist/index.mjs +293 -273
- package/dist/index.scss +231 -209
- package/dist/index.theme.css +239 -217
- package/package.json +3 -3
- package/src/brand/ams/focus.tokens.json +1 -1
- package/src/brand/ams/typography.compact.tokens.json +2 -1
- package/src/brand/ams/typography.tokens.json +1 -0
- package/src/components/ams/accordion.tokens.json +1 -0
- package/src/components/ams/alert.tokens.json +7 -8
- package/src/components/ams/avatar.tokens.json +10 -1
- package/src/components/ams/badge.tokens.json +1 -1
- package/src/components/ams/button.tokens.json +8 -12
- package/src/components/ams/card.tokens.json +8 -2
- package/src/components/ams/checkbox.tokens.json +57 -36
- package/src/components/ams/date-input.tokens.json +9 -8
- package/src/components/ams/dialog.tokens.json +25 -8
- package/src/components/ams/field-set.tokens.json +2 -1
- package/src/components/ams/file-input.tokens.json +8 -11
- package/src/components/ams/grid.tokens.json +6 -6
- package/src/components/ams/heading.tokens.json +1 -0
- package/src/components/ams/hint.tokens.json +1 -1
- package/src/components/ams/label.tokens.json +2 -1
- package/src/components/ams/link.tokens.json +8 -27
- package/src/components/ams/{footer.tokens.json → page-footer.tokens.json} +7 -1
- package/src/components/ams/page-header.compact.tokens.json +10 -0
- package/src/components/ams/{header.tokens.json → page-header.tokens.json} +10 -2
- package/src/components/ams/page-heading.tokens.json +1 -0
- package/src/components/ams/page.tokens.json +8 -0
- package/src/components/ams/password-input.tokens.json +7 -6
- package/src/components/ams/radio.tokens.json +0 -2
- package/src/components/ams/search-field.tokens.json +7 -4
- package/src/components/ams/select.tokens.json +11 -6
- package/src/components/ams/standalone-link.tokens.json +40 -0
- package/src/components/ams/switch.tokens.json +2 -2
- package/src/components/ams/tabs.tokens.json +3 -3
- package/src/components/ams/text-area.tokens.json +7 -6
- package/src/components/ams/text-input.tokens.json +7 -6
- package/src/components/ams/time-input.tokens.json +9 -8
- package/src/components/ams/mega-menu.tokens.json +0 -18
- package/src/components/ams/page-menu.tokens.json +0 -24
- package/src/components/ams/screen.tokens.json +0 -13
- package/src/components/ams/top-task-link.tokens.json +0 -29
package/dist/index.mjs
CHANGED
|
@@ -38,7 +38,7 @@ export const amsColorTextInverse = "#ffffff";
|
|
|
38
38
|
export const amsColorTextSecondary = "#767676";
|
|
39
39
|
export const amsCursorDisabled = "not-allowed";
|
|
40
40
|
export const amsCursorInteractive = "pointer";
|
|
41
|
-
export const amsFocusOutlineOffset = "0.
|
|
41
|
+
export const amsFocusOutlineOffset = "0.25rem";
|
|
42
42
|
export const amsSpaceXs = "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
43
43
|
export const amsSpaceS = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
44
44
|
export const amsSpaceM = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
@@ -83,6 +83,7 @@ export const amsTypographyHeading_6FontSize =
|
|
|
83
83
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
84
84
|
export const amsTypographyHeading_6LineHeight = "1.3776";
|
|
85
85
|
export const amsTypographyHeadingFontWeight = "800";
|
|
86
|
+
export const amsTypographyHeadingTextWrap = "balance";
|
|
86
87
|
export const amsLinksColor = "#004699";
|
|
87
88
|
export const amsLinksTextDecorationThickness = "0.125rem";
|
|
88
89
|
export const amsLinksTextUnderlineOffset = "0.3333em";
|
|
@@ -106,37 +107,42 @@ export const amsAccordionButtonFontWeight = "800";
|
|
|
106
107
|
export const amsAccordionButtonGap =
|
|
107
108
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
108
109
|
export const amsAccordionButtonLineHeight = "1.2928";
|
|
109
|
-
export const amsAccordionButtonOutlineOffset = "0.
|
|
110
|
+
export const amsAccordionButtonOutlineOffset = "0.25rem";
|
|
110
111
|
export const amsAccordionButtonPaddingBlock =
|
|
111
112
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
112
113
|
export const amsAccordionButtonPaddingInline = "0";
|
|
114
|
+
export const amsAccordionButtonTextWrap = "balance";
|
|
113
115
|
export const amsAccordionButtonHoverColor = "#003677";
|
|
114
116
|
export const amsAccordionPanelPaddingBlock = "0";
|
|
115
117
|
export const amsAccordionPanelPaddingInline = "0";
|
|
116
118
|
export const amsActionGroupGap =
|
|
117
119
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
118
120
|
export const amsAlertBackgroundColor = "#ffffff";
|
|
119
|
-
export const
|
|
120
|
-
export const
|
|
121
|
+
export const amsAlertBorderColor = "#009de6";
|
|
122
|
+
export const amsAlertBorderStyle = "solid";
|
|
123
|
+
export const amsAlertBorderWidth = "0.25rem";
|
|
121
124
|
export const amsAlertSeverityIndicatorBackgroundColor = "#009de6";
|
|
122
125
|
export const amsAlertSeverityIndicatorPaddingBlock =
|
|
123
126
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
124
127
|
export const amsAlertSeverityIndicatorPaddingInline =
|
|
125
|
-
"clamp(0.
|
|
128
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
126
129
|
export const amsAlertContentGap =
|
|
127
130
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
128
131
|
export const amsAlertContentPaddingBlock =
|
|
129
132
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
130
133
|
export const amsAlertContentPaddingInline =
|
|
131
134
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
132
|
-
export const
|
|
135
|
+
export const amsAlertErrorBorderColor = "#ec0000";
|
|
133
136
|
export const amsAlertErrorSeverityIndicatorBackgroundColor = "#ec0000";
|
|
134
|
-
export const
|
|
137
|
+
export const amsAlertSuccessBorderColor = "#00a03c";
|
|
135
138
|
export const amsAlertSuccessSeverityIndicatorBackgroundColor = "#00a03c";
|
|
136
|
-
export const
|
|
139
|
+
export const amsAlertWarningBorderColor = "#ff9100";
|
|
137
140
|
export const amsAlertWarningSeverityIndicatorBackgroundColor = "#ff9100";
|
|
138
141
|
export const amsAvatarAspectRatio = "1 / 1";
|
|
139
142
|
export const amsAvatarBackgroundColor = "#a00078";
|
|
143
|
+
export const amsAvatarBorderColor = "#a00078";
|
|
144
|
+
export const amsAvatarBorderStyle = "solid";
|
|
145
|
+
export const amsAvatarBorderWidth = "0.125rem";
|
|
140
146
|
export const amsAvatarColor = "#ffffff";
|
|
141
147
|
export const amsAvatarFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
142
148
|
export const amsAvatarFontSize =
|
|
@@ -149,16 +155,22 @@ export const amsAvatarPaddingInline =
|
|
|
149
155
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
150
156
|
export const amsAvatarForcedColorsBorderWidth = "0.125rem";
|
|
151
157
|
export const amsAvatarAzureBackgroundColor = "#009de6";
|
|
152
|
-
export const
|
|
158
|
+
export const amsAvatarAzureBorderColor = "#009de6";
|
|
159
|
+
export const amsAvatarAzureColor = "#ffffff";
|
|
153
160
|
export const amsAvatarGreenBackgroundColor = "#00a03c";
|
|
161
|
+
export const amsAvatarGreenBorderColor = "#00a03c";
|
|
154
162
|
export const amsAvatarGreenColor = "#ffffff";
|
|
155
163
|
export const amsAvatarLimeBackgroundColor = "#bed200";
|
|
164
|
+
export const amsAvatarLimeBorderColor = "#bed200";
|
|
156
165
|
export const amsAvatarLimeColor = "#181818";
|
|
157
166
|
export const amsAvatarMagentaBackgroundColor = "#e50082";
|
|
167
|
+
export const amsAvatarMagentaBorderColor = "#e50082";
|
|
158
168
|
export const amsAvatarMagentaColor = "#ffffff";
|
|
159
169
|
export const amsAvatarOrangeBackgroundColor = "#ff9100";
|
|
170
|
+
export const amsAvatarOrangeBorderColor = "#ff9100";
|
|
160
171
|
export const amsAvatarOrangeColor = "#181818";
|
|
161
172
|
export const amsAvatarYellowBackgroundColor = "#ffe600";
|
|
173
|
+
export const amsAvatarYellowBorderColor = "#ffe600";
|
|
162
174
|
export const amsAvatarYellowColor = "#181818";
|
|
163
175
|
export const amsBadgeBackgroundColor = "#00a03c";
|
|
164
176
|
export const amsBadgeColor = "#ffffff";
|
|
@@ -170,7 +182,7 @@ export const amsBadgeLineHeight = "1.6667";
|
|
|
170
182
|
export const amsBadgePaddingInline =
|
|
171
183
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
172
184
|
export const amsBadgeAzureBackgroundColor = "#009de6";
|
|
173
|
-
export const amsBadgeAzureColor = "#
|
|
185
|
+
export const amsBadgeAzureColor = "#ffffff";
|
|
174
186
|
export const amsBadgeLimeBackgroundColor = "#bed200";
|
|
175
187
|
export const amsBadgeLimeColor = "#181818";
|
|
176
188
|
export const amsBadgeMagentaBackgroundColor = "#e50082";
|
|
@@ -202,12 +214,14 @@ export const amsBreadcrumbSeparatorInlineSize = "1ex";
|
|
|
202
214
|
export const amsBreadcrumbSeparatorMarginInline =
|
|
203
215
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
204
216
|
export const amsBreadcrumbLinkColor = "#004699";
|
|
205
|
-
export const amsBreadcrumbLinkOutlineOffset = "0.
|
|
217
|
+
export const amsBreadcrumbLinkOutlineOffset = "0.25rem";
|
|
206
218
|
export const amsBreadcrumbLinkTextDecorationLine = "none";
|
|
207
219
|
export const amsBreadcrumbLinkTextDecorationThickness = "0.125rem";
|
|
208
220
|
export const amsBreadcrumbLinkTextUnderlineOffset = "0.3333em";
|
|
209
221
|
export const amsBreadcrumbLinkHoverColor = "#003677";
|
|
210
222
|
export const amsBreadcrumbLinkHoverTextDecorationLine = "underline";
|
|
223
|
+
export const amsButtonBorderStyle = "solid";
|
|
224
|
+
export const amsButtonBorderWidth = "0.125rem";
|
|
211
225
|
export const amsButtonCursor = "pointer";
|
|
212
226
|
export const amsButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
213
227
|
export const amsButtonFontSize =
|
|
@@ -215,41 +229,41 @@ export const amsButtonFontSize =
|
|
|
215
229
|
export const amsButtonFontWeight = "400";
|
|
216
230
|
export const amsButtonLineHeight = "1.6667";
|
|
217
231
|
export const amsButtonGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
218
|
-
export const amsButtonOutlineOffset = "0.
|
|
232
|
+
export const amsButtonOutlineOffset = "0.25rem";
|
|
219
233
|
export const amsButtonPaddingBlock =
|
|
220
234
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
221
235
|
export const amsButtonPaddingInline =
|
|
222
236
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
223
237
|
export const amsButtonDisabledCursor = "not-allowed";
|
|
224
|
-
export const amsButtonForcedColorModeBorder = "0.125rem solid";
|
|
225
238
|
export const amsButtonPrimaryBackgroundColor = "#004699";
|
|
226
|
-
export const
|
|
239
|
+
export const amsButtonPrimaryBorderColor = "#004699";
|
|
227
240
|
export const amsButtonPrimaryColor = "#ffffff";
|
|
228
241
|
export const amsButtonPrimaryDisabledBackgroundColor = "#767676";
|
|
229
|
-
export const
|
|
242
|
+
export const amsButtonPrimaryDisabledBorderColor = "#767676";
|
|
230
243
|
export const amsButtonPrimaryHoverBackgroundColor = "#003677";
|
|
231
|
-
export const
|
|
244
|
+
export const amsButtonPrimaryHoverBorderColor = "#003677";
|
|
232
245
|
export const amsButtonSecondaryBackgroundColor = "#ffffff";
|
|
233
246
|
export const amsButtonSecondaryColor = "#004699";
|
|
234
|
-
export const
|
|
235
|
-
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.1875rem #003677";
|
|
247
|
+
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
236
248
|
export const amsButtonSecondaryHoverColor = "#003677";
|
|
237
|
-
export const amsButtonSecondaryDisabledBackgroundColor = "#ffffff";
|
|
238
|
-
export const amsButtonSecondaryDisabledBoxShadow =
|
|
239
|
-
"inset 0 0 0 0.125rem #767676";
|
|
240
249
|
export const amsButtonSecondaryDisabledColor = "#767676";
|
|
241
250
|
export const amsButtonTertiaryBackgroundColor = "transparent";
|
|
251
|
+
export const amsButtonTertiaryBorderColor = "transparent";
|
|
242
252
|
export const amsButtonTertiaryColor = "#004699";
|
|
243
|
-
export const
|
|
253
|
+
export const amsButtonTertiaryHoverBorderColor = "currentColor";
|
|
244
254
|
export const amsButtonTertiaryHoverColor = "#003677";
|
|
245
|
-
export const amsButtonTertiaryDisabledBackgroundColor = "transparent";
|
|
246
255
|
export const amsButtonTertiaryDisabledColor = "#767676";
|
|
247
256
|
export const amsButtonIconOnlyPaddingBlock =
|
|
248
257
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
249
258
|
export const amsButtonIconOnlyPaddingInline =
|
|
250
259
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
251
|
-
export const
|
|
260
|
+
export const amsCardHeadingMarginBlockEnd =
|
|
261
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
252
262
|
export const amsCardHeadingGroupGap =
|
|
263
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
264
|
+
export const amsCardHeadingGroupMarginBlockEnd =
|
|
265
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
266
|
+
export const amsCardImageMarginBlockEnd =
|
|
253
267
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
254
268
|
export const amsCardLinkColor = "#004699";
|
|
255
269
|
export const amsCardLinkTextDecorationLine = "none";
|
|
@@ -257,7 +271,7 @@ export const amsCardLinkTextDecorationThickness = "0.125rem";
|
|
|
257
271
|
export const amsCardLinkTextUnderlineOffset = "0.3333em";
|
|
258
272
|
export const amsCardLinkHoverColor = "#003677";
|
|
259
273
|
export const amsCardLinkHoverTextDecorationLine = "underline";
|
|
260
|
-
export const amsCardOutlineOffset = "0.
|
|
274
|
+
export const amsCardOutlineOffset = "0.25rem";
|
|
261
275
|
export const amsCharacterCountColor = "#181818";
|
|
262
276
|
export const amsCharacterCountFontFamily =
|
|
263
277
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -274,36 +288,36 @@ export const amsCheckboxFontSize =
|
|
|
274
288
|
export const amsCheckboxFontWeight = "400";
|
|
275
289
|
export const amsCheckboxGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
276
290
|
export const amsCheckboxLineHeight = "1.6667";
|
|
277
|
-
export const amsCheckboxOutlineOffset = "0.
|
|
278
|
-
export const
|
|
279
|
-
export const
|
|
280
|
-
export const
|
|
281
|
-
export const
|
|
282
|
-
|
|
283
|
-
export const
|
|
284
|
-
export const
|
|
285
|
-
export const
|
|
286
|
-
export const
|
|
287
|
-
export const
|
|
288
|
-
|
|
289
|
-
export const
|
|
291
|
+
export const amsCheckboxOutlineOffset = "0.25rem";
|
|
292
|
+
export const amsCheckboxCheckedIndicatorStroke = "#ffffff";
|
|
293
|
+
export const amsCheckboxIndeterminateIndicatorStroke = "#ffffff";
|
|
294
|
+
export const amsCheckboxHoverIndicatorHoverStroke = "#003677";
|
|
295
|
+
export const amsCheckboxHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
296
|
+
export const amsCheckboxRectangleFill = "#ffffff";
|
|
297
|
+
export const amsCheckboxRectangleStroke = "#004699";
|
|
298
|
+
export const amsCheckboxRectangleCheckedFill = "#004699";
|
|
299
|
+
export const amsCheckboxRectangleCheckedDisabledFill = "#767676";
|
|
300
|
+
export const amsCheckboxRectangleCheckedDisabledHoverFill = "#767676";
|
|
301
|
+
export const amsCheckboxRectangleCheckedHoverFill = "#003677";
|
|
302
|
+
export const amsCheckboxRectangleCheckedHoverDisabledInvalidFill = "#767676";
|
|
303
|
+
export const amsCheckboxRectangleCheckedInvalidFill = "#ec0000";
|
|
304
|
+
export const amsCheckboxRectangleCheckedInvalidHoverFill = "#b70000";
|
|
305
|
+
export const amsCheckboxRectangleDisabledStroke = "#767676";
|
|
306
|
+
export const amsCheckboxRectangleHoverStroke = "#003677";
|
|
307
|
+
export const amsCheckboxRectangleHoverDisabledInvalidStroke = "#767676";
|
|
308
|
+
export const amsCheckboxRectangleIndeterminateFill = "#004699";
|
|
309
|
+
export const amsCheckboxRectangleIndeterminateDisabledFill = "#767676";
|
|
310
|
+
export const amsCheckboxRectangleIndeterminateDisabledHoverFill = "#767676";
|
|
311
|
+
export const amsCheckboxRectangleIndeterminateHoverFill = "#003677";
|
|
312
|
+
export const amsCheckboxRectangleIndeterminateHoverDisabledInvalidFill =
|
|
290
313
|
"#767676";
|
|
291
|
-
export const
|
|
292
|
-
|
|
293
|
-
export const
|
|
294
|
-
export const
|
|
295
|
-
export const
|
|
296
|
-
|
|
297
|
-
export const
|
|
298
|
-
export const amsCheckboxCheckmarkInvalidHoverBorderColor = "#b70000";
|
|
299
|
-
export const amsCheckboxCheckmarkInvalidIndeterminateBackgroundColor =
|
|
300
|
-
"#ec0000";
|
|
301
|
-
export const amsCheckboxCheckmarkInvalidIndeterminateHoverBackgroundColor =
|
|
302
|
-
"#b70000";
|
|
303
|
-
export const amsCheckboxCheckmarkIndeterminateBackgroundColor = "#004699";
|
|
304
|
-
export const amsCheckboxCheckmarkIndeterminateBackgroundImage =
|
|
305
|
-
"url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='white'%3E%3Cpath fill-rule='evenodd' d='M0 13.714h32v4H0z'/%3E%3C/svg%3E\")";
|
|
306
|
-
export const amsCheckboxCheckmarkIndeterminateHoverBackgroundColor = "#003677";
|
|
314
|
+
export const amsCheckboxRectangleIndeterminateInvalidFill = "#ec0000";
|
|
315
|
+
export const amsCheckboxRectangleIndeterminateInvalidHoverFill = "#b70000";
|
|
316
|
+
export const amsCheckboxRectangleInvalidStroke = "#ec0000";
|
|
317
|
+
export const amsCheckboxRectangleInvalidHoverStroke = "#b70000";
|
|
318
|
+
export const amsCheckboxIconContainerBlockSize =
|
|
319
|
+
"calc(clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem) * 1.6667)";
|
|
320
|
+
export const amsCheckboxIconContainerInlineSize = "1.5rem";
|
|
307
321
|
export const amsCheckboxDisabledCursor = "not-allowed";
|
|
308
322
|
export const amsCheckboxDisabledColor = "#767676";
|
|
309
323
|
export const amsCheckboxHoverColor = "#003677";
|
|
@@ -319,14 +333,16 @@ export const amsColumnGapLarge =
|
|
|
319
333
|
export const amsColumnGapXLarge =
|
|
320
334
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
321
335
|
export const amsDateInputBackgroundColor = "#ffffff";
|
|
322
|
-
export const
|
|
336
|
+
export const amsDateInputBorderColor = "currentColor";
|
|
337
|
+
export const amsDateInputBorderStyle = "solid";
|
|
338
|
+
export const amsDateInputBorderWidth = "0.125rem";
|
|
323
339
|
export const amsDateInputColor = "#181818";
|
|
324
340
|
export const amsDateInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
325
341
|
export const amsDateInputFontSize =
|
|
326
342
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
327
343
|
export const amsDateInputFontWeight = "400";
|
|
328
344
|
export const amsDateInputLineHeight = "1.6667";
|
|
329
|
-
export const amsDateInputOutlineOffset = "0.
|
|
345
|
+
export const amsDateInputOutlineOffset = "0.25rem";
|
|
330
346
|
export const amsDateInputPaddingBlock =
|
|
331
347
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
332
348
|
export const amsDateInputPaddingInline =
|
|
@@ -334,17 +350,17 @@ export const amsDateInputPaddingInline =
|
|
|
334
350
|
export const amsDateInputCalenderPickerIndicatorBackgroundImage =
|
|
335
351
|
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23004699'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")";
|
|
336
352
|
export const amsDateInputCalenderPickerIndicatorCursor = "pointer";
|
|
337
|
-
export const amsDateInputDisabledBackgroundColor = "#ffffff";
|
|
338
|
-
export const amsDateInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
339
353
|
export const amsDateInputDisabledColor = "#767676";
|
|
340
354
|
export const amsDateInputDisabledCursor = "not-allowed";
|
|
341
355
|
export const amsDateInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
342
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%
|
|
343
|
-
export const amsDateInputHoverBoxShadow = "inset 0 0 0 0.
|
|
356
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23767676'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")";
|
|
357
|
+
export const amsDateInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
344
358
|
export const amsDateInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
345
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%
|
|
346
|
-
export const
|
|
347
|
-
export const
|
|
359
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23003677'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")";
|
|
360
|
+
export const amsDateInputInvalidBorderColor = "#ec0000";
|
|
361
|
+
export const amsDateInputInvalidHoverBorderColor = "#b70000";
|
|
362
|
+
export const amsDateInputInvalidHoverBoxShadow =
|
|
363
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
348
364
|
export const amsDescriptionListColor = "#181818";
|
|
349
365
|
export const amsDescriptionListColumnGap =
|
|
350
366
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
@@ -364,27 +380,43 @@ export const amsDescriptionListNarrowGridTemplateColumns = "1fr 4fr";
|
|
|
364
380
|
export const amsDescriptionListMediumGridTemplateColumns = "1fr 2fr";
|
|
365
381
|
export const amsDescriptionListWideGridTemplateColumns = "1fr 1fr";
|
|
366
382
|
export const amsDialogBackgroundColor = "#ffffff";
|
|
367
|
-
export const
|
|
383
|
+
export const amsDialogBorderColor = "#ffffff";
|
|
384
|
+
export const amsDialogBorderStyle = "solid";
|
|
385
|
+
export const amsDialogBorderWidth = "0.125rem";
|
|
368
386
|
export const amsDialogGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
369
387
|
export const amsDialogInlineSize =
|
|
370
|
-
"calc(100% - 2 * clamp(
|
|
388
|
+
"calc(100% - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
371
389
|
export const amsDialogMaxBlockSize =
|
|
372
|
-
"calc(100dvh - 2 * clamp(
|
|
390
|
+
"calc(100dvh - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
373
391
|
export const amsDialogMaxInlineSize = "48rem";
|
|
392
|
+
export const amsDialogMediumInlineSize =
|
|
393
|
+
"calc(100% - 2 * clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem))";
|
|
394
|
+
export const amsDialogMediumMaxBlockSize =
|
|
395
|
+
"calc(100dvh - 2 * clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem))";
|
|
374
396
|
export const amsDialogBackdropBackgroundColor = "rgb(24 24 24 / 62.5%)";
|
|
375
397
|
export const amsDialogHeaderGap =
|
|
376
398
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
377
399
|
export const amsDialogHeaderPaddingBlock =
|
|
378
|
-
"clamp(
|
|
400
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem) 0";
|
|
379
401
|
export const amsDialogHeaderPaddingInline =
|
|
380
|
-
"clamp(
|
|
402
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
403
|
+
export const amsDialogHeaderMediumPaddingBlock =
|
|
404
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem) 0";
|
|
405
|
+
export const amsDialogHeaderMediumPaddingInline =
|
|
406
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
381
407
|
export const amsDialogBodyPaddingBlock = "0";
|
|
382
408
|
export const amsDialogBodyPaddingInline =
|
|
383
|
-
"clamp(
|
|
409
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
410
|
+
export const amsDialogBodyMediumPaddingInline =
|
|
411
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
384
412
|
export const amsDialogFooterPaddingBlock =
|
|
385
|
-
"0 clamp(
|
|
413
|
+
"0 clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
386
414
|
export const amsDialogFooterPaddingInline =
|
|
387
|
-
"clamp(
|
|
415
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
416
|
+
export const amsDialogFooterMediumPaddingBlock =
|
|
417
|
+
"0 clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
418
|
+
export const amsDialogFooterMediumPaddingInline =
|
|
419
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
388
420
|
export const amsErrorMessageColor = "#ec0000";
|
|
389
421
|
export const amsErrorMessageFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
390
422
|
export const amsErrorMessageFontSize =
|
|
@@ -405,6 +437,7 @@ export const amsFieldSetLegendFontWeight = "800";
|
|
|
405
437
|
export const amsFieldSetLegendLineHeight = "1.2928";
|
|
406
438
|
export const amsFieldSetLegendMarginBlockEnd =
|
|
407
439
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
440
|
+
export const amsFieldSetLegendTextWrap = "balance";
|
|
408
441
|
export const amsFieldGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
409
442
|
export const amsFieldInvalidBorderInlineStart = "0.1875rem solid #ec0000";
|
|
410
443
|
export const amsFieldInvalidPaddingInlineStart =
|
|
@@ -418,7 +451,9 @@ export const amsFigureCaptionFontWeight = "400";
|
|
|
418
451
|
export const amsFigureCaptionLineHeight = "1.5152";
|
|
419
452
|
export const amsFigureCaptionInverseColor = "#ffffff";
|
|
420
453
|
export const amsFileInputBackgroundColor = "#ffffff";
|
|
421
|
-
export const
|
|
454
|
+
export const amsFileInputBorderColor = "currentColor";
|
|
455
|
+
export const amsFileInputBorderStyle = "dashed";
|
|
456
|
+
export const amsFileInputBorderWidth = "0.125rem";
|
|
422
457
|
export const amsFileInputColor = "#181818";
|
|
423
458
|
export const amsFileInputCursor = "pointer";
|
|
424
459
|
export const amsFileInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -426,7 +461,7 @@ export const amsFileInputFontSize =
|
|
|
426
461
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
427
462
|
export const amsFileInputFontWeight = "400";
|
|
428
463
|
export const amsFileInputLineHeight = "1.6667";
|
|
429
|
-
export const amsFileInputOutlineOffset = "
|
|
464
|
+
export const amsFileInputOutlineOffset = "0.25rem";
|
|
430
465
|
export const amsFileInputPaddingBlock =
|
|
431
466
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
432
467
|
export const amsFileInputPaddingInline =
|
|
@@ -434,8 +469,9 @@ export const amsFileInputPaddingInline =
|
|
|
434
469
|
export const amsFileInputDisabledColor = "#767676";
|
|
435
470
|
export const amsFileInputDisabledCursor = "not-allowed";
|
|
436
471
|
export const amsFileInputFileSelectorButtonBackgroundColor = "#ffffff";
|
|
437
|
-
export const
|
|
438
|
-
|
|
472
|
+
export const amsFileInputFileSelectorButtonBorderColor = "currentColor";
|
|
473
|
+
export const amsFileInputFileSelectorButtonBorderStyle = "solid";
|
|
474
|
+
export const amsFileInputFileSelectorButtonBorderWidth = "0.125rem";
|
|
439
475
|
export const amsFileInputFileSelectorButtonColor = "#004699";
|
|
440
476
|
export const amsFileInputFileSelectorButtonCursor = "pointer";
|
|
441
477
|
export const amsFileInputFileSelectorButtonMarginInlineEnd =
|
|
@@ -445,14 +481,10 @@ export const amsFileInputFileSelectorButtonPaddingBlock =
|
|
|
445
481
|
export const amsFileInputFileSelectorButtonPaddingInline =
|
|
446
482
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
447
483
|
export const amsFileInputFileSelectorButtonHoverBoxShadow =
|
|
448
|
-
"inset 0 0 0 0.
|
|
484
|
+
"inset 0 0 0 0.0625rem";
|
|
449
485
|
export const amsFileInputFileSelectorButtonHoverColor = "#003677";
|
|
450
|
-
export const amsFileInputFileSelectorButtonDisabledBoxShadow =
|
|
451
|
-
"inset 0 0 0 0.125rem #767676";
|
|
452
486
|
export const amsFileInputFileSelectorButtonDisabledColor = "#767676";
|
|
453
487
|
export const amsFileInputFileSelectorButtonDisabledCursor = "not-allowed";
|
|
454
|
-
export const amsFileInputFileSelectorButtonForcedColorModeBorder =
|
|
455
|
-
"0.125rem solid";
|
|
456
488
|
export const amsFileListGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
457
489
|
export const amsFileListPaddingBlock =
|
|
458
490
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
@@ -465,86 +497,26 @@ export const amsFileListFileGap =
|
|
|
465
497
|
export const amsFileListFileLineHeight = "1.5152";
|
|
466
498
|
export const amsFileListFileDetailsColor = "#767676";
|
|
467
499
|
export const amsFileListFilePreviewWidth = "clamp(2.5rem, 10vw, 5rem)";
|
|
468
|
-
export const amsFooterMenuColumnGap =
|
|
469
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
470
|
-
export const amsFooterMenuPaddingBlock =
|
|
471
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
472
|
-
export const amsFooterMenuPaddingInline =
|
|
473
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
474
|
-
export const amsFooterMenuRowGap =
|
|
475
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
476
|
-
export const amsFooterMenuLinkColor = "#004699";
|
|
477
|
-
export const amsFooterMenuLinkFontFamily =
|
|
478
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
479
|
-
export const amsFooterMenuLinkFontSize =
|
|
480
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
481
|
-
export const amsFooterMenuLinkFontWeight = "400";
|
|
482
|
-
export const amsFooterMenuLinkLineHeight = "1.5152";
|
|
483
|
-
export const amsFooterMenuLinkOutlineOffset = "0.125rem";
|
|
484
|
-
export const amsFooterMenuLinkTextDecorationLine = "none";
|
|
485
|
-
export const amsFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
486
|
-
export const amsFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
487
|
-
export const amsFooterMenuLinkHoverColor = "#003677";
|
|
488
|
-
export const amsFooterMenuLinkHoverTextDecorationLine = "underline";
|
|
489
|
-
export const amsFooterSpotlightBackgroundColor = "#004699";
|
|
490
500
|
export const amsGridColumnCount = "4";
|
|
491
501
|
export const amsGridColumnGap = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
492
|
-
export const
|
|
502
|
+
export const amsGridPaddingBlockL =
|
|
493
503
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
494
|
-
export const
|
|
504
|
+
export const amsGridPaddingBlockXl =
|
|
495
505
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
496
|
-
export const
|
|
506
|
+
export const amsGridPaddingBlock_2xl =
|
|
497
507
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
498
508
|
export const amsGridPaddingInline =
|
|
499
509
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
500
|
-
export const
|
|
501
|
-
export const
|
|
502
|
-
export const
|
|
510
|
+
export const amsGridRowGapL = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
511
|
+
export const amsGridRowGapXl = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
512
|
+
export const amsGridRowGap_2xl =
|
|
513
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
503
514
|
export const amsGridMediumColumnCount = "8";
|
|
504
515
|
export const amsGridMediumPaddingInline =
|
|
505
516
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
506
517
|
export const amsGridWideColumnCount = "12";
|
|
507
518
|
export const amsGridWidePaddingInline =
|
|
508
519
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
509
|
-
export const amsHeaderFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
510
|
-
export const amsHeaderPaddingBlock =
|
|
511
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
512
|
-
export const amsHeaderPaddingInline =
|
|
513
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"; // Must be the Grid inline padding, to make sure Header and Grid line up
|
|
514
|
-
export const amsHeaderLogoLinkColumnGap =
|
|
515
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
516
|
-
export const amsHeaderLogoLinkOutlineOffset = "0.125rem";
|
|
517
|
-
export const amsHeaderBrandNameColor = "#181818";
|
|
518
|
-
export const amsHeaderBrandNameFontSize =
|
|
519
|
-
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
520
|
-
export const amsHeaderBrandNameFontWeight = "800";
|
|
521
|
-
export const amsHeaderMegaMenuButtonCursor = "pointer";
|
|
522
|
-
export const amsHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
523
|
-
export const amsHeaderMenuColumnGap =
|
|
524
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
525
|
-
export const amsHeaderMenuRowGap =
|
|
526
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
527
|
-
export const amsHeaderMenuItemColor = "#004699";
|
|
528
|
-
export const amsHeaderMenuItemColumnGap =
|
|
529
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
530
|
-
export const amsHeaderMenuItemFontFamily =
|
|
531
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
532
|
-
export const amsHeaderMenuItemFontSize =
|
|
533
|
-
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
534
|
-
export const amsHeaderMenuItemFontWeight = "400";
|
|
535
|
-
export const amsHeaderMenuItemLineHeight = "1.6667";
|
|
536
|
-
export const amsHeaderMenuItemOutlineOffset = "0.125rem";
|
|
537
|
-
export const amsHeaderMenuItemPaddingBlock =
|
|
538
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
539
|
-
export const amsHeaderMenuItemHoverColor = "#003677";
|
|
540
|
-
export const amsHeaderMenuLinkTextDecorationLine = "none";
|
|
541
|
-
export const amsHeaderMenuLinkTextDecorationThickness = "0.125rem";
|
|
542
|
-
export const amsHeaderMenuLinkTextUnderlineOffset = "0.3333em";
|
|
543
|
-
export const amsHeaderMenuLinkHoverTextDecorationLine = "underline";
|
|
544
|
-
export const amsHeaderNavigationColumnGap =
|
|
545
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
546
|
-
export const amsHeaderNavigationRowGap =
|
|
547
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
548
520
|
export const amsHeading_1FontSize =
|
|
549
521
|
"clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)";
|
|
550
522
|
export const amsHeading_1LineHeight = "1.1754";
|
|
@@ -566,11 +538,12 @@ export const amsHeading_6LineHeight = "1.3776";
|
|
|
566
538
|
export const amsHeadingColor = "#181818";
|
|
567
539
|
export const amsHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
568
540
|
export const amsHeadingFontWeight = "800";
|
|
541
|
+
export const amsHeadingTextWrap = "balance";
|
|
569
542
|
export const amsHeadingInverseColor = "#ffffff";
|
|
570
|
-
export const
|
|
543
|
+
export const amsHintFontWeight = "400";
|
|
571
544
|
export const amsIconButtonColor = "#004699";
|
|
572
545
|
export const amsIconButtonCursor = "pointer";
|
|
573
|
-
export const amsIconButtonOutlineOffset = "0.
|
|
546
|
+
export const amsIconButtonOutlineOffset = "0.25rem";
|
|
574
547
|
export const amsIconButtonHoverBackgroundColor = "rgb(0 70 153 / 12.5%)";
|
|
575
548
|
export const amsIconButtonHoverColor = "#003677";
|
|
576
549
|
export const amsIconButtonDisabledColor = "#767676";
|
|
@@ -611,23 +584,24 @@ export const amsImageSliderGap =
|
|
|
611
584
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
612
585
|
export const amsImageSliderScrollerGap =
|
|
613
586
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
614
|
-
export const amsImageSliderScrollerOutlineOffset = "0.
|
|
587
|
+
export const amsImageSliderScrollerOutlineOffset = "0.25rem";
|
|
615
588
|
export const amsImageSliderThumbnailsGap =
|
|
616
589
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
617
590
|
export const amsImageSliderThumbnailsThumbnailBackgroundColor = "transparent";
|
|
618
591
|
export const amsImageSliderThumbnailsThumbnailCursor = "pointer";
|
|
619
592
|
export const amsImageSliderThumbnailsThumbnailOpacity = "40%";
|
|
620
|
-
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.
|
|
593
|
+
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.25rem";
|
|
621
594
|
export const amsImageSliderThumbnailsThumbnailInViewOpacity = "100%";
|
|
622
595
|
export const amsImageSliderThumbnailsThumbnailHoverOpacity = "100%";
|
|
623
596
|
export const amsImageAspectRatio = "16 / 9";
|
|
624
|
-
export const amsInvalidFormAlertOutlineOffset = "0.
|
|
597
|
+
export const amsInvalidFormAlertOutlineOffset = "0.25rem";
|
|
625
598
|
export const amsLabelColor = "#181818";
|
|
626
599
|
export const amsLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
627
600
|
export const amsLabelFontSize =
|
|
628
601
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
629
602
|
export const amsLabelFontWeight = "800";
|
|
630
603
|
export const amsLabelLineHeight = "1.2928";
|
|
604
|
+
export const amsLabelTextWrap = "balance";
|
|
631
605
|
export const amsLinkListGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
632
606
|
export const amsLinkListLinkColor = "#004699";
|
|
633
607
|
export const amsLinkListLinkFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -637,7 +611,7 @@ export const amsLinkListLinkFontWeight = "400";
|
|
|
637
611
|
export const amsLinkListLinkGap =
|
|
638
612
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
639
613
|
export const amsLinkListLinkLineHeight = "1.6667";
|
|
640
|
-
export const amsLinkListLinkOutlineOffset = "0.
|
|
614
|
+
export const amsLinkListLinkOutlineOffset = "0.25rem";
|
|
641
615
|
export const amsLinkListLinkTextDecorationLine = "none";
|
|
642
616
|
export const amsLinkListLinkTextDecorationThickness = "0.125rem";
|
|
643
617
|
export const amsLinkListLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -654,24 +628,16 @@ export const amsLinkListLinkContrastHoverColor = "#000000";
|
|
|
654
628
|
export const amsLinkListLinkInverseColor = "#ffffff";
|
|
655
629
|
export const amsLinkListLinkInverseHoverColor = "#ffffff";
|
|
656
630
|
export const amsLinkColor = "#004699";
|
|
657
|
-
export const amsLinkFontFamily = "
|
|
631
|
+
export const amsLinkFontFamily = "inherit";
|
|
632
|
+
export const amsLinkFontSize = "inherit";
|
|
658
633
|
export const amsLinkFontWeight = "400";
|
|
659
|
-
export const
|
|
634
|
+
export const amsLinkLineHeight = "inherit";
|
|
635
|
+
export const amsLinkOutlineOffset = "0.25rem";
|
|
636
|
+
export const amsLinkTextDecorationThickness = "0.125rem";
|
|
637
|
+
export const amsLinkTextUnderlineOffset = "0.3333em";
|
|
660
638
|
export const amsLinkHoverColor = "#003677";
|
|
661
|
-
export const
|
|
662
|
-
export const
|
|
663
|
-
export const amsLinkInlineFontFamily = "inherit";
|
|
664
|
-
export const amsLinkInlineFontSize = "inherit";
|
|
665
|
-
export const amsLinkInlineLineHeight = "inherit";
|
|
666
|
-
export const amsLinkInlineHoverTextDecorationThickness = "0.1875rem";
|
|
667
|
-
export const amsLinkInlineHoverTextUnderlineOffset = "0.2778em";
|
|
668
|
-
export const amsLinkStandaloneFontSize =
|
|
669
|
-
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
670
|
-
export const amsLinkStandaloneLineHeight = "1.6667";
|
|
671
|
-
export const amsLinkStandaloneTextDecorationThickness = "0.125rem";
|
|
672
|
-
export const amsLinkStandaloneTextUnderlineOffset = "0.3333em";
|
|
673
|
-
export const amsLinkStandaloneHoverTextDecorationThickness = "0.1875rem";
|
|
674
|
-
export const amsLinkStandaloneHoverTextUnderlineOffset = "0.2778em";
|
|
639
|
+
export const amsLinkHoverTextDecorationThickness = "0.1875rem";
|
|
640
|
+
export const amsLinkHoverTextUnderlineOffset = "0.2778em";
|
|
675
641
|
export const amsLinkContrastColor = "#000000";
|
|
676
642
|
export const amsLinkContrastHoverColor = "#000000";
|
|
677
643
|
export const amsLinkInverseColor = "#ffffff";
|
|
@@ -682,13 +648,6 @@ export const amsLogoEmblemColor = "#ec0000";
|
|
|
682
648
|
export const amsLogoSubsiteColor = "#181818";
|
|
683
649
|
export const amsLogoTitleColor = "#ec0000";
|
|
684
650
|
export const amsMarkBackgroundColor = "#ffe600";
|
|
685
|
-
export const amsMegaMenuListCategoryColumnGap =
|
|
686
|
-
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)"; // Must have the same value as `ams.grid.column-gap`.
|
|
687
|
-
export const amsMegaMenuListCategoryColumnWidth = "20rem";
|
|
688
|
-
export const amsMegaMenuListCategoryPaddingBlockStart =
|
|
689
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
690
|
-
export const amsMegaMenuListCategoryPaddingBlockEnd =
|
|
691
|
-
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)"; // Must have the same value as `ams.grid.row-gap.md`.
|
|
692
651
|
export const amsOrderedListColor = "#181818";
|
|
693
652
|
export const amsOrderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
694
653
|
export const amsOrderedListFontSize =
|
|
@@ -712,31 +671,87 @@ export const amsOrderedListOrderedListPaddingBlockStart =
|
|
|
712
671
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
713
672
|
export const amsOrderedListOrderedListItemMarginInlineStart = "1.5rem"; // Indent less than the parent to start-align the child’s marker with the parent text.
|
|
714
673
|
export const amsOrderedListOrderedListItemPaddingInlineStart = "0.25rem"; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
|
|
674
|
+
export const amsPageFooterMenuColumnGap =
|
|
675
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
676
|
+
export const amsPageFooterMenuPaddingBlock =
|
|
677
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
678
|
+
export const amsPageFooterMenuPaddingInline =
|
|
679
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
680
|
+
export const amsPageFooterMenuRowGap =
|
|
681
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
682
|
+
export const amsPageFooterMenuMediumPaddingInline =
|
|
683
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
684
|
+
export const amsPageFooterMenuWidePaddingInline =
|
|
685
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
686
|
+
export const amsPageFooterMenuLinkColor = "#004699";
|
|
687
|
+
export const amsPageFooterMenuLinkFontFamily =
|
|
688
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
689
|
+
export const amsPageFooterMenuLinkFontSize =
|
|
690
|
+
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
691
|
+
export const amsPageFooterMenuLinkFontWeight = "400";
|
|
692
|
+
export const amsPageFooterMenuLinkLineHeight = "1.5152";
|
|
693
|
+
export const amsPageFooterMenuLinkOutlineOffset = "0.25rem";
|
|
694
|
+
export const amsPageFooterMenuLinkTextDecorationLine = "none";
|
|
695
|
+
export const amsPageFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
696
|
+
export const amsPageFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
697
|
+
export const amsPageFooterMenuLinkHoverColor = "#003677";
|
|
698
|
+
export const amsPageFooterMenuLinkHoverTextDecorationLine = "underline";
|
|
699
|
+
export const amsPageFooterSpotlightBackgroundColor = "#004699";
|
|
700
|
+
export const amsPageHeaderFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
701
|
+
export const amsPageHeaderPaddingBlock =
|
|
702
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
703
|
+
export const amsPageHeaderPaddingInline =
|
|
704
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"; // Must be the Grid inline padding, to make sure Header and Grid line up
|
|
705
|
+
export const amsPageHeaderMediumPaddingInline =
|
|
706
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
707
|
+
export const amsPageHeaderWidePaddingInline =
|
|
708
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
709
|
+
export const amsPageHeaderLogoLinkColumnGap =
|
|
710
|
+
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
711
|
+
export const amsPageHeaderLogoLinkOutlineOffset = "0.25rem";
|
|
712
|
+
export const amsPageHeaderBrandNameColor = "#181818";
|
|
713
|
+
export const amsPageHeaderBrandNameFontSize =
|
|
714
|
+
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
715
|
+
export const amsPageHeaderBrandNameFontWeight = "800";
|
|
716
|
+
export const amsPageHeaderBrandNameLineHeight = "1.2928";
|
|
717
|
+
export const amsPageHeaderBrandNameTextWrap = "balance";
|
|
718
|
+
export const amsPageHeaderMegaMenuButtonCursor = "pointer";
|
|
719
|
+
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
720
|
+
export const amsPageHeaderMenuColumnGap =
|
|
721
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
722
|
+
export const amsPageHeaderMenuRowGap =
|
|
723
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
724
|
+
export const amsPageHeaderMenuItemColor = "#004699";
|
|
725
|
+
export const amsPageHeaderMenuItemColumnGap =
|
|
726
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
727
|
+
export const amsPageHeaderMenuItemFontFamily =
|
|
728
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
729
|
+
export const amsPageHeaderMenuItemFontSize =
|
|
730
|
+
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
731
|
+
export const amsPageHeaderMenuItemFontWeight = "400";
|
|
732
|
+
export const amsPageHeaderMenuItemLineHeight = "1.6667";
|
|
733
|
+
export const amsPageHeaderMenuItemOutlineOffset = "0.25rem";
|
|
734
|
+
export const amsPageHeaderMenuItemPaddingBlock =
|
|
735
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
736
|
+
export const amsPageHeaderMenuItemHoverColor = "#003677";
|
|
737
|
+
export const amsPageHeaderMenuLinkTextDecorationLine = "none";
|
|
738
|
+
export const amsPageHeaderMenuLinkTextDecorationThickness = "0.125rem";
|
|
739
|
+
export const amsPageHeaderMenuLinkTextUnderlineOffset = "0.3333em";
|
|
740
|
+
export const amsPageHeaderMenuLinkHoverTextDecorationLine = "underline";
|
|
741
|
+
export const amsPageHeaderNavigationColumnGap =
|
|
742
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
743
|
+
export const amsPageHeaderNavigationRowGap =
|
|
744
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
715
745
|
export const amsPageHeadingColor = "#181818";
|
|
716
746
|
export const amsPageHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
717
747
|
export const amsPageHeadingFontSize =
|
|
718
748
|
"clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)";
|
|
719
749
|
export const amsPageHeadingFontWeight = "800";
|
|
720
750
|
export const amsPageHeadingLineHeight = "1.1386";
|
|
751
|
+
export const amsPageHeadingTextWrap = "balance";
|
|
721
752
|
export const amsPageHeadingInverseColor = "#ffffff";
|
|
722
|
-
export const
|
|
723
|
-
|
|
724
|
-
export const amsPageMenuRowGap =
|
|
725
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
726
|
-
export const amsPageMenuItemColor = "#004699";
|
|
727
|
-
export const amsPageMenuItemFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
728
|
-
export const amsPageMenuItemFontSize =
|
|
729
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
730
|
-
export const amsPageMenuItemFontWeight = "400";
|
|
731
|
-
export const amsPageMenuItemGap =
|
|
732
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
733
|
-
export const amsPageMenuItemLineHeight = "1.5152";
|
|
734
|
-
export const amsPageMenuItemOutlineOffset = "0.125rem";
|
|
735
|
-
export const amsPageMenuItemTextDecorationLine = "none";
|
|
736
|
-
export const amsPageMenuItemTextDecorationThickness = "0.125rem";
|
|
737
|
-
export const amsPageMenuItemTextUnderlineOffset = "0.3333em";
|
|
738
|
-
export const amsPageMenuItemHoverColor = "#003677";
|
|
739
|
-
export const amsPageMenuItemHoverTextDecorationLine = "underline";
|
|
753
|
+
export const amsPageBackgroundColor = "#ffffff";
|
|
754
|
+
export const amsPageMaxInlineSize = "100rem";
|
|
740
755
|
export const amsPaginationFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
741
756
|
export const amsPaginationFontSize =
|
|
742
757
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
@@ -745,7 +760,7 @@ export const amsPaginationLineHeight = "1.6667";
|
|
|
745
760
|
export const amsPaginationLinkColor = "#004699";
|
|
746
761
|
export const amsPaginationLinkGap =
|
|
747
762
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
748
|
-
export const amsPaginationLinkOutlineOffset = "0.
|
|
763
|
+
export const amsPaginationLinkOutlineOffset = "0.25rem";
|
|
749
764
|
export const amsPaginationLinkPaddingInline =
|
|
750
765
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
751
766
|
export const amsPaginationLinkTextDecorationLine = "none";
|
|
@@ -768,27 +783,27 @@ export const amsParagraphLargeFontSize =
|
|
|
768
783
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
769
784
|
export const amsParagraphLargeLineHeight = "1.5152";
|
|
770
785
|
export const amsPasswordInputBackgroundColor = "#ffffff";
|
|
771
|
-
export const
|
|
786
|
+
export const amsPasswordInputBorderColor = "currentColor";
|
|
787
|
+
export const amsPasswordInputBorderStyle = "solid";
|
|
788
|
+
export const amsPasswordInputBorderWidth = "0.125rem";
|
|
772
789
|
export const amsPasswordInputColor = "#181818";
|
|
773
790
|
export const amsPasswordInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
774
791
|
export const amsPasswordInputFontSize =
|
|
775
792
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
776
793
|
export const amsPasswordInputFontWeight = "400";
|
|
777
794
|
export const amsPasswordInputLineHeight = "1.6667";
|
|
778
|
-
export const amsPasswordInputOutlineOffset = "0.
|
|
795
|
+
export const amsPasswordInputOutlineOffset = "0.25rem";
|
|
779
796
|
export const amsPasswordInputPaddingBlock =
|
|
780
797
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
781
798
|
export const amsPasswordInputPaddingInline =
|
|
782
799
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
783
|
-
export const amsPasswordInputDisabledBackgroundColor = "#ffffff";
|
|
784
|
-
export const amsPasswordInputDisabledBoxShadow =
|
|
785
|
-
"inset 0 0 0 0.0625rem #767676";
|
|
786
800
|
export const amsPasswordInputDisabledColor = "#767676";
|
|
787
801
|
export const amsPasswordInputDisabledCursor = "not-allowed";
|
|
788
|
-
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.
|
|
789
|
-
export const
|
|
802
|
+
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
803
|
+
export const amsPasswordInputInvalidBorderColor = "#ec0000";
|
|
804
|
+
export const amsPasswordInputInvalidHoverBorderColor = "#b70000";
|
|
790
805
|
export const amsPasswordInputInvalidHoverBoxShadow =
|
|
791
|
-
"inset 0 0 0 0.
|
|
806
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
792
807
|
export const amsPasswordInputPlaceholderColor = "#767676";
|
|
793
808
|
export const amsRadioColor = "#181818";
|
|
794
809
|
export const amsRadioCursor = "pointer";
|
|
@@ -798,7 +813,7 @@ export const amsRadioFontSize =
|
|
|
798
813
|
export const amsRadioFontWeight = "400";
|
|
799
814
|
export const amsRadioGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
800
815
|
export const amsRadioLineHeight = "1.6667";
|
|
801
|
-
export const amsRadioOutlineOffset = "0.
|
|
816
|
+
export const amsRadioOutlineOffset = "0.25rem";
|
|
802
817
|
export const amsRadioTextDecorationThickness = "0.125rem";
|
|
803
818
|
export const amsRadioTextUnderlineOffset = "0.3333em";
|
|
804
819
|
export const amsRadioCheckedIndicatorFill = "#004699";
|
|
@@ -808,12 +823,10 @@ export const amsRadioCheckedIndicatorDisabledInvalidHoverFill = "#767676";
|
|
|
808
823
|
export const amsRadioCheckedIndicatorHoverFill = "#003677";
|
|
809
824
|
export const amsRadioCheckedIndicatorInvalidFill = "#ec0000";
|
|
810
825
|
export const amsRadioCheckedIndicatorInvalidHoverFill = "#b70000";
|
|
811
|
-
export const amsRadioHoverIndicatorStrokeWidth = "3px";
|
|
812
826
|
export const amsRadioHoverIndicatorHoverStroke = "#003677";
|
|
813
827
|
export const amsRadioHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
814
828
|
export const amsRadioCircleFill = "#ffffff";
|
|
815
829
|
export const amsRadioCircleStroke = "#004699";
|
|
816
|
-
export const amsRadioCircleStrokeWidth = "2px";
|
|
817
830
|
export const amsRadioCircleDisabledStroke = "#767676";
|
|
818
831
|
export const amsRadioCircleDisabledInvalidStroke = "#767676";
|
|
819
832
|
export const amsRadioCircleDisabledInvalidHoverStroke = "#767676";
|
|
@@ -833,11 +846,10 @@ export const amsRowGapSmall = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
|
833
846
|
export const amsRowGapMedium = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
834
847
|
export const amsRowGapLarge = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
835
848
|
export const amsRowGapXLarge = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
836
|
-
export const amsScreenBackgroundColor = "#ffffff";
|
|
837
|
-
export const amsScreenWideMaxInlineSize = "100rem";
|
|
838
|
-
export const amsScreenXWideMaxInlineSize = "132rem";
|
|
839
849
|
export const amsSearchFieldInputBackgroundColor = "#ffffff";
|
|
840
|
-
export const
|
|
850
|
+
export const amsSearchFieldInputBorderColor = "currentColor";
|
|
851
|
+
export const amsSearchFieldInputBorderStyle = "solid";
|
|
852
|
+
export const amsSearchFieldInputBorderWidth = "0.125rem";
|
|
841
853
|
export const amsSearchFieldInputColor = "#181818";
|
|
842
854
|
export const amsSearchFieldInputFontFamily =
|
|
843
855
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -845,7 +857,7 @@ export const amsSearchFieldInputFontSize =
|
|
|
845
857
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
846
858
|
export const amsSearchFieldInputFontWeight = "400";
|
|
847
859
|
export const amsSearchFieldInputLineHeight = "1.6667";
|
|
848
|
-
export const amsSearchFieldInputOutlineOffset = "0.
|
|
860
|
+
export const amsSearchFieldInputOutlineOffset = "0.25rem";
|
|
849
861
|
export const amsSearchFieldInputPaddingBlock =
|
|
850
862
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
851
863
|
export const amsSearchFieldInputPaddingInline =
|
|
@@ -858,37 +870,41 @@ export const amsSearchFieldInputCancelButtonColor = "#004699";
|
|
|
858
870
|
export const amsSearchFieldInputCancelButtonCursor = "pointer";
|
|
859
871
|
export const amsSearchFieldInputCancelButtonInlineSize =
|
|
860
872
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
861
|
-
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.
|
|
862
|
-
export const
|
|
863
|
-
|
|
873
|
+
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
874
|
+
export const amsSearchFieldInputInvalidBorderColor = "#ec0000";
|
|
875
|
+
export const amsSearchFieldInputInvalidHoverBorderColor = "#b70000";
|
|
864
876
|
export const amsSearchFieldInputInvalidHoverBoxShadow =
|
|
865
|
-
"inset 0 0 0 0.
|
|
877
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
866
878
|
export const amsSearchFieldInputPlaceholderColor = "#767676";
|
|
867
879
|
export const amsSelectBackgroundColor = "#ffffff";
|
|
868
880
|
export const amsSelectBackgroundImage =
|
|
869
881
|
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23004699' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")";
|
|
870
882
|
export const amsSelectBackgroundPosition =
|
|
871
883
|
"right clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) center";
|
|
872
|
-
export const
|
|
884
|
+
export const amsSelectBorderColor = "currentColor";
|
|
885
|
+
export const amsSelectBorderStyle = "solid";
|
|
886
|
+
export const amsSelectBorderWidth = "0.125rem";
|
|
873
887
|
export const amsSelectColor = "#181818";
|
|
874
888
|
export const amsSelectFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
875
889
|
export const amsSelectFontSize =
|
|
876
890
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
877
891
|
export const amsSelectFontWeight = "400";
|
|
878
892
|
export const amsSelectLineHeight = "1.6667";
|
|
879
|
-
export const amsSelectOutlineOffset = "0.
|
|
893
|
+
export const amsSelectOutlineOffset = "0.25rem";
|
|
880
894
|
export const amsSelectPaddingBlock =
|
|
881
895
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
882
896
|
export const amsSelectPaddingInline =
|
|
883
897
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) calc(2 * clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) + 1em)";
|
|
884
898
|
export const amsSelectDisabledBackgroundImage =
|
|
885
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%
|
|
886
|
-
export const amsSelectDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
899
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23767676' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")";
|
|
887
900
|
export const amsSelectDisabledColor = "#767676";
|
|
888
901
|
export const amsSelectDisabledCursor = "not-allowed";
|
|
889
|
-
export const amsSelectHoverBoxShadow = "inset 0 0 0 0.
|
|
890
|
-
export const
|
|
891
|
-
|
|
902
|
+
export const amsSelectHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
903
|
+
export const amsSelectHoverBackgroundImage =
|
|
904
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23003677' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")";
|
|
905
|
+
export const amsSelectInvalidBorderColor = "#ec0000";
|
|
906
|
+
export const amsSelectInvalidHoverBorderColor = "#b70000";
|
|
907
|
+
export const amsSelectInvalidHoverBoxShadow = "inset 0 0 0 0.0625rem #b70000";
|
|
892
908
|
export const amsSelectOptionDisabledColor = "#767676";
|
|
893
909
|
export const amsSkipLinkBackgroundColor = "#004699";
|
|
894
910
|
export const amsSkipLinkColor = "#ffffff";
|
|
@@ -897,7 +913,7 @@ export const amsSkipLinkFontSize =
|
|
|
897
913
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
898
914
|
export const amsSkipLinkFontWeight = "400";
|
|
899
915
|
export const amsSkipLinkLineHeight = "1.5152";
|
|
900
|
-
export const amsSkipLinkOutlineOffset = "0.
|
|
916
|
+
export const amsSkipLinkOutlineOffset = "0.25rem";
|
|
901
917
|
export const amsSkipLinkPaddingBlock =
|
|
902
918
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
903
919
|
export const amsSkipLinkPaddingInline =
|
|
@@ -910,13 +926,34 @@ export const amsSpotlightLimeBackgroundColor = "#bed200";
|
|
|
910
926
|
export const amsSpotlightMagentaBackgroundColor = "#e50082";
|
|
911
927
|
export const amsSpotlightOrangeBackgroundColor = "#ff9100";
|
|
912
928
|
export const amsSpotlightYellowBackgroundColor = "#ffe600";
|
|
929
|
+
export const amsStandaloneLinkColor = "#004699";
|
|
930
|
+
export const amsStandaloneLinkColumnGap =
|
|
931
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
932
|
+
export const amsStandaloneLinkFontFamily =
|
|
933
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
934
|
+
export const amsStandaloneLinkFontSize =
|
|
935
|
+
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
936
|
+
export const amsStandaloneLinkFontWeight = "400";
|
|
937
|
+
export const amsStandaloneLinkLineHeight = "1.6667";
|
|
938
|
+
export const amsStandaloneLinkOutlineOffset = "0.25rem";
|
|
939
|
+
export const amsStandaloneLinkTextDecorationThickness = "0.125rem";
|
|
940
|
+
export const amsStandaloneLinkTextUnderlineOffset = "0.3333em";
|
|
941
|
+
export const amsStandaloneLinkContrastColor = "#000000";
|
|
942
|
+
export const amsStandaloneLinkContrastHoverColor = "#000000";
|
|
943
|
+
export const amsStandaloneLinkHoverColor = "#003677";
|
|
944
|
+
export const amsStandaloneLinkHoverTextDecorationThickness = "0.1875rem";
|
|
945
|
+
export const amsStandaloneLinkHoverTextUnderlineOffset = "0.2778em";
|
|
946
|
+
export const amsStandaloneLinkInverseColor = "#ffffff";
|
|
947
|
+
export const amsStandaloneLinkInverseHoverColor = "#ffffff";
|
|
948
|
+
export const amsStandaloneLinkWithIconTextDecorationLine = "none";
|
|
949
|
+
export const amsStandaloneLinkWithIconHoverTextDecorationLine = "underline";
|
|
913
950
|
export const amsSwitchBackgroundColor = "#767676";
|
|
914
951
|
export const amsSwitchCursor = "pointer";
|
|
915
|
-
export const amsSwitchOutlineOffset = "0.
|
|
952
|
+
export const amsSwitchOutlineOffset = "0.25rem";
|
|
916
953
|
export const amsSwitchInlineSize = "3.5rem";
|
|
917
954
|
export const amsSwitchThumbBackgroundColor = "#ffffff";
|
|
918
|
-
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
919
955
|
export const amsSwitchThumbBlockSize = "1.75rem";
|
|
956
|
+
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
920
957
|
export const amsSwitchThumbHoverBoxShadow = "0 0 0 0.125rem #003677";
|
|
921
958
|
export const amsSwitchThumbHoverColor = "#003677";
|
|
922
959
|
export const amsSwitchCheckedBackgroundColor = "#004699";
|
|
@@ -931,7 +968,7 @@ export const amsTableOfContentsGap =
|
|
|
931
968
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
932
969
|
export const amsTableOfContentsLineHeight = "1.6667";
|
|
933
970
|
export const amsTableOfContentsLinkColor = "#004699";
|
|
934
|
-
export const amsTableOfContentsLinkOutlineOffset = "0.
|
|
971
|
+
export const amsTableOfContentsLinkOutlineOffset = "0.25rem";
|
|
935
972
|
export const amsTableOfContentsLinkTextDecorationLine = "none";
|
|
936
973
|
export const amsTableOfContentsLinkTextDecorationThickness = "0.125rem";
|
|
937
974
|
export const amsTableOfContentsLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -969,19 +1006,21 @@ export const amsTabsButtonFontSize =
|
|
|
969
1006
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
970
1007
|
export const amsTabsButtonFontWeight = "400";
|
|
971
1008
|
export const amsTabsButtonLineHeight = "1.6667";
|
|
972
|
-
export const amsTabsButtonOutlineOffset = "
|
|
1009
|
+
export const amsTabsButtonOutlineOffset = "calc(0.25rem * -1)";
|
|
973
1010
|
export const amsTabsButtonPaddingBlock =
|
|
974
1011
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
975
1012
|
export const amsTabsButtonPaddingInline =
|
|
976
1013
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
977
|
-
export const amsTabsButtonHoverColor = "#003677";
|
|
978
1014
|
export const amsTabsButtonHoverBoxShadow = "inset 0 calc(0.125rem * -1)";
|
|
1015
|
+
export const amsTabsButtonHoverColor = "#003677";
|
|
979
1016
|
export const amsTabsButtonSelectedBoxShadow = "inset 0 calc(0.25rem * -1)";
|
|
980
1017
|
export const amsTabsButtonSelectedFontWeight = "800";
|
|
981
1018
|
export const amsTabsButtonDisabledColor = "#767676";
|
|
982
1019
|
export const amsTabsButtonDisabledCursor = "not-allowed";
|
|
983
1020
|
export const amsTextAreaBackgroundColor = "#ffffff";
|
|
984
|
-
export const
|
|
1021
|
+
export const amsTextAreaBorderColor = "currentColor";
|
|
1022
|
+
export const amsTextAreaBorderStyle = "solid";
|
|
1023
|
+
export const amsTextAreaBorderWidth = "0.125rem";
|
|
985
1024
|
export const amsTextAreaColor = "#181818";
|
|
986
1025
|
export const amsTextAreaFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
987
1026
|
export const amsTextAreaFontSize =
|
|
@@ -990,49 +1029,52 @@ export const amsTextAreaFontWeight = "400";
|
|
|
990
1029
|
export const amsTextAreaLineHeight = "1.6667";
|
|
991
1030
|
export const amsTextAreaMinBlockSize =
|
|
992
1031
|
"calc(1.6667 * 1em + 2 * clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem))";
|
|
993
|
-
export const amsTextAreaOutlineOffset = "0.
|
|
1032
|
+
export const amsTextAreaOutlineOffset = "0.25rem";
|
|
994
1033
|
export const amsTextAreaPaddingBlock =
|
|
995
1034
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
996
1035
|
export const amsTextAreaPaddingInline =
|
|
997
1036
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
998
|
-
export const amsTextAreaDisabledBackgroundColor = "#ffffff";
|
|
999
|
-
export const amsTextAreaDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1000
1037
|
export const amsTextAreaDisabledColor = "#767676";
|
|
1001
1038
|
export const amsTextAreaDisabledCursor = "not-allowed";
|
|
1002
|
-
export const amsTextAreaHoverBoxShadow = "inset 0 0 0 0.
|
|
1003
|
-
export const
|
|
1004
|
-
export const
|
|
1039
|
+
export const amsTextAreaHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1040
|
+
export const amsTextAreaInvalidBorderColor = "#ec0000";
|
|
1041
|
+
export const amsTextAreaInvalidHoverBorderColor = "#b70000";
|
|
1042
|
+
export const amsTextAreaInvalidHoverBoxShadow = "inset 0 0 0 0.0625rem #b70000";
|
|
1005
1043
|
export const amsTextAreaPlaceholderColor = "#767676";
|
|
1006
1044
|
export const amsTextInputBackgroundColor = "#ffffff";
|
|
1007
|
-
export const
|
|
1045
|
+
export const amsTextInputBorderColor = "currentColor";
|
|
1046
|
+
export const amsTextInputBorderStyle = "solid";
|
|
1047
|
+
export const amsTextInputBorderWidth = "0.125rem";
|
|
1008
1048
|
export const amsTextInputColor = "#181818";
|
|
1009
1049
|
export const amsTextInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1010
1050
|
export const amsTextInputFontSize =
|
|
1011
1051
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1012
1052
|
export const amsTextInputFontWeight = "400";
|
|
1013
1053
|
export const amsTextInputLineHeight = "1.6667";
|
|
1014
|
-
export const amsTextInputOutlineOffset = "0.
|
|
1054
|
+
export const amsTextInputOutlineOffset = "0.25rem";
|
|
1015
1055
|
export const amsTextInputPaddingBlock =
|
|
1016
1056
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1017
1057
|
export const amsTextInputPaddingInline =
|
|
1018
1058
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
1019
|
-
export const amsTextInputDisabledBackgroundColor = "#ffffff";
|
|
1020
|
-
export const amsTextInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1021
1059
|
export const amsTextInputDisabledColor = "#767676";
|
|
1022
1060
|
export const amsTextInputDisabledCursor = "not-allowed";
|
|
1023
|
-
export const amsTextInputHoverBoxShadow = "inset 0 0 0 0.
|
|
1024
|
-
export const
|
|
1025
|
-
export const
|
|
1061
|
+
export const amsTextInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1062
|
+
export const amsTextInputInvalidBorderColor = "#ec0000";
|
|
1063
|
+
export const amsTextInputInvalidHoverBorderColor = "#b70000";
|
|
1064
|
+
export const amsTextInputInvalidHoverBoxShadow =
|
|
1065
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
1026
1066
|
export const amsTextInputPlaceholderColor = "#767676";
|
|
1027
1067
|
export const amsTimeInputBackgroundColor = "#ffffff";
|
|
1028
|
-
export const
|
|
1068
|
+
export const amsTimeInputBorderColor = "currentColor";
|
|
1069
|
+
export const amsTimeInputBorderStyle = "solid";
|
|
1070
|
+
export const amsTimeInputBorderWidth = "0.125rem";
|
|
1029
1071
|
export const amsTimeInputColor = "#181818";
|
|
1030
1072
|
export const amsTimeInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1031
1073
|
export const amsTimeInputFontSize =
|
|
1032
1074
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1033
1075
|
export const amsTimeInputFontWeight = "400";
|
|
1034
1076
|
export const amsTimeInputLineHeight = "1.6667";
|
|
1035
|
-
export const amsTimeInputOutlineOffset = "0.
|
|
1077
|
+
export const amsTimeInputOutlineOffset = "0.25rem";
|
|
1036
1078
|
export const amsTimeInputPaddingBlock =
|
|
1037
1079
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1038
1080
|
export const amsTimeInputPaddingInline =
|
|
@@ -1040,39 +1082,17 @@ export const amsTimeInputPaddingInline =
|
|
|
1040
1082
|
export const amsTimeInputCalenderPickerIndicatorBackgroundImage =
|
|
1041
1083
|
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23004699'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")";
|
|
1042
1084
|
export const amsTimeInputCalenderPickerIndicatorCursor = "pointer";
|
|
1043
|
-
export const amsTimeInputDisabledBackgroundColor = "#ffffff";
|
|
1044
|
-
export const amsTimeInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1045
1085
|
export const amsTimeInputDisabledColor = "#767676";
|
|
1046
1086
|
export const amsTimeInputDisabledCursor = "not-allowed";
|
|
1047
1087
|
export const amsTimeInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
1048
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%
|
|
1049
|
-
export const amsTimeInputHoverBoxShadow = "inset 0 0 0 0.
|
|
1088
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23767676'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")";
|
|
1089
|
+
export const amsTimeInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1050
1090
|
export const amsTimeInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
1051
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%
|
|
1052
|
-
export const
|
|
1053
|
-
export const
|
|
1054
|
-
export const
|
|
1055
|
-
"
|
|
1056
|
-
export const amsTopTaskLinkDescriptionColor = "#181818";
|
|
1057
|
-
export const amsTopTaskLinkDescriptionFontFamily =
|
|
1058
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
1059
|
-
export const amsTopTaskLinkDescriptionFontSize =
|
|
1060
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
1061
|
-
export const amsTopTaskLinkDescriptionFontWeight = "400";
|
|
1062
|
-
export const amsTopTaskLinkDescriptionLineHeight = "1.5152";
|
|
1063
|
-
export const amsTopTaskLinkLabelColor = "#004699";
|
|
1064
|
-
export const amsTopTaskLinkLabelFontFamily =
|
|
1065
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
1066
|
-
export const amsTopTaskLinkLabelFontSize =
|
|
1067
|
-
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
1068
|
-
export const amsTopTaskLinkLabelFontWeight = "800";
|
|
1069
|
-
export const amsTopTaskLinkLabelLineHeight = "1.2928";
|
|
1070
|
-
export const amsTopTaskLinkLabelTextDecorationLine = "none";
|
|
1071
|
-
export const amsTopTaskLinkLabelTextDecorationThickness = "0.125rem";
|
|
1072
|
-
export const amsTopTaskLinkLabelTextUnderlineOffset = "0.3333em";
|
|
1073
|
-
export const amsTopTaskLinkLabelHoverColor = "#003677";
|
|
1074
|
-
export const amsTopTaskLinkLabelHoverTextDecorationLine = "underline";
|
|
1075
|
-
export const amsTopTaskLinkOutlineOffset = "0.125rem";
|
|
1091
|
+
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23003677'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")";
|
|
1092
|
+
export const amsTimeInputInvalidBorderColor = "#ec0000";
|
|
1093
|
+
export const amsTimeInputInvalidHoverBorderColor = "#b70000";
|
|
1094
|
+
export const amsTimeInputInvalidHoverBoxShadow =
|
|
1095
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
1076
1096
|
export const amsUnorderedListColor = "#181818";
|
|
1077
1097
|
export const amsUnorderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1078
1098
|
export const amsUnorderedListFontSize =
|