@amsterdam/design-system-tokens 0.16.0 → 1.0.1
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 +33 -0
- package/README.md +10 -3
- 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 +138 -109
- package/dist/index.d.ts +136 -93
- package/dist/index.json +191 -148
- package/dist/index.mjs +162 -140
- package/dist/index.scss +129 -100
- package/dist/index.theme.css +138 -109
- package/package.json +2 -2
- package/src/brand/ams/focus.tokens.json +1 -1
- package/src/brand/ams/typography.compact.tokens.json +2 -1
- package/src/components/ams/alert.tokens.json +6 -7
- package/src/components/ams/avatar.tokens.json +9 -0
- package/src/components/ams/button.tokens.json +19 -21
- 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 +3 -1
- package/src/components/ams/file-input.tokens.json +8 -11
- package/src/components/ams/hint.tokens.json +1 -1
- package/src/components/ams/page-header.compact.tokens.json +10 -0
- package/src/components/ams/page-header.tokens.json +1 -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/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/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)";
|
|
@@ -107,7 +107,7 @@ export const amsAccordionButtonFontWeight = "800";
|
|
|
107
107
|
export const amsAccordionButtonGap =
|
|
108
108
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
109
109
|
export const amsAccordionButtonLineHeight = "1.2928";
|
|
110
|
-
export const amsAccordionButtonOutlineOffset = "0.
|
|
110
|
+
export const amsAccordionButtonOutlineOffset = "0.25rem";
|
|
111
111
|
export const amsAccordionButtonPaddingBlock =
|
|
112
112
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
113
113
|
export const amsAccordionButtonPaddingInline = "0";
|
|
@@ -118,8 +118,9 @@ export const amsAccordionPanelPaddingInline = "0";
|
|
|
118
118
|
export const amsActionGroupGap =
|
|
119
119
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
120
120
|
export const amsAlertBackgroundColor = "#ffffff";
|
|
121
|
-
export const
|
|
122
|
-
export const
|
|
121
|
+
export const amsAlertBorderColor = "#009de6";
|
|
122
|
+
export const amsAlertBorderStyle = "solid";
|
|
123
|
+
export const amsAlertBorderWidth = "0.25rem";
|
|
123
124
|
export const amsAlertSeverityIndicatorBackgroundColor = "#009de6";
|
|
124
125
|
export const amsAlertSeverityIndicatorPaddingBlock =
|
|
125
126
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
@@ -131,14 +132,17 @@ export const amsAlertContentPaddingBlock =
|
|
|
131
132
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
132
133
|
export const amsAlertContentPaddingInline =
|
|
133
134
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
134
|
-
export const
|
|
135
|
+
export const amsAlertErrorBorderColor = "#ec0000";
|
|
135
136
|
export const amsAlertErrorSeverityIndicatorBackgroundColor = "#ec0000";
|
|
136
|
-
export const
|
|
137
|
+
export const amsAlertSuccessBorderColor = "#00a03c";
|
|
137
138
|
export const amsAlertSuccessSeverityIndicatorBackgroundColor = "#00a03c";
|
|
138
|
-
export const
|
|
139
|
+
export const amsAlertWarningBorderColor = "#ff9100";
|
|
139
140
|
export const amsAlertWarningSeverityIndicatorBackgroundColor = "#ff9100";
|
|
140
141
|
export const amsAvatarAspectRatio = "1 / 1";
|
|
141
142
|
export const amsAvatarBackgroundColor = "#a00078";
|
|
143
|
+
export const amsAvatarBorderColor = "#a00078";
|
|
144
|
+
export const amsAvatarBorderStyle = "solid";
|
|
145
|
+
export const amsAvatarBorderWidth = "0.125rem";
|
|
142
146
|
export const amsAvatarColor = "#ffffff";
|
|
143
147
|
export const amsAvatarFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
144
148
|
export const amsAvatarFontSize =
|
|
@@ -151,16 +155,22 @@ export const amsAvatarPaddingInline =
|
|
|
151
155
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
152
156
|
export const amsAvatarForcedColorsBorderWidth = "0.125rem";
|
|
153
157
|
export const amsAvatarAzureBackgroundColor = "#009de6";
|
|
158
|
+
export const amsAvatarAzureBorderColor = "#009de6";
|
|
154
159
|
export const amsAvatarAzureColor = "#ffffff";
|
|
155
160
|
export const amsAvatarGreenBackgroundColor = "#00a03c";
|
|
161
|
+
export const amsAvatarGreenBorderColor = "#00a03c";
|
|
156
162
|
export const amsAvatarGreenColor = "#ffffff";
|
|
157
163
|
export const amsAvatarLimeBackgroundColor = "#bed200";
|
|
164
|
+
export const amsAvatarLimeBorderColor = "#bed200";
|
|
158
165
|
export const amsAvatarLimeColor = "#181818";
|
|
159
166
|
export const amsAvatarMagentaBackgroundColor = "#e50082";
|
|
167
|
+
export const amsAvatarMagentaBorderColor = "#e50082";
|
|
160
168
|
export const amsAvatarMagentaColor = "#ffffff";
|
|
161
169
|
export const amsAvatarOrangeBackgroundColor = "#ff9100";
|
|
170
|
+
export const amsAvatarOrangeBorderColor = "#ff9100";
|
|
162
171
|
export const amsAvatarOrangeColor = "#181818";
|
|
163
172
|
export const amsAvatarYellowBackgroundColor = "#ffe600";
|
|
173
|
+
export const amsAvatarYellowBorderColor = "#ffe600";
|
|
164
174
|
export const amsAvatarYellowColor = "#181818";
|
|
165
175
|
export const amsBadgeBackgroundColor = "#00a03c";
|
|
166
176
|
export const amsBadgeColor = "#ffffff";
|
|
@@ -204,12 +214,14 @@ export const amsBreadcrumbSeparatorInlineSize = "1ex";
|
|
|
204
214
|
export const amsBreadcrumbSeparatorMarginInline =
|
|
205
215
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
206
216
|
export const amsBreadcrumbLinkColor = "#004699";
|
|
207
|
-
export const amsBreadcrumbLinkOutlineOffset = "0.
|
|
217
|
+
export const amsBreadcrumbLinkOutlineOffset = "0.25rem";
|
|
208
218
|
export const amsBreadcrumbLinkTextDecorationLine = "none";
|
|
209
219
|
export const amsBreadcrumbLinkTextDecorationThickness = "0.125rem";
|
|
210
220
|
export const amsBreadcrumbLinkTextUnderlineOffset = "0.3333em";
|
|
211
221
|
export const amsBreadcrumbLinkHoverColor = "#003677";
|
|
212
222
|
export const amsBreadcrumbLinkHoverTextDecorationLine = "underline";
|
|
223
|
+
export const amsButtonBorderStyle = "solid";
|
|
224
|
+
export const amsButtonBorderWidth = "0.125rem";
|
|
213
225
|
export const amsButtonCursor = "pointer";
|
|
214
226
|
export const amsButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
215
227
|
export const amsButtonFontSize =
|
|
@@ -217,39 +229,36 @@ export const amsButtonFontSize =
|
|
|
217
229
|
export const amsButtonFontWeight = "400";
|
|
218
230
|
export const amsButtonLineHeight = "1.6667";
|
|
219
231
|
export const amsButtonGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
220
|
-
export const amsButtonOutlineOffset = "0.
|
|
232
|
+
export const amsButtonOutlineOffset = "0.25rem";
|
|
221
233
|
export const amsButtonPaddingBlock =
|
|
222
234
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
223
235
|
export const amsButtonPaddingInline =
|
|
224
236
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
225
237
|
export const amsButtonDisabledCursor = "not-allowed";
|
|
226
|
-
export const
|
|
238
|
+
export const amsButtonIconOnlyPaddingBlock =
|
|
239
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
240
|
+
export const amsButtonIconOnlyPaddingInline =
|
|
241
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
227
242
|
export const amsButtonPrimaryBackgroundColor = "#004699";
|
|
228
|
-
export const
|
|
243
|
+
export const amsButtonPrimaryBorderColor = "#004699";
|
|
229
244
|
export const amsButtonPrimaryColor = "#ffffff";
|
|
230
245
|
export const amsButtonPrimaryDisabledBackgroundColor = "#767676";
|
|
231
|
-
export const
|
|
246
|
+
export const amsButtonPrimaryDisabledBorderColor = "#767676";
|
|
232
247
|
export const amsButtonPrimaryHoverBackgroundColor = "#003677";
|
|
233
|
-
export const
|
|
248
|
+
export const amsButtonPrimaryHoverBorderColor = "#003677";
|
|
234
249
|
export const amsButtonSecondaryBackgroundColor = "#ffffff";
|
|
250
|
+
export const amsButtonSecondaryBorderColor = "currentColor";
|
|
235
251
|
export const amsButtonSecondaryColor = "#004699";
|
|
236
|
-
export const
|
|
237
|
-
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.1875rem #003677";
|
|
238
|
-
export const amsButtonSecondaryHoverColor = "#003677";
|
|
239
|
-
export const amsButtonSecondaryDisabledBackgroundColor = "#ffffff";
|
|
240
|
-
export const amsButtonSecondaryDisabledBoxShadow =
|
|
241
|
-
"inset 0 0 0 0.125rem #767676";
|
|
252
|
+
export const amsButtonSecondaryDisabledBorderColor = "#767676";
|
|
242
253
|
export const amsButtonSecondaryDisabledColor = "#767676";
|
|
254
|
+
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
255
|
+
export const amsButtonSecondaryHoverColor = "#003677";
|
|
243
256
|
export const amsButtonTertiaryBackgroundColor = "transparent";
|
|
257
|
+
export const amsButtonTertiaryBorderColor = "transparent";
|
|
244
258
|
export const amsButtonTertiaryColor = "#004699";
|
|
245
|
-
export const amsButtonTertiaryHoverBoxShadow = "inset 0 0 0 0.125rem #003677";
|
|
246
|
-
export const amsButtonTertiaryHoverColor = "#003677";
|
|
247
|
-
export const amsButtonTertiaryDisabledBackgroundColor = "transparent";
|
|
248
259
|
export const amsButtonTertiaryDisabledColor = "#767676";
|
|
249
|
-
export const
|
|
250
|
-
|
|
251
|
-
export const amsButtonIconOnlyPaddingInline =
|
|
252
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
260
|
+
export const amsButtonTertiaryHoverBorderColor = "currentColor";
|
|
261
|
+
export const amsButtonTertiaryHoverColor = "#003677";
|
|
253
262
|
export const amsCardHeadingMarginBlockEnd =
|
|
254
263
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
255
264
|
export const amsCardHeadingGroupGap =
|
|
@@ -264,7 +273,7 @@ export const amsCardLinkTextDecorationThickness = "0.125rem";
|
|
|
264
273
|
export const amsCardLinkTextUnderlineOffset = "0.3333em";
|
|
265
274
|
export const amsCardLinkHoverColor = "#003677";
|
|
266
275
|
export const amsCardLinkHoverTextDecorationLine = "underline";
|
|
267
|
-
export const amsCardOutlineOffset = "0.
|
|
276
|
+
export const amsCardOutlineOffset = "0.25rem";
|
|
268
277
|
export const amsCharacterCountColor = "#181818";
|
|
269
278
|
export const amsCharacterCountFontFamily =
|
|
270
279
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -281,36 +290,36 @@ export const amsCheckboxFontSize =
|
|
|
281
290
|
export const amsCheckboxFontWeight = "400";
|
|
282
291
|
export const amsCheckboxGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
283
292
|
export const amsCheckboxLineHeight = "1.6667";
|
|
284
|
-
export const amsCheckboxOutlineOffset = "0.
|
|
285
|
-
export const
|
|
286
|
-
export const
|
|
287
|
-
export const
|
|
288
|
-
export const
|
|
289
|
-
|
|
290
|
-
export const
|
|
291
|
-
export const
|
|
292
|
-
export const
|
|
293
|
-
export const
|
|
294
|
-
export const
|
|
295
|
-
|
|
296
|
-
export const
|
|
293
|
+
export const amsCheckboxOutlineOffset = "0.25rem";
|
|
294
|
+
export const amsCheckboxCheckedIndicatorStroke = "#ffffff";
|
|
295
|
+
export const amsCheckboxIndeterminateIndicatorStroke = "#ffffff";
|
|
296
|
+
export const amsCheckboxHoverIndicatorHoverStroke = "#003677";
|
|
297
|
+
export const amsCheckboxHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
298
|
+
export const amsCheckboxRectangleFill = "#ffffff";
|
|
299
|
+
export const amsCheckboxRectangleStroke = "#004699";
|
|
300
|
+
export const amsCheckboxRectangleCheckedFill = "#004699";
|
|
301
|
+
export const amsCheckboxRectangleCheckedDisabledFill = "#767676";
|
|
302
|
+
export const amsCheckboxRectangleCheckedDisabledHoverFill = "#767676";
|
|
303
|
+
export const amsCheckboxRectangleCheckedHoverFill = "#003677";
|
|
304
|
+
export const amsCheckboxRectangleCheckedHoverDisabledInvalidFill = "#767676";
|
|
305
|
+
export const amsCheckboxRectangleCheckedInvalidFill = "#ec0000";
|
|
306
|
+
export const amsCheckboxRectangleCheckedInvalidHoverFill = "#b70000";
|
|
307
|
+
export const amsCheckboxRectangleDisabledStroke = "#767676";
|
|
308
|
+
export const amsCheckboxRectangleHoverStroke = "#003677";
|
|
309
|
+
export const amsCheckboxRectangleHoverDisabledInvalidStroke = "#767676";
|
|
310
|
+
export const amsCheckboxRectangleIndeterminateFill = "#004699";
|
|
311
|
+
export const amsCheckboxRectangleIndeterminateDisabledFill = "#767676";
|
|
312
|
+
export const amsCheckboxRectangleIndeterminateDisabledHoverFill = "#767676";
|
|
313
|
+
export const amsCheckboxRectangleIndeterminateHoverFill = "#003677";
|
|
314
|
+
export const amsCheckboxRectangleIndeterminateHoverDisabledInvalidFill =
|
|
297
315
|
"#767676";
|
|
298
|
-
export const
|
|
299
|
-
|
|
300
|
-
export const
|
|
301
|
-
export const
|
|
302
|
-
export const
|
|
303
|
-
|
|
304
|
-
export const
|
|
305
|
-
export const amsCheckboxCheckmarkInvalidHoverBorderColor = "#b70000";
|
|
306
|
-
export const amsCheckboxCheckmarkInvalidIndeterminateBackgroundColor =
|
|
307
|
-
"#ec0000";
|
|
308
|
-
export const amsCheckboxCheckmarkInvalidIndeterminateHoverBackgroundColor =
|
|
309
|
-
"#b70000";
|
|
310
|
-
export const amsCheckboxCheckmarkIndeterminateBackgroundColor = "#004699";
|
|
311
|
-
export const amsCheckboxCheckmarkIndeterminateBackgroundImage =
|
|
312
|
-
"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\")";
|
|
313
|
-
export const amsCheckboxCheckmarkIndeterminateHoverBackgroundColor = "#003677";
|
|
316
|
+
export const amsCheckboxRectangleIndeterminateInvalidFill = "#ec0000";
|
|
317
|
+
export const amsCheckboxRectangleIndeterminateInvalidHoverFill = "#b70000";
|
|
318
|
+
export const amsCheckboxRectangleInvalidStroke = "#ec0000";
|
|
319
|
+
export const amsCheckboxRectangleInvalidHoverStroke = "#b70000";
|
|
320
|
+
export const amsCheckboxIconContainerBlockSize =
|
|
321
|
+
"calc(clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem) * 1.6667)";
|
|
322
|
+
export const amsCheckboxIconContainerInlineSize = "1.5rem";
|
|
314
323
|
export const amsCheckboxDisabledCursor = "not-allowed";
|
|
315
324
|
export const amsCheckboxDisabledColor = "#767676";
|
|
316
325
|
export const amsCheckboxHoverColor = "#003677";
|
|
@@ -326,14 +335,16 @@ export const amsColumnGapLarge =
|
|
|
326
335
|
export const amsColumnGapXLarge =
|
|
327
336
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
328
337
|
export const amsDateInputBackgroundColor = "#ffffff";
|
|
329
|
-
export const
|
|
338
|
+
export const amsDateInputBorderColor = "currentColor";
|
|
339
|
+
export const amsDateInputBorderStyle = "solid";
|
|
340
|
+
export const amsDateInputBorderWidth = "0.125rem";
|
|
330
341
|
export const amsDateInputColor = "#181818";
|
|
331
342
|
export const amsDateInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
332
343
|
export const amsDateInputFontSize =
|
|
333
344
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
334
345
|
export const amsDateInputFontWeight = "400";
|
|
335
346
|
export const amsDateInputLineHeight = "1.6667";
|
|
336
|
-
export const amsDateInputOutlineOffset = "0.
|
|
347
|
+
export const amsDateInputOutlineOffset = "0.25rem";
|
|
337
348
|
export const amsDateInputPaddingBlock =
|
|
338
349
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
339
350
|
export const amsDateInputPaddingInline =
|
|
@@ -341,17 +352,17 @@ export const amsDateInputPaddingInline =
|
|
|
341
352
|
export const amsDateInputCalenderPickerIndicatorBackgroundImage =
|
|
342
353
|
"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>\")";
|
|
343
354
|
export const amsDateInputCalenderPickerIndicatorCursor = "pointer";
|
|
344
|
-
export const amsDateInputDisabledBackgroundColor = "#ffffff";
|
|
345
|
-
export const amsDateInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
346
355
|
export const amsDateInputDisabledColor = "#767676";
|
|
347
356
|
export const amsDateInputDisabledCursor = "not-allowed";
|
|
348
357
|
export const amsDateInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
349
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%
|
|
350
|
-
export const amsDateInputHoverBoxShadow = "inset 0 0 0 0.
|
|
358
|
+
"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>\")";
|
|
359
|
+
export const amsDateInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
351
360
|
export const amsDateInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
352
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%
|
|
353
|
-
export const
|
|
354
|
-
export const
|
|
361
|
+
"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>\")";
|
|
362
|
+
export const amsDateInputInvalidBorderColor = "#ec0000";
|
|
363
|
+
export const amsDateInputInvalidHoverBorderColor = "#b70000";
|
|
364
|
+
export const amsDateInputInvalidHoverBoxShadow =
|
|
365
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
355
366
|
export const amsDescriptionListColor = "#181818";
|
|
356
367
|
export const amsDescriptionListColumnGap =
|
|
357
368
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
@@ -371,7 +382,9 @@ export const amsDescriptionListNarrowGridTemplateColumns = "1fr 4fr";
|
|
|
371
382
|
export const amsDescriptionListMediumGridTemplateColumns = "1fr 2fr";
|
|
372
383
|
export const amsDescriptionListWideGridTemplateColumns = "1fr 1fr";
|
|
373
384
|
export const amsDialogBackgroundColor = "#ffffff";
|
|
374
|
-
export const
|
|
385
|
+
export const amsDialogBorderColor = "#ffffff";
|
|
386
|
+
export const amsDialogBorderStyle = "solid";
|
|
387
|
+
export const amsDialogBorderWidth = "0.125rem";
|
|
375
388
|
export const amsDialogGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
376
389
|
export const amsDialogInlineSize =
|
|
377
390
|
"calc(100% - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
@@ -440,7 +453,9 @@ export const amsFigureCaptionFontWeight = "400";
|
|
|
440
453
|
export const amsFigureCaptionLineHeight = "1.5152";
|
|
441
454
|
export const amsFigureCaptionInverseColor = "#ffffff";
|
|
442
455
|
export const amsFileInputBackgroundColor = "#ffffff";
|
|
443
|
-
export const
|
|
456
|
+
export const amsFileInputBorderColor = "currentColor";
|
|
457
|
+
export const amsFileInputBorderStyle = "dashed";
|
|
458
|
+
export const amsFileInputBorderWidth = "0.125rem";
|
|
444
459
|
export const amsFileInputColor = "#181818";
|
|
445
460
|
export const amsFileInputCursor = "pointer";
|
|
446
461
|
export const amsFileInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -448,7 +463,7 @@ export const amsFileInputFontSize =
|
|
|
448
463
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
449
464
|
export const amsFileInputFontWeight = "400";
|
|
450
465
|
export const amsFileInputLineHeight = "1.6667";
|
|
451
|
-
export const amsFileInputOutlineOffset = "
|
|
466
|
+
export const amsFileInputOutlineOffset = "0.25rem";
|
|
452
467
|
export const amsFileInputPaddingBlock =
|
|
453
468
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
454
469
|
export const amsFileInputPaddingInline =
|
|
@@ -456,8 +471,9 @@ export const amsFileInputPaddingInline =
|
|
|
456
471
|
export const amsFileInputDisabledColor = "#767676";
|
|
457
472
|
export const amsFileInputDisabledCursor = "not-allowed";
|
|
458
473
|
export const amsFileInputFileSelectorButtonBackgroundColor = "#ffffff";
|
|
459
|
-
export const
|
|
460
|
-
|
|
474
|
+
export const amsFileInputFileSelectorButtonBorderColor = "currentColor";
|
|
475
|
+
export const amsFileInputFileSelectorButtonBorderStyle = "solid";
|
|
476
|
+
export const amsFileInputFileSelectorButtonBorderWidth = "0.125rem";
|
|
461
477
|
export const amsFileInputFileSelectorButtonColor = "#004699";
|
|
462
478
|
export const amsFileInputFileSelectorButtonCursor = "pointer";
|
|
463
479
|
export const amsFileInputFileSelectorButtonMarginInlineEnd =
|
|
@@ -467,14 +483,10 @@ export const amsFileInputFileSelectorButtonPaddingBlock =
|
|
|
467
483
|
export const amsFileInputFileSelectorButtonPaddingInline =
|
|
468
484
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
469
485
|
export const amsFileInputFileSelectorButtonHoverBoxShadow =
|
|
470
|
-
"inset 0 0 0 0.
|
|
486
|
+
"inset 0 0 0 0.0625rem";
|
|
471
487
|
export const amsFileInputFileSelectorButtonHoverColor = "#003677";
|
|
472
|
-
export const amsFileInputFileSelectorButtonDisabledBoxShadow =
|
|
473
|
-
"inset 0 0 0 0.125rem #767676";
|
|
474
488
|
export const amsFileInputFileSelectorButtonDisabledColor = "#767676";
|
|
475
489
|
export const amsFileInputFileSelectorButtonDisabledCursor = "not-allowed";
|
|
476
|
-
export const amsFileInputFileSelectorButtonForcedColorModeBorder =
|
|
477
|
-
"0.125rem solid";
|
|
478
490
|
export const amsFileListGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
479
491
|
export const amsFileListPaddingBlock =
|
|
480
492
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
@@ -530,10 +542,10 @@ export const amsHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
530
542
|
export const amsHeadingFontWeight = "800";
|
|
531
543
|
export const amsHeadingTextWrap = "balance";
|
|
532
544
|
export const amsHeadingInverseColor = "#ffffff";
|
|
533
|
-
export const
|
|
545
|
+
export const amsHintFontWeight = "400";
|
|
534
546
|
export const amsIconButtonColor = "#004699";
|
|
535
547
|
export const amsIconButtonCursor = "pointer";
|
|
536
|
-
export const amsIconButtonOutlineOffset = "0.
|
|
548
|
+
export const amsIconButtonOutlineOffset = "0.25rem";
|
|
537
549
|
export const amsIconButtonHoverBackgroundColor = "rgb(0 70 153 / 12.5%)";
|
|
538
550
|
export const amsIconButtonHoverColor = "#003677";
|
|
539
551
|
export const amsIconButtonDisabledColor = "#767676";
|
|
@@ -574,17 +586,17 @@ export const amsImageSliderGap =
|
|
|
574
586
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
575
587
|
export const amsImageSliderScrollerGap =
|
|
576
588
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
577
|
-
export const amsImageSliderScrollerOutlineOffset = "0.
|
|
589
|
+
export const amsImageSliderScrollerOutlineOffset = "0.25rem";
|
|
578
590
|
export const amsImageSliderThumbnailsGap =
|
|
579
591
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
580
592
|
export const amsImageSliderThumbnailsThumbnailBackgroundColor = "transparent";
|
|
581
593
|
export const amsImageSliderThumbnailsThumbnailCursor = "pointer";
|
|
582
594
|
export const amsImageSliderThumbnailsThumbnailOpacity = "40%";
|
|
583
|
-
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.
|
|
595
|
+
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.25rem";
|
|
584
596
|
export const amsImageSliderThumbnailsThumbnailInViewOpacity = "100%";
|
|
585
597
|
export const amsImageSliderThumbnailsThumbnailHoverOpacity = "100%";
|
|
586
598
|
export const amsImageAspectRatio = "16 / 9";
|
|
587
|
-
export const amsInvalidFormAlertOutlineOffset = "0.
|
|
599
|
+
export const amsInvalidFormAlertOutlineOffset = "0.25rem";
|
|
588
600
|
export const amsLabelColor = "#181818";
|
|
589
601
|
export const amsLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
590
602
|
export const amsLabelFontSize =
|
|
@@ -601,7 +613,7 @@ export const amsLinkListLinkFontWeight = "400";
|
|
|
601
613
|
export const amsLinkListLinkGap =
|
|
602
614
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
603
615
|
export const amsLinkListLinkLineHeight = "1.6667";
|
|
604
|
-
export const amsLinkListLinkOutlineOffset = "0.
|
|
616
|
+
export const amsLinkListLinkOutlineOffset = "0.25rem";
|
|
605
617
|
export const amsLinkListLinkTextDecorationLine = "none";
|
|
606
618
|
export const amsLinkListLinkTextDecorationThickness = "0.125rem";
|
|
607
619
|
export const amsLinkListLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -622,7 +634,7 @@ export const amsLinkFontFamily = "inherit";
|
|
|
622
634
|
export const amsLinkFontSize = "inherit";
|
|
623
635
|
export const amsLinkFontWeight = "400";
|
|
624
636
|
export const amsLinkLineHeight = "inherit";
|
|
625
|
-
export const amsLinkOutlineOffset = "0.
|
|
637
|
+
export const amsLinkOutlineOffset = "0.25rem";
|
|
626
638
|
export const amsLinkTextDecorationThickness = "0.125rem";
|
|
627
639
|
export const amsLinkTextUnderlineOffset = "0.3333em";
|
|
628
640
|
export const amsLinkHoverColor = "#003677";
|
|
@@ -680,7 +692,7 @@ export const amsPageFooterMenuLinkFontSize =
|
|
|
680
692
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
681
693
|
export const amsPageFooterMenuLinkFontWeight = "400";
|
|
682
694
|
export const amsPageFooterMenuLinkLineHeight = "1.5152";
|
|
683
|
-
export const amsPageFooterMenuLinkOutlineOffset = "0.
|
|
695
|
+
export const amsPageFooterMenuLinkOutlineOffset = "0.25rem";
|
|
684
696
|
export const amsPageFooterMenuLinkTextDecorationLine = "none";
|
|
685
697
|
export const amsPageFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
686
698
|
export const amsPageFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -698,11 +710,12 @@ export const amsPageHeaderWidePaddingInline =
|
|
|
698
710
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
699
711
|
export const amsPageHeaderLogoLinkColumnGap =
|
|
700
712
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
701
|
-
export const amsPageHeaderLogoLinkOutlineOffset = "0.
|
|
713
|
+
export const amsPageHeaderLogoLinkOutlineOffset = "0.25rem";
|
|
702
714
|
export const amsPageHeaderBrandNameColor = "#181818";
|
|
703
715
|
export const amsPageHeaderBrandNameFontSize =
|
|
704
716
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
705
717
|
export const amsPageHeaderBrandNameFontWeight = "800";
|
|
718
|
+
export const amsPageHeaderBrandNameLineHeight = "1.2928";
|
|
706
719
|
export const amsPageHeaderBrandNameTextWrap = "balance";
|
|
707
720
|
export const amsPageHeaderMegaMenuButtonCursor = "pointer";
|
|
708
721
|
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
@@ -719,7 +732,7 @@ export const amsPageHeaderMenuItemFontSize =
|
|
|
719
732
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
720
733
|
export const amsPageHeaderMenuItemFontWeight = "400";
|
|
721
734
|
export const amsPageHeaderMenuItemLineHeight = "1.6667";
|
|
722
|
-
export const amsPageHeaderMenuItemOutlineOffset = "0.
|
|
735
|
+
export const amsPageHeaderMenuItemOutlineOffset = "0.25rem";
|
|
723
736
|
export const amsPageHeaderMenuItemPaddingBlock =
|
|
724
737
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
725
738
|
export const amsPageHeaderMenuItemHoverColor = "#003677";
|
|
@@ -749,7 +762,7 @@ export const amsPaginationLineHeight = "1.6667";
|
|
|
749
762
|
export const amsPaginationLinkColor = "#004699";
|
|
750
763
|
export const amsPaginationLinkGap =
|
|
751
764
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
752
|
-
export const amsPaginationLinkOutlineOffset = "0.
|
|
765
|
+
export const amsPaginationLinkOutlineOffset = "0.25rem";
|
|
753
766
|
export const amsPaginationLinkPaddingInline =
|
|
754
767
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
755
768
|
export const amsPaginationLinkTextDecorationLine = "none";
|
|
@@ -772,27 +785,27 @@ export const amsParagraphLargeFontSize =
|
|
|
772
785
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
773
786
|
export const amsParagraphLargeLineHeight = "1.5152";
|
|
774
787
|
export const amsPasswordInputBackgroundColor = "#ffffff";
|
|
775
|
-
export const
|
|
788
|
+
export const amsPasswordInputBorderColor = "currentColor";
|
|
789
|
+
export const amsPasswordInputBorderStyle = "solid";
|
|
790
|
+
export const amsPasswordInputBorderWidth = "0.125rem";
|
|
776
791
|
export const amsPasswordInputColor = "#181818";
|
|
777
792
|
export const amsPasswordInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
778
793
|
export const amsPasswordInputFontSize =
|
|
779
794
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
780
795
|
export const amsPasswordInputFontWeight = "400";
|
|
781
796
|
export const amsPasswordInputLineHeight = "1.6667";
|
|
782
|
-
export const amsPasswordInputOutlineOffset = "0.
|
|
797
|
+
export const amsPasswordInputOutlineOffset = "0.25rem";
|
|
783
798
|
export const amsPasswordInputPaddingBlock =
|
|
784
799
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
785
800
|
export const amsPasswordInputPaddingInline =
|
|
786
801
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
787
|
-
export const amsPasswordInputDisabledBackgroundColor = "#ffffff";
|
|
788
|
-
export const amsPasswordInputDisabledBoxShadow =
|
|
789
|
-
"inset 0 0 0 0.0625rem #767676";
|
|
790
802
|
export const amsPasswordInputDisabledColor = "#767676";
|
|
791
803
|
export const amsPasswordInputDisabledCursor = "not-allowed";
|
|
792
|
-
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.
|
|
793
|
-
export const
|
|
804
|
+
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
805
|
+
export const amsPasswordInputInvalidBorderColor = "#ec0000";
|
|
806
|
+
export const amsPasswordInputInvalidHoverBorderColor = "#b70000";
|
|
794
807
|
export const amsPasswordInputInvalidHoverBoxShadow =
|
|
795
|
-
"inset 0 0 0 0.
|
|
808
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
796
809
|
export const amsPasswordInputPlaceholderColor = "#767676";
|
|
797
810
|
export const amsRadioColor = "#181818";
|
|
798
811
|
export const amsRadioCursor = "pointer";
|
|
@@ -802,7 +815,7 @@ export const amsRadioFontSize =
|
|
|
802
815
|
export const amsRadioFontWeight = "400";
|
|
803
816
|
export const amsRadioGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
804
817
|
export const amsRadioLineHeight = "1.6667";
|
|
805
|
-
export const amsRadioOutlineOffset = "0.
|
|
818
|
+
export const amsRadioOutlineOffset = "0.25rem";
|
|
806
819
|
export const amsRadioTextDecorationThickness = "0.125rem";
|
|
807
820
|
export const amsRadioTextUnderlineOffset = "0.3333em";
|
|
808
821
|
export const amsRadioCheckedIndicatorFill = "#004699";
|
|
@@ -812,12 +825,10 @@ export const amsRadioCheckedIndicatorDisabledInvalidHoverFill = "#767676";
|
|
|
812
825
|
export const amsRadioCheckedIndicatorHoverFill = "#003677";
|
|
813
826
|
export const amsRadioCheckedIndicatorInvalidFill = "#ec0000";
|
|
814
827
|
export const amsRadioCheckedIndicatorInvalidHoverFill = "#b70000";
|
|
815
|
-
export const amsRadioHoverIndicatorStrokeWidth = "3px";
|
|
816
828
|
export const amsRadioHoverIndicatorHoverStroke = "#003677";
|
|
817
829
|
export const amsRadioHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
818
830
|
export const amsRadioCircleFill = "#ffffff";
|
|
819
831
|
export const amsRadioCircleStroke = "#004699";
|
|
820
|
-
export const amsRadioCircleStrokeWidth = "2px";
|
|
821
832
|
export const amsRadioCircleDisabledStroke = "#767676";
|
|
822
833
|
export const amsRadioCircleDisabledInvalidStroke = "#767676";
|
|
823
834
|
export const amsRadioCircleDisabledInvalidHoverStroke = "#767676";
|
|
@@ -838,7 +849,9 @@ export const amsRowGapMedium = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
|
838
849
|
export const amsRowGapLarge = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
839
850
|
export const amsRowGapXLarge = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
840
851
|
export const amsSearchFieldInputBackgroundColor = "#ffffff";
|
|
841
|
-
export const
|
|
852
|
+
export const amsSearchFieldInputBorderColor = "currentColor";
|
|
853
|
+
export const amsSearchFieldInputBorderStyle = "solid";
|
|
854
|
+
export const amsSearchFieldInputBorderWidth = "0.125rem";
|
|
842
855
|
export const amsSearchFieldInputColor = "#181818";
|
|
843
856
|
export const amsSearchFieldInputFontFamily =
|
|
844
857
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -846,7 +859,7 @@ export const amsSearchFieldInputFontSize =
|
|
|
846
859
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
847
860
|
export const amsSearchFieldInputFontWeight = "400";
|
|
848
861
|
export const amsSearchFieldInputLineHeight = "1.6667";
|
|
849
|
-
export const amsSearchFieldInputOutlineOffset = "0.
|
|
862
|
+
export const amsSearchFieldInputOutlineOffset = "0.25rem";
|
|
850
863
|
export const amsSearchFieldInputPaddingBlock =
|
|
851
864
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
852
865
|
export const amsSearchFieldInputPaddingInline =
|
|
@@ -859,37 +872,41 @@ export const amsSearchFieldInputCancelButtonColor = "#004699";
|
|
|
859
872
|
export const amsSearchFieldInputCancelButtonCursor = "pointer";
|
|
860
873
|
export const amsSearchFieldInputCancelButtonInlineSize =
|
|
861
874
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
862
|
-
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.
|
|
863
|
-
export const
|
|
864
|
-
|
|
875
|
+
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
876
|
+
export const amsSearchFieldInputInvalidBorderColor = "#ec0000";
|
|
877
|
+
export const amsSearchFieldInputInvalidHoverBorderColor = "#b70000";
|
|
865
878
|
export const amsSearchFieldInputInvalidHoverBoxShadow =
|
|
866
|
-
"inset 0 0 0 0.
|
|
879
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
867
880
|
export const amsSearchFieldInputPlaceholderColor = "#767676";
|
|
868
881
|
export const amsSelectBackgroundColor = "#ffffff";
|
|
869
882
|
export const amsSelectBackgroundImage =
|
|
870
883
|
"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>\")";
|
|
871
884
|
export const amsSelectBackgroundPosition =
|
|
872
885
|
"right clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) center";
|
|
873
|
-
export const
|
|
886
|
+
export const amsSelectBorderColor = "currentColor";
|
|
887
|
+
export const amsSelectBorderStyle = "solid";
|
|
888
|
+
export const amsSelectBorderWidth = "0.125rem";
|
|
874
889
|
export const amsSelectColor = "#181818";
|
|
875
890
|
export const amsSelectFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
876
891
|
export const amsSelectFontSize =
|
|
877
892
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
878
893
|
export const amsSelectFontWeight = "400";
|
|
879
894
|
export const amsSelectLineHeight = "1.6667";
|
|
880
|
-
export const amsSelectOutlineOffset = "0.
|
|
895
|
+
export const amsSelectOutlineOffset = "0.25rem";
|
|
881
896
|
export const amsSelectPaddingBlock =
|
|
882
897
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
883
898
|
export const amsSelectPaddingInline =
|
|
884
899
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) calc(2 * clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) + 1em)";
|
|
885
900
|
export const amsSelectDisabledBackgroundImage =
|
|
886
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%
|
|
887
|
-
export const amsSelectDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
901
|
+
"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>\")";
|
|
888
902
|
export const amsSelectDisabledColor = "#767676";
|
|
889
903
|
export const amsSelectDisabledCursor = "not-allowed";
|
|
890
|
-
export const amsSelectHoverBoxShadow = "inset 0 0 0 0.
|
|
891
|
-
export const
|
|
892
|
-
|
|
904
|
+
export const amsSelectHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
905
|
+
export const amsSelectHoverBackgroundImage =
|
|
906
|
+
"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>\")";
|
|
907
|
+
export const amsSelectInvalidBorderColor = "#ec0000";
|
|
908
|
+
export const amsSelectInvalidHoverBorderColor = "#b70000";
|
|
909
|
+
export const amsSelectInvalidHoverBoxShadow = "inset 0 0 0 0.0625rem #b70000";
|
|
893
910
|
export const amsSelectOptionDisabledColor = "#767676";
|
|
894
911
|
export const amsSkipLinkBackgroundColor = "#004699";
|
|
895
912
|
export const amsSkipLinkColor = "#ffffff";
|
|
@@ -898,7 +915,7 @@ export const amsSkipLinkFontSize =
|
|
|
898
915
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
899
916
|
export const amsSkipLinkFontWeight = "400";
|
|
900
917
|
export const amsSkipLinkLineHeight = "1.5152";
|
|
901
|
-
export const amsSkipLinkOutlineOffset = "0.
|
|
918
|
+
export const amsSkipLinkOutlineOffset = "0.25rem";
|
|
902
919
|
export const amsSkipLinkPaddingBlock =
|
|
903
920
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
904
921
|
export const amsSkipLinkPaddingInline =
|
|
@@ -920,7 +937,7 @@ export const amsStandaloneLinkFontSize =
|
|
|
920
937
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
921
938
|
export const amsStandaloneLinkFontWeight = "400";
|
|
922
939
|
export const amsStandaloneLinkLineHeight = "1.6667";
|
|
923
|
-
export const amsStandaloneLinkOutlineOffset = "0.
|
|
940
|
+
export const amsStandaloneLinkOutlineOffset = "0.25rem";
|
|
924
941
|
export const amsStandaloneLinkTextDecorationThickness = "0.125rem";
|
|
925
942
|
export const amsStandaloneLinkTextUnderlineOffset = "0.3333em";
|
|
926
943
|
export const amsStandaloneLinkContrastColor = "#000000";
|
|
@@ -934,11 +951,11 @@ export const amsStandaloneLinkWithIconTextDecorationLine = "none";
|
|
|
934
951
|
export const amsStandaloneLinkWithIconHoverTextDecorationLine = "underline";
|
|
935
952
|
export const amsSwitchBackgroundColor = "#767676";
|
|
936
953
|
export const amsSwitchCursor = "pointer";
|
|
937
|
-
export const amsSwitchOutlineOffset = "0.
|
|
954
|
+
export const amsSwitchOutlineOffset = "0.25rem";
|
|
938
955
|
export const amsSwitchInlineSize = "3.5rem";
|
|
939
956
|
export const amsSwitchThumbBackgroundColor = "#ffffff";
|
|
940
|
-
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
941
957
|
export const amsSwitchThumbBlockSize = "1.75rem";
|
|
958
|
+
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
942
959
|
export const amsSwitchThumbHoverBoxShadow = "0 0 0 0.125rem #003677";
|
|
943
960
|
export const amsSwitchThumbHoverColor = "#003677";
|
|
944
961
|
export const amsSwitchCheckedBackgroundColor = "#004699";
|
|
@@ -953,7 +970,7 @@ export const amsTableOfContentsGap =
|
|
|
953
970
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
954
971
|
export const amsTableOfContentsLineHeight = "1.6667";
|
|
955
972
|
export const amsTableOfContentsLinkColor = "#004699";
|
|
956
|
-
export const amsTableOfContentsLinkOutlineOffset = "0.
|
|
973
|
+
export const amsTableOfContentsLinkOutlineOffset = "0.25rem";
|
|
957
974
|
export const amsTableOfContentsLinkTextDecorationLine = "none";
|
|
958
975
|
export const amsTableOfContentsLinkTextDecorationThickness = "0.125rem";
|
|
959
976
|
export const amsTableOfContentsLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -991,19 +1008,21 @@ export const amsTabsButtonFontSize =
|
|
|
991
1008
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
992
1009
|
export const amsTabsButtonFontWeight = "400";
|
|
993
1010
|
export const amsTabsButtonLineHeight = "1.6667";
|
|
994
|
-
export const amsTabsButtonOutlineOffset = "
|
|
1011
|
+
export const amsTabsButtonOutlineOffset = "calc(0.25rem * -1)";
|
|
995
1012
|
export const amsTabsButtonPaddingBlock =
|
|
996
1013
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
997
1014
|
export const amsTabsButtonPaddingInline =
|
|
998
1015
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
999
|
-
export const amsTabsButtonHoverColor = "#003677";
|
|
1000
1016
|
export const amsTabsButtonHoverBoxShadow = "inset 0 calc(0.125rem * -1)";
|
|
1017
|
+
export const amsTabsButtonHoverColor = "#003677";
|
|
1001
1018
|
export const amsTabsButtonSelectedBoxShadow = "inset 0 calc(0.25rem * -1)";
|
|
1002
1019
|
export const amsTabsButtonSelectedFontWeight = "800";
|
|
1003
1020
|
export const amsTabsButtonDisabledColor = "#767676";
|
|
1004
1021
|
export const amsTabsButtonDisabledCursor = "not-allowed";
|
|
1005
1022
|
export const amsTextAreaBackgroundColor = "#ffffff";
|
|
1006
|
-
export const
|
|
1023
|
+
export const amsTextAreaBorderColor = "currentColor";
|
|
1024
|
+
export const amsTextAreaBorderStyle = "solid";
|
|
1025
|
+
export const amsTextAreaBorderWidth = "0.125rem";
|
|
1007
1026
|
export const amsTextAreaColor = "#181818";
|
|
1008
1027
|
export const amsTextAreaFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1009
1028
|
export const amsTextAreaFontSize =
|
|
@@ -1012,49 +1031,52 @@ export const amsTextAreaFontWeight = "400";
|
|
|
1012
1031
|
export const amsTextAreaLineHeight = "1.6667";
|
|
1013
1032
|
export const amsTextAreaMinBlockSize =
|
|
1014
1033
|
"calc(1.6667 * 1em + 2 * clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem))";
|
|
1015
|
-
export const amsTextAreaOutlineOffset = "0.
|
|
1034
|
+
export const amsTextAreaOutlineOffset = "0.25rem";
|
|
1016
1035
|
export const amsTextAreaPaddingBlock =
|
|
1017
1036
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1018
1037
|
export const amsTextAreaPaddingInline =
|
|
1019
1038
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
1020
|
-
export const amsTextAreaDisabledBackgroundColor = "#ffffff";
|
|
1021
|
-
export const amsTextAreaDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1022
1039
|
export const amsTextAreaDisabledColor = "#767676";
|
|
1023
1040
|
export const amsTextAreaDisabledCursor = "not-allowed";
|
|
1024
|
-
export const amsTextAreaHoverBoxShadow = "inset 0 0 0 0.
|
|
1025
|
-
export const
|
|
1026
|
-
export const
|
|
1041
|
+
export const amsTextAreaHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1042
|
+
export const amsTextAreaInvalidBorderColor = "#ec0000";
|
|
1043
|
+
export const amsTextAreaInvalidHoverBorderColor = "#b70000";
|
|
1044
|
+
export const amsTextAreaInvalidHoverBoxShadow = "inset 0 0 0 0.0625rem #b70000";
|
|
1027
1045
|
export const amsTextAreaPlaceholderColor = "#767676";
|
|
1028
1046
|
export const amsTextInputBackgroundColor = "#ffffff";
|
|
1029
|
-
export const
|
|
1047
|
+
export const amsTextInputBorderColor = "currentColor";
|
|
1048
|
+
export const amsTextInputBorderStyle = "solid";
|
|
1049
|
+
export const amsTextInputBorderWidth = "0.125rem";
|
|
1030
1050
|
export const amsTextInputColor = "#181818";
|
|
1031
1051
|
export const amsTextInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1032
1052
|
export const amsTextInputFontSize =
|
|
1033
1053
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1034
1054
|
export const amsTextInputFontWeight = "400";
|
|
1035
1055
|
export const amsTextInputLineHeight = "1.6667";
|
|
1036
|
-
export const amsTextInputOutlineOffset = "0.
|
|
1056
|
+
export const amsTextInputOutlineOffset = "0.25rem";
|
|
1037
1057
|
export const amsTextInputPaddingBlock =
|
|
1038
1058
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1039
1059
|
export const amsTextInputPaddingInline =
|
|
1040
1060
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
1041
|
-
export const amsTextInputDisabledBackgroundColor = "#ffffff";
|
|
1042
|
-
export const amsTextInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1043
1061
|
export const amsTextInputDisabledColor = "#767676";
|
|
1044
1062
|
export const amsTextInputDisabledCursor = "not-allowed";
|
|
1045
|
-
export const amsTextInputHoverBoxShadow = "inset 0 0 0 0.
|
|
1046
|
-
export const
|
|
1047
|
-
export const
|
|
1063
|
+
export const amsTextInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1064
|
+
export const amsTextInputInvalidBorderColor = "#ec0000";
|
|
1065
|
+
export const amsTextInputInvalidHoverBorderColor = "#b70000";
|
|
1066
|
+
export const amsTextInputInvalidHoverBoxShadow =
|
|
1067
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
1048
1068
|
export const amsTextInputPlaceholderColor = "#767676";
|
|
1049
1069
|
export const amsTimeInputBackgroundColor = "#ffffff";
|
|
1050
|
-
export const
|
|
1070
|
+
export const amsTimeInputBorderColor = "currentColor";
|
|
1071
|
+
export const amsTimeInputBorderStyle = "solid";
|
|
1072
|
+
export const amsTimeInputBorderWidth = "0.125rem";
|
|
1051
1073
|
export const amsTimeInputColor = "#181818";
|
|
1052
1074
|
export const amsTimeInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1053
1075
|
export const amsTimeInputFontSize =
|
|
1054
1076
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1055
1077
|
export const amsTimeInputFontWeight = "400";
|
|
1056
1078
|
export const amsTimeInputLineHeight = "1.6667";
|
|
1057
|
-
export const amsTimeInputOutlineOffset = "0.
|
|
1079
|
+
export const amsTimeInputOutlineOffset = "0.25rem";
|
|
1058
1080
|
export const amsTimeInputPaddingBlock =
|
|
1059
1081
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1060
1082
|
export const amsTimeInputPaddingInline =
|
|
@@ -1062,17 +1084,17 @@ export const amsTimeInputPaddingInline =
|
|
|
1062
1084
|
export const amsTimeInputCalenderPickerIndicatorBackgroundImage =
|
|
1063
1085
|
"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>\")";
|
|
1064
1086
|
export const amsTimeInputCalenderPickerIndicatorCursor = "pointer";
|
|
1065
|
-
export const amsTimeInputDisabledBackgroundColor = "#ffffff";
|
|
1066
|
-
export const amsTimeInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1067
1087
|
export const amsTimeInputDisabledColor = "#767676";
|
|
1068
1088
|
export const amsTimeInputDisabledCursor = "not-allowed";
|
|
1069
1089
|
export const amsTimeInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
1070
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%
|
|
1071
|
-
export const amsTimeInputHoverBoxShadow = "inset 0 0 0 0.
|
|
1090
|
+
"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>\")";
|
|
1091
|
+
export const amsTimeInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
1072
1092
|
export const amsTimeInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
1073
|
-
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%
|
|
1074
|
-
export const
|
|
1075
|
-
export const
|
|
1093
|
+
"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>\")";
|
|
1094
|
+
export const amsTimeInputInvalidBorderColor = "#ec0000";
|
|
1095
|
+
export const amsTimeInputInvalidHoverBorderColor = "#b70000";
|
|
1096
|
+
export const amsTimeInputInvalidHoverBoxShadow =
|
|
1097
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
1076
1098
|
export const amsUnorderedListColor = "#181818";
|
|
1077
1099
|
export const amsUnorderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1078
1100
|
export const amsUnorderedListFontSize =
|