@amsterdam/design-system-tokens 0.16.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 +26 -0
- 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 +132 -105
- package/dist/index.d.ts +127 -86
- package/dist/index.json +180 -139
- package/dist/index.mjs +154 -134
- package/dist/index.scss +123 -96
- package/dist/index.theme.css +132 -105
- 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 +8 -12
- 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,34 +229,29 @@ 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 amsButtonForcedColorModeBorder = "0.125rem solid";
|
|
227
238
|
export const amsButtonPrimaryBackgroundColor = "#004699";
|
|
228
|
-
export const
|
|
239
|
+
export const amsButtonPrimaryBorderColor = "#004699";
|
|
229
240
|
export const amsButtonPrimaryColor = "#ffffff";
|
|
230
241
|
export const amsButtonPrimaryDisabledBackgroundColor = "#767676";
|
|
231
|
-
export const
|
|
242
|
+
export const amsButtonPrimaryDisabledBorderColor = "#767676";
|
|
232
243
|
export const amsButtonPrimaryHoverBackgroundColor = "#003677";
|
|
233
|
-
export const
|
|
244
|
+
export const amsButtonPrimaryHoverBorderColor = "#003677";
|
|
234
245
|
export const amsButtonSecondaryBackgroundColor = "#ffffff";
|
|
235
246
|
export const amsButtonSecondaryColor = "#004699";
|
|
236
|
-
export const
|
|
237
|
-
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.1875rem #003677";
|
|
247
|
+
export const amsButtonSecondaryHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
238
248
|
export const amsButtonSecondaryHoverColor = "#003677";
|
|
239
|
-
export const amsButtonSecondaryDisabledBackgroundColor = "#ffffff";
|
|
240
|
-
export const amsButtonSecondaryDisabledBoxShadow =
|
|
241
|
-
"inset 0 0 0 0.125rem #767676";
|
|
242
249
|
export const amsButtonSecondaryDisabledColor = "#767676";
|
|
243
250
|
export const amsButtonTertiaryBackgroundColor = "transparent";
|
|
251
|
+
export const amsButtonTertiaryBorderColor = "transparent";
|
|
244
252
|
export const amsButtonTertiaryColor = "#004699";
|
|
245
|
-
export const
|
|
253
|
+
export const amsButtonTertiaryHoverBorderColor = "currentColor";
|
|
246
254
|
export const amsButtonTertiaryHoverColor = "#003677";
|
|
247
|
-
export const amsButtonTertiaryDisabledBackgroundColor = "transparent";
|
|
248
255
|
export const amsButtonTertiaryDisabledColor = "#767676";
|
|
249
256
|
export const amsButtonIconOnlyPaddingBlock =
|
|
250
257
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
@@ -264,7 +271,7 @@ export const amsCardLinkTextDecorationThickness = "0.125rem";
|
|
|
264
271
|
export const amsCardLinkTextUnderlineOffset = "0.3333em";
|
|
265
272
|
export const amsCardLinkHoverColor = "#003677";
|
|
266
273
|
export const amsCardLinkHoverTextDecorationLine = "underline";
|
|
267
|
-
export const amsCardOutlineOffset = "0.
|
|
274
|
+
export const amsCardOutlineOffset = "0.25rem";
|
|
268
275
|
export const amsCharacterCountColor = "#181818";
|
|
269
276
|
export const amsCharacterCountFontFamily =
|
|
270
277
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -281,36 +288,36 @@ export const amsCheckboxFontSize =
|
|
|
281
288
|
export const amsCheckboxFontWeight = "400";
|
|
282
289
|
export const amsCheckboxGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
283
290
|
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
|
|
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 =
|
|
295
313
|
"#767676";
|
|
296
|
-
export const
|
|
297
|
-
|
|
298
|
-
export const
|
|
299
|
-
|
|
300
|
-
export const
|
|
301
|
-
|
|
302
|
-
export const
|
|
303
|
-
export const amsCheckboxCheckmarkInvalidCheckedBackgroundColor = "#ec0000";
|
|
304
|
-
export const amsCheckboxCheckmarkInvalidCheckedHoverBackgroundColor = "#b70000";
|
|
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";
|
|
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";
|
|
314
321
|
export const amsCheckboxDisabledCursor = "not-allowed";
|
|
315
322
|
export const amsCheckboxDisabledColor = "#767676";
|
|
316
323
|
export const amsCheckboxHoverColor = "#003677";
|
|
@@ -326,14 +333,16 @@ export const amsColumnGapLarge =
|
|
|
326
333
|
export const amsColumnGapXLarge =
|
|
327
334
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
328
335
|
export const amsDateInputBackgroundColor = "#ffffff";
|
|
329
|
-
export const
|
|
336
|
+
export const amsDateInputBorderColor = "currentColor";
|
|
337
|
+
export const amsDateInputBorderStyle = "solid";
|
|
338
|
+
export const amsDateInputBorderWidth = "0.125rem";
|
|
330
339
|
export const amsDateInputColor = "#181818";
|
|
331
340
|
export const amsDateInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
332
341
|
export const amsDateInputFontSize =
|
|
333
342
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
334
343
|
export const amsDateInputFontWeight = "400";
|
|
335
344
|
export const amsDateInputLineHeight = "1.6667";
|
|
336
|
-
export const amsDateInputOutlineOffset = "0.
|
|
345
|
+
export const amsDateInputOutlineOffset = "0.25rem";
|
|
337
346
|
export const amsDateInputPaddingBlock =
|
|
338
347
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
339
348
|
export const amsDateInputPaddingInline =
|
|
@@ -341,17 +350,17 @@ export const amsDateInputPaddingInline =
|
|
|
341
350
|
export const amsDateInputCalenderPickerIndicatorBackgroundImage =
|
|
342
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>\")";
|
|
343
352
|
export const amsDateInputCalenderPickerIndicatorCursor = "pointer";
|
|
344
|
-
export const amsDateInputDisabledBackgroundColor = "#ffffff";
|
|
345
|
-
export const amsDateInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
346
353
|
export const amsDateInputDisabledColor = "#767676";
|
|
347
354
|
export const amsDateInputDisabledCursor = "not-allowed";
|
|
348
355
|
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.
|
|
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";
|
|
351
358
|
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
|
|
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";
|
|
355
364
|
export const amsDescriptionListColor = "#181818";
|
|
356
365
|
export const amsDescriptionListColumnGap =
|
|
357
366
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
@@ -371,7 +380,9 @@ export const amsDescriptionListNarrowGridTemplateColumns = "1fr 4fr";
|
|
|
371
380
|
export const amsDescriptionListMediumGridTemplateColumns = "1fr 2fr";
|
|
372
381
|
export const amsDescriptionListWideGridTemplateColumns = "1fr 1fr";
|
|
373
382
|
export const amsDialogBackgroundColor = "#ffffff";
|
|
374
|
-
export const
|
|
383
|
+
export const amsDialogBorderColor = "#ffffff";
|
|
384
|
+
export const amsDialogBorderStyle = "solid";
|
|
385
|
+
export const amsDialogBorderWidth = "0.125rem";
|
|
375
386
|
export const amsDialogGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
376
387
|
export const amsDialogInlineSize =
|
|
377
388
|
"calc(100% - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
@@ -440,7 +451,9 @@ export const amsFigureCaptionFontWeight = "400";
|
|
|
440
451
|
export const amsFigureCaptionLineHeight = "1.5152";
|
|
441
452
|
export const amsFigureCaptionInverseColor = "#ffffff";
|
|
442
453
|
export const amsFileInputBackgroundColor = "#ffffff";
|
|
443
|
-
export const
|
|
454
|
+
export const amsFileInputBorderColor = "currentColor";
|
|
455
|
+
export const amsFileInputBorderStyle = "dashed";
|
|
456
|
+
export const amsFileInputBorderWidth = "0.125rem";
|
|
444
457
|
export const amsFileInputColor = "#181818";
|
|
445
458
|
export const amsFileInputCursor = "pointer";
|
|
446
459
|
export const amsFileInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -448,7 +461,7 @@ export const amsFileInputFontSize =
|
|
|
448
461
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
449
462
|
export const amsFileInputFontWeight = "400";
|
|
450
463
|
export const amsFileInputLineHeight = "1.6667";
|
|
451
|
-
export const amsFileInputOutlineOffset = "
|
|
464
|
+
export const amsFileInputOutlineOffset = "0.25rem";
|
|
452
465
|
export const amsFileInputPaddingBlock =
|
|
453
466
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
454
467
|
export const amsFileInputPaddingInline =
|
|
@@ -456,8 +469,9 @@ export const amsFileInputPaddingInline =
|
|
|
456
469
|
export const amsFileInputDisabledColor = "#767676";
|
|
457
470
|
export const amsFileInputDisabledCursor = "not-allowed";
|
|
458
471
|
export const amsFileInputFileSelectorButtonBackgroundColor = "#ffffff";
|
|
459
|
-
export const
|
|
460
|
-
|
|
472
|
+
export const amsFileInputFileSelectorButtonBorderColor = "currentColor";
|
|
473
|
+
export const amsFileInputFileSelectorButtonBorderStyle = "solid";
|
|
474
|
+
export const amsFileInputFileSelectorButtonBorderWidth = "0.125rem";
|
|
461
475
|
export const amsFileInputFileSelectorButtonColor = "#004699";
|
|
462
476
|
export const amsFileInputFileSelectorButtonCursor = "pointer";
|
|
463
477
|
export const amsFileInputFileSelectorButtonMarginInlineEnd =
|
|
@@ -467,14 +481,10 @@ export const amsFileInputFileSelectorButtonPaddingBlock =
|
|
|
467
481
|
export const amsFileInputFileSelectorButtonPaddingInline =
|
|
468
482
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
469
483
|
export const amsFileInputFileSelectorButtonHoverBoxShadow =
|
|
470
|
-
"inset 0 0 0 0.
|
|
484
|
+
"inset 0 0 0 0.0625rem";
|
|
471
485
|
export const amsFileInputFileSelectorButtonHoverColor = "#003677";
|
|
472
|
-
export const amsFileInputFileSelectorButtonDisabledBoxShadow =
|
|
473
|
-
"inset 0 0 0 0.125rem #767676";
|
|
474
486
|
export const amsFileInputFileSelectorButtonDisabledColor = "#767676";
|
|
475
487
|
export const amsFileInputFileSelectorButtonDisabledCursor = "not-allowed";
|
|
476
|
-
export const amsFileInputFileSelectorButtonForcedColorModeBorder =
|
|
477
|
-
"0.125rem solid";
|
|
478
488
|
export const amsFileListGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
479
489
|
export const amsFileListPaddingBlock =
|
|
480
490
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
@@ -530,10 +540,10 @@ export const amsHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
530
540
|
export const amsHeadingFontWeight = "800";
|
|
531
541
|
export const amsHeadingTextWrap = "balance";
|
|
532
542
|
export const amsHeadingInverseColor = "#ffffff";
|
|
533
|
-
export const
|
|
543
|
+
export const amsHintFontWeight = "400";
|
|
534
544
|
export const amsIconButtonColor = "#004699";
|
|
535
545
|
export const amsIconButtonCursor = "pointer";
|
|
536
|
-
export const amsIconButtonOutlineOffset = "0.
|
|
546
|
+
export const amsIconButtonOutlineOffset = "0.25rem";
|
|
537
547
|
export const amsIconButtonHoverBackgroundColor = "rgb(0 70 153 / 12.5%)";
|
|
538
548
|
export const amsIconButtonHoverColor = "#003677";
|
|
539
549
|
export const amsIconButtonDisabledColor = "#767676";
|
|
@@ -574,17 +584,17 @@ export const amsImageSliderGap =
|
|
|
574
584
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
575
585
|
export const amsImageSliderScrollerGap =
|
|
576
586
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
577
|
-
export const amsImageSliderScrollerOutlineOffset = "0.
|
|
587
|
+
export const amsImageSliderScrollerOutlineOffset = "0.25rem";
|
|
578
588
|
export const amsImageSliderThumbnailsGap =
|
|
579
589
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
580
590
|
export const amsImageSliderThumbnailsThumbnailBackgroundColor = "transparent";
|
|
581
591
|
export const amsImageSliderThumbnailsThumbnailCursor = "pointer";
|
|
582
592
|
export const amsImageSliderThumbnailsThumbnailOpacity = "40%";
|
|
583
|
-
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.
|
|
593
|
+
export const amsImageSliderThumbnailsThumbnailOutlineOffset = "0.25rem";
|
|
584
594
|
export const amsImageSliderThumbnailsThumbnailInViewOpacity = "100%";
|
|
585
595
|
export const amsImageSliderThumbnailsThumbnailHoverOpacity = "100%";
|
|
586
596
|
export const amsImageAspectRatio = "16 / 9";
|
|
587
|
-
export const amsInvalidFormAlertOutlineOffset = "0.
|
|
597
|
+
export const amsInvalidFormAlertOutlineOffset = "0.25rem";
|
|
588
598
|
export const amsLabelColor = "#181818";
|
|
589
599
|
export const amsLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
590
600
|
export const amsLabelFontSize =
|
|
@@ -601,7 +611,7 @@ export const amsLinkListLinkFontWeight = "400";
|
|
|
601
611
|
export const amsLinkListLinkGap =
|
|
602
612
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
603
613
|
export const amsLinkListLinkLineHeight = "1.6667";
|
|
604
|
-
export const amsLinkListLinkOutlineOffset = "0.
|
|
614
|
+
export const amsLinkListLinkOutlineOffset = "0.25rem";
|
|
605
615
|
export const amsLinkListLinkTextDecorationLine = "none";
|
|
606
616
|
export const amsLinkListLinkTextDecorationThickness = "0.125rem";
|
|
607
617
|
export const amsLinkListLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -622,7 +632,7 @@ export const amsLinkFontFamily = "inherit";
|
|
|
622
632
|
export const amsLinkFontSize = "inherit";
|
|
623
633
|
export const amsLinkFontWeight = "400";
|
|
624
634
|
export const amsLinkLineHeight = "inherit";
|
|
625
|
-
export const amsLinkOutlineOffset = "0.
|
|
635
|
+
export const amsLinkOutlineOffset = "0.25rem";
|
|
626
636
|
export const amsLinkTextDecorationThickness = "0.125rem";
|
|
627
637
|
export const amsLinkTextUnderlineOffset = "0.3333em";
|
|
628
638
|
export const amsLinkHoverColor = "#003677";
|
|
@@ -680,7 +690,7 @@ export const amsPageFooterMenuLinkFontSize =
|
|
|
680
690
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
681
691
|
export const amsPageFooterMenuLinkFontWeight = "400";
|
|
682
692
|
export const amsPageFooterMenuLinkLineHeight = "1.5152";
|
|
683
|
-
export const amsPageFooterMenuLinkOutlineOffset = "0.
|
|
693
|
+
export const amsPageFooterMenuLinkOutlineOffset = "0.25rem";
|
|
684
694
|
export const amsPageFooterMenuLinkTextDecorationLine = "none";
|
|
685
695
|
export const amsPageFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
686
696
|
export const amsPageFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -698,11 +708,12 @@ export const amsPageHeaderWidePaddingInline =
|
|
|
698
708
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
699
709
|
export const amsPageHeaderLogoLinkColumnGap =
|
|
700
710
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
701
|
-
export const amsPageHeaderLogoLinkOutlineOffset = "0.
|
|
711
|
+
export const amsPageHeaderLogoLinkOutlineOffset = "0.25rem";
|
|
702
712
|
export const amsPageHeaderBrandNameColor = "#181818";
|
|
703
713
|
export const amsPageHeaderBrandNameFontSize =
|
|
704
714
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
705
715
|
export const amsPageHeaderBrandNameFontWeight = "800";
|
|
716
|
+
export const amsPageHeaderBrandNameLineHeight = "1.2928";
|
|
706
717
|
export const amsPageHeaderBrandNameTextWrap = "balance";
|
|
707
718
|
export const amsPageHeaderMegaMenuButtonCursor = "pointer";
|
|
708
719
|
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
@@ -719,7 +730,7 @@ export const amsPageHeaderMenuItemFontSize =
|
|
|
719
730
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
720
731
|
export const amsPageHeaderMenuItemFontWeight = "400";
|
|
721
732
|
export const amsPageHeaderMenuItemLineHeight = "1.6667";
|
|
722
|
-
export const amsPageHeaderMenuItemOutlineOffset = "0.
|
|
733
|
+
export const amsPageHeaderMenuItemOutlineOffset = "0.25rem";
|
|
723
734
|
export const amsPageHeaderMenuItemPaddingBlock =
|
|
724
735
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
725
736
|
export const amsPageHeaderMenuItemHoverColor = "#003677";
|
|
@@ -749,7 +760,7 @@ export const amsPaginationLineHeight = "1.6667";
|
|
|
749
760
|
export const amsPaginationLinkColor = "#004699";
|
|
750
761
|
export const amsPaginationLinkGap =
|
|
751
762
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
752
|
-
export const amsPaginationLinkOutlineOffset = "0.
|
|
763
|
+
export const amsPaginationLinkOutlineOffset = "0.25rem";
|
|
753
764
|
export const amsPaginationLinkPaddingInline =
|
|
754
765
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
755
766
|
export const amsPaginationLinkTextDecorationLine = "none";
|
|
@@ -772,27 +783,27 @@ export const amsParagraphLargeFontSize =
|
|
|
772
783
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
773
784
|
export const amsParagraphLargeLineHeight = "1.5152";
|
|
774
785
|
export const amsPasswordInputBackgroundColor = "#ffffff";
|
|
775
|
-
export const
|
|
786
|
+
export const amsPasswordInputBorderColor = "currentColor";
|
|
787
|
+
export const amsPasswordInputBorderStyle = "solid";
|
|
788
|
+
export const amsPasswordInputBorderWidth = "0.125rem";
|
|
776
789
|
export const amsPasswordInputColor = "#181818";
|
|
777
790
|
export const amsPasswordInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
778
791
|
export const amsPasswordInputFontSize =
|
|
779
792
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
780
793
|
export const amsPasswordInputFontWeight = "400";
|
|
781
794
|
export const amsPasswordInputLineHeight = "1.6667";
|
|
782
|
-
export const amsPasswordInputOutlineOffset = "0.
|
|
795
|
+
export const amsPasswordInputOutlineOffset = "0.25rem";
|
|
783
796
|
export const amsPasswordInputPaddingBlock =
|
|
784
797
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
785
798
|
export const amsPasswordInputPaddingInline =
|
|
786
799
|
"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
800
|
export const amsPasswordInputDisabledColor = "#767676";
|
|
791
801
|
export const amsPasswordInputDisabledCursor = "not-allowed";
|
|
792
|
-
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.
|
|
793
|
-
export const
|
|
802
|
+
export const amsPasswordInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
803
|
+
export const amsPasswordInputInvalidBorderColor = "#ec0000";
|
|
804
|
+
export const amsPasswordInputInvalidHoverBorderColor = "#b70000";
|
|
794
805
|
export const amsPasswordInputInvalidHoverBoxShadow =
|
|
795
|
-
"inset 0 0 0 0.
|
|
806
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
796
807
|
export const amsPasswordInputPlaceholderColor = "#767676";
|
|
797
808
|
export const amsRadioColor = "#181818";
|
|
798
809
|
export const amsRadioCursor = "pointer";
|
|
@@ -802,7 +813,7 @@ export const amsRadioFontSize =
|
|
|
802
813
|
export const amsRadioFontWeight = "400";
|
|
803
814
|
export const amsRadioGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
804
815
|
export const amsRadioLineHeight = "1.6667";
|
|
805
|
-
export const amsRadioOutlineOffset = "0.
|
|
816
|
+
export const amsRadioOutlineOffset = "0.25rem";
|
|
806
817
|
export const amsRadioTextDecorationThickness = "0.125rem";
|
|
807
818
|
export const amsRadioTextUnderlineOffset = "0.3333em";
|
|
808
819
|
export const amsRadioCheckedIndicatorFill = "#004699";
|
|
@@ -812,12 +823,10 @@ export const amsRadioCheckedIndicatorDisabledInvalidHoverFill = "#767676";
|
|
|
812
823
|
export const amsRadioCheckedIndicatorHoverFill = "#003677";
|
|
813
824
|
export const amsRadioCheckedIndicatorInvalidFill = "#ec0000";
|
|
814
825
|
export const amsRadioCheckedIndicatorInvalidHoverFill = "#b70000";
|
|
815
|
-
export const amsRadioHoverIndicatorStrokeWidth = "3px";
|
|
816
826
|
export const amsRadioHoverIndicatorHoverStroke = "#003677";
|
|
817
827
|
export const amsRadioHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
818
828
|
export const amsRadioCircleFill = "#ffffff";
|
|
819
829
|
export const amsRadioCircleStroke = "#004699";
|
|
820
|
-
export const amsRadioCircleStrokeWidth = "2px";
|
|
821
830
|
export const amsRadioCircleDisabledStroke = "#767676";
|
|
822
831
|
export const amsRadioCircleDisabledInvalidStroke = "#767676";
|
|
823
832
|
export const amsRadioCircleDisabledInvalidHoverStroke = "#767676";
|
|
@@ -838,7 +847,9 @@ export const amsRowGapMedium = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
|
838
847
|
export const amsRowGapLarge = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
839
848
|
export const amsRowGapXLarge = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
840
849
|
export const amsSearchFieldInputBackgroundColor = "#ffffff";
|
|
841
|
-
export const
|
|
850
|
+
export const amsSearchFieldInputBorderColor = "currentColor";
|
|
851
|
+
export const amsSearchFieldInputBorderStyle = "solid";
|
|
852
|
+
export const amsSearchFieldInputBorderWidth = "0.125rem";
|
|
842
853
|
export const amsSearchFieldInputColor = "#181818";
|
|
843
854
|
export const amsSearchFieldInputFontFamily =
|
|
844
855
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -846,7 +857,7 @@ export const amsSearchFieldInputFontSize =
|
|
|
846
857
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
847
858
|
export const amsSearchFieldInputFontWeight = "400";
|
|
848
859
|
export const amsSearchFieldInputLineHeight = "1.6667";
|
|
849
|
-
export const amsSearchFieldInputOutlineOffset = "0.
|
|
860
|
+
export const amsSearchFieldInputOutlineOffset = "0.25rem";
|
|
850
861
|
export const amsSearchFieldInputPaddingBlock =
|
|
851
862
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
852
863
|
export const amsSearchFieldInputPaddingInline =
|
|
@@ -859,37 +870,41 @@ export const amsSearchFieldInputCancelButtonColor = "#004699";
|
|
|
859
870
|
export const amsSearchFieldInputCancelButtonCursor = "pointer";
|
|
860
871
|
export const amsSearchFieldInputCancelButtonInlineSize =
|
|
861
872
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
862
|
-
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.
|
|
863
|
-
export const
|
|
864
|
-
|
|
873
|
+
export const amsSearchFieldInputHoverBoxShadow = "inset 0 0 0 0.0625rem";
|
|
874
|
+
export const amsSearchFieldInputInvalidBorderColor = "#ec0000";
|
|
875
|
+
export const amsSearchFieldInputInvalidHoverBorderColor = "#b70000";
|
|
865
876
|
export const amsSearchFieldInputInvalidHoverBoxShadow =
|
|
866
|
-
"inset 0 0 0 0.
|
|
877
|
+
"inset 0 0 0 0.0625rem #b70000";
|
|
867
878
|
export const amsSearchFieldInputPlaceholderColor = "#767676";
|
|
868
879
|
export const amsSelectBackgroundColor = "#ffffff";
|
|
869
880
|
export const amsSelectBackgroundImage =
|
|
870
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>\")";
|
|
871
882
|
export const amsSelectBackgroundPosition =
|
|
872
883
|
"right clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) center";
|
|
873
|
-
export const
|
|
884
|
+
export const amsSelectBorderColor = "currentColor";
|
|
885
|
+
export const amsSelectBorderStyle = "solid";
|
|
886
|
+
export const amsSelectBorderWidth = "0.125rem";
|
|
874
887
|
export const amsSelectColor = "#181818";
|
|
875
888
|
export const amsSelectFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
876
889
|
export const amsSelectFontSize =
|
|
877
890
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
878
891
|
export const amsSelectFontWeight = "400";
|
|
879
892
|
export const amsSelectLineHeight = "1.6667";
|
|
880
|
-
export const amsSelectOutlineOffset = "0.
|
|
893
|
+
export const amsSelectOutlineOffset = "0.25rem";
|
|
881
894
|
export const amsSelectPaddingBlock =
|
|
882
895
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
883
896
|
export const amsSelectPaddingInline =
|
|
884
897
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) calc(2 * clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) + 1em)";
|
|
885
898
|
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";
|
|
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>\")";
|
|
888
900
|
export const amsSelectDisabledColor = "#767676";
|
|
889
901
|
export const amsSelectDisabledCursor = "not-allowed";
|
|
890
|
-
export const amsSelectHoverBoxShadow = "inset 0 0 0 0.
|
|
891
|
-
export const
|
|
892
|
-
|
|
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";
|
|
893
908
|
export const amsSelectOptionDisabledColor = "#767676";
|
|
894
909
|
export const amsSkipLinkBackgroundColor = "#004699";
|
|
895
910
|
export const amsSkipLinkColor = "#ffffff";
|
|
@@ -898,7 +913,7 @@ export const amsSkipLinkFontSize =
|
|
|
898
913
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
899
914
|
export const amsSkipLinkFontWeight = "400";
|
|
900
915
|
export const amsSkipLinkLineHeight = "1.5152";
|
|
901
|
-
export const amsSkipLinkOutlineOffset = "0.
|
|
916
|
+
export const amsSkipLinkOutlineOffset = "0.25rem";
|
|
902
917
|
export const amsSkipLinkPaddingBlock =
|
|
903
918
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
904
919
|
export const amsSkipLinkPaddingInline =
|
|
@@ -920,7 +935,7 @@ export const amsStandaloneLinkFontSize =
|
|
|
920
935
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
921
936
|
export const amsStandaloneLinkFontWeight = "400";
|
|
922
937
|
export const amsStandaloneLinkLineHeight = "1.6667";
|
|
923
|
-
export const amsStandaloneLinkOutlineOffset = "0.
|
|
938
|
+
export const amsStandaloneLinkOutlineOffset = "0.25rem";
|
|
924
939
|
export const amsStandaloneLinkTextDecorationThickness = "0.125rem";
|
|
925
940
|
export const amsStandaloneLinkTextUnderlineOffset = "0.3333em";
|
|
926
941
|
export const amsStandaloneLinkContrastColor = "#000000";
|
|
@@ -934,11 +949,11 @@ export const amsStandaloneLinkWithIconTextDecorationLine = "none";
|
|
|
934
949
|
export const amsStandaloneLinkWithIconHoverTextDecorationLine = "underline";
|
|
935
950
|
export const amsSwitchBackgroundColor = "#767676";
|
|
936
951
|
export const amsSwitchCursor = "pointer";
|
|
937
|
-
export const amsSwitchOutlineOffset = "0.
|
|
952
|
+
export const amsSwitchOutlineOffset = "0.25rem";
|
|
938
953
|
export const amsSwitchInlineSize = "3.5rem";
|
|
939
954
|
export const amsSwitchThumbBackgroundColor = "#ffffff";
|
|
940
|
-
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
941
955
|
export const amsSwitchThumbBlockSize = "1.75rem";
|
|
956
|
+
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
942
957
|
export const amsSwitchThumbHoverBoxShadow = "0 0 0 0.125rem #003677";
|
|
943
958
|
export const amsSwitchThumbHoverColor = "#003677";
|
|
944
959
|
export const amsSwitchCheckedBackgroundColor = "#004699";
|
|
@@ -953,7 +968,7 @@ export const amsTableOfContentsGap =
|
|
|
953
968
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
954
969
|
export const amsTableOfContentsLineHeight = "1.6667";
|
|
955
970
|
export const amsTableOfContentsLinkColor = "#004699";
|
|
956
|
-
export const amsTableOfContentsLinkOutlineOffset = "0.
|
|
971
|
+
export const amsTableOfContentsLinkOutlineOffset = "0.25rem";
|
|
957
972
|
export const amsTableOfContentsLinkTextDecorationLine = "none";
|
|
958
973
|
export const amsTableOfContentsLinkTextDecorationThickness = "0.125rem";
|
|
959
974
|
export const amsTableOfContentsLinkTextUnderlineOffset = "0.3333em";
|
|
@@ -991,19 +1006,21 @@ export const amsTabsButtonFontSize =
|
|
|
991
1006
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
992
1007
|
export const amsTabsButtonFontWeight = "400";
|
|
993
1008
|
export const amsTabsButtonLineHeight = "1.6667";
|
|
994
|
-
export const amsTabsButtonOutlineOffset = "
|
|
1009
|
+
export const amsTabsButtonOutlineOffset = "calc(0.25rem * -1)";
|
|
995
1010
|
export const amsTabsButtonPaddingBlock =
|
|
996
1011
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
997
1012
|
export const amsTabsButtonPaddingInline =
|
|
998
1013
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
999
|
-
export const amsTabsButtonHoverColor = "#003677";
|
|
1000
1014
|
export const amsTabsButtonHoverBoxShadow = "inset 0 calc(0.125rem * -1)";
|
|
1015
|
+
export const amsTabsButtonHoverColor = "#003677";
|
|
1001
1016
|
export const amsTabsButtonSelectedBoxShadow = "inset 0 calc(0.25rem * -1)";
|
|
1002
1017
|
export const amsTabsButtonSelectedFontWeight = "800";
|
|
1003
1018
|
export const amsTabsButtonDisabledColor = "#767676";
|
|
1004
1019
|
export const amsTabsButtonDisabledCursor = "not-allowed";
|
|
1005
1020
|
export const amsTextAreaBackgroundColor = "#ffffff";
|
|
1006
|
-
export const
|
|
1021
|
+
export const amsTextAreaBorderColor = "currentColor";
|
|
1022
|
+
export const amsTextAreaBorderStyle = "solid";
|
|
1023
|
+
export const amsTextAreaBorderWidth = "0.125rem";
|
|
1007
1024
|
export const amsTextAreaColor = "#181818";
|
|
1008
1025
|
export const amsTextAreaFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1009
1026
|
export const amsTextAreaFontSize =
|
|
@@ -1012,49 +1029,52 @@ export const amsTextAreaFontWeight = "400";
|
|
|
1012
1029
|
export const amsTextAreaLineHeight = "1.6667";
|
|
1013
1030
|
export const amsTextAreaMinBlockSize =
|
|
1014
1031
|
"calc(1.6667 * 1em + 2 * clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem))";
|
|
1015
|
-
export const amsTextAreaOutlineOffset = "0.
|
|
1032
|
+
export const amsTextAreaOutlineOffset = "0.25rem";
|
|
1016
1033
|
export const amsTextAreaPaddingBlock =
|
|
1017
1034
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1018
1035
|
export const amsTextAreaPaddingInline =
|
|
1019
1036
|
"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
1037
|
export const amsTextAreaDisabledColor = "#767676";
|
|
1023
1038
|
export const amsTextAreaDisabledCursor = "not-allowed";
|
|
1024
|
-
export const amsTextAreaHoverBoxShadow = "inset 0 0 0 0.
|
|
1025
|
-
export const
|
|
1026
|
-
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";
|
|
1027
1043
|
export const amsTextAreaPlaceholderColor = "#767676";
|
|
1028
1044
|
export const amsTextInputBackgroundColor = "#ffffff";
|
|
1029
|
-
export const
|
|
1045
|
+
export const amsTextInputBorderColor = "currentColor";
|
|
1046
|
+
export const amsTextInputBorderStyle = "solid";
|
|
1047
|
+
export const amsTextInputBorderWidth = "0.125rem";
|
|
1030
1048
|
export const amsTextInputColor = "#181818";
|
|
1031
1049
|
export const amsTextInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1032
1050
|
export const amsTextInputFontSize =
|
|
1033
1051
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1034
1052
|
export const amsTextInputFontWeight = "400";
|
|
1035
1053
|
export const amsTextInputLineHeight = "1.6667";
|
|
1036
|
-
export const amsTextInputOutlineOffset = "0.
|
|
1054
|
+
export const amsTextInputOutlineOffset = "0.25rem";
|
|
1037
1055
|
export const amsTextInputPaddingBlock =
|
|
1038
1056
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1039
1057
|
export const amsTextInputPaddingInline =
|
|
1040
1058
|
"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
1059
|
export const amsTextInputDisabledColor = "#767676";
|
|
1044
1060
|
export const amsTextInputDisabledCursor = "not-allowed";
|
|
1045
|
-
export const amsTextInputHoverBoxShadow = "inset 0 0 0 0.
|
|
1046
|
-
export const
|
|
1047
|
-
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";
|
|
1048
1066
|
export const amsTextInputPlaceholderColor = "#767676";
|
|
1049
1067
|
export const amsTimeInputBackgroundColor = "#ffffff";
|
|
1050
|
-
export const
|
|
1068
|
+
export const amsTimeInputBorderColor = "currentColor";
|
|
1069
|
+
export const amsTimeInputBorderStyle = "solid";
|
|
1070
|
+
export const amsTimeInputBorderWidth = "0.125rem";
|
|
1051
1071
|
export const amsTimeInputColor = "#181818";
|
|
1052
1072
|
export const amsTimeInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1053
1073
|
export const amsTimeInputFontSize =
|
|
1054
1074
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
1055
1075
|
export const amsTimeInputFontWeight = "400";
|
|
1056
1076
|
export const amsTimeInputLineHeight = "1.6667";
|
|
1057
|
-
export const amsTimeInputOutlineOffset = "0.
|
|
1077
|
+
export const amsTimeInputOutlineOffset = "0.25rem";
|
|
1058
1078
|
export const amsTimeInputPaddingBlock =
|
|
1059
1079
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1060
1080
|
export const amsTimeInputPaddingInline =
|
|
@@ -1062,17 +1082,17 @@ export const amsTimeInputPaddingInline =
|
|
|
1062
1082
|
export const amsTimeInputCalenderPickerIndicatorBackgroundImage =
|
|
1063
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>\")";
|
|
1064
1084
|
export const amsTimeInputCalenderPickerIndicatorCursor = "pointer";
|
|
1065
|
-
export const amsTimeInputDisabledBackgroundColor = "#ffffff";
|
|
1066
|
-
export const amsTimeInputDisabledBoxShadow = "inset 0 0 0 0.0625rem #767676";
|
|
1067
1085
|
export const amsTimeInputDisabledColor = "#767676";
|
|
1068
1086
|
export const amsTimeInputDisabledCursor = "not-allowed";
|
|
1069
1087
|
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.
|
|
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";
|
|
1072
1090
|
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
|
|
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 =
|