@amsterdam/design-system-tokens 0.15.0 → 0.16.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 +35 -0
- package/LICENSE.md +2 -2
- package/README.md +4 -4
- package/dist/index.css +108 -113
- package/dist/index.d.ts +165 -164
- package/dist/index.json +185 -184
- package/dist/index.mjs +143 -143
- package/dist/index.scss +108 -113
- package/dist/index.theme.css +108 -113
- package/package.json +2 -2
- package/src/brand/ams/typography.tokens.json +1 -0
- package/src/components/ams/accordion.tokens.json +1 -0
- package/src/components/ams/alert.tokens.json +1 -1
- package/src/components/ams/avatar.tokens.json +1 -1
- package/src/components/ams/badge.tokens.json +1 -1
- package/src/components/ams/card.tokens.json +8 -2
- package/src/components/ams/dialog.tokens.json +22 -7
- package/src/components/ams/field-set.tokens.json +2 -1
- package/src/components/ams/grid.tokens.json +6 -6
- package/src/components/ams/heading.tokens.json +1 -0
- package/src/components/ams/label.tokens.json +2 -1
- package/src/components/ams/link.tokens.json +8 -27
- package/src/components/ams/{footer.tokens.json → page-footer.tokens.json} +7 -1
- package/src/components/ams/{header.tokens.json → page-header.tokens.json} +9 -2
- package/src/components/ams/page-heading.tokens.json +1 -0
- package/src/components/ams/page.tokens.json +8 -0
- package/src/components/ams/standalone-link.tokens.json +40 -0
- package/src/components/ams/mega-menu.tokens.json +0 -18
- package/src/components/ams/page-menu.tokens.json +0 -24
- package/src/components/ams/screen.tokens.json +0 -13
- package/src/components/ams/top-task-link.tokens.json +0 -29
package/dist/index.mjs
CHANGED
|
@@ -83,6 +83,7 @@ export const amsTypographyHeading_6FontSize =
|
|
|
83
83
|
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
84
84
|
export const amsTypographyHeading_6LineHeight = "1.3776";
|
|
85
85
|
export const amsTypographyHeadingFontWeight = "800";
|
|
86
|
+
export const amsTypographyHeadingTextWrap = "balance";
|
|
86
87
|
export const amsLinksColor = "#004699";
|
|
87
88
|
export const amsLinksTextDecorationThickness = "0.125rem";
|
|
88
89
|
export const amsLinksTextUnderlineOffset = "0.3333em";
|
|
@@ -110,6 +111,7 @@ export const amsAccordionButtonOutlineOffset = "0.125rem";
|
|
|
110
111
|
export const amsAccordionButtonPaddingBlock =
|
|
111
112
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
112
113
|
export const amsAccordionButtonPaddingInline = "0";
|
|
114
|
+
export const amsAccordionButtonTextWrap = "balance";
|
|
113
115
|
export const amsAccordionButtonHoverColor = "#003677";
|
|
114
116
|
export const amsAccordionPanelPaddingBlock = "0";
|
|
115
117
|
export const amsAccordionPanelPaddingInline = "0";
|
|
@@ -122,7 +124,7 @@ export const amsAlertSeverityIndicatorBackgroundColor = "#009de6";
|
|
|
122
124
|
export const amsAlertSeverityIndicatorPaddingBlock =
|
|
123
125
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
124
126
|
export const amsAlertSeverityIndicatorPaddingInline =
|
|
125
|
-
"clamp(0.
|
|
127
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
126
128
|
export const amsAlertContentGap =
|
|
127
129
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
128
130
|
export const amsAlertContentPaddingBlock =
|
|
@@ -149,7 +151,7 @@ export const amsAvatarPaddingInline =
|
|
|
149
151
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
150
152
|
export const amsAvatarForcedColorsBorderWidth = "0.125rem";
|
|
151
153
|
export const amsAvatarAzureBackgroundColor = "#009de6";
|
|
152
|
-
export const amsAvatarAzureColor = "#
|
|
154
|
+
export const amsAvatarAzureColor = "#ffffff";
|
|
153
155
|
export const amsAvatarGreenBackgroundColor = "#00a03c";
|
|
154
156
|
export const amsAvatarGreenColor = "#ffffff";
|
|
155
157
|
export const amsAvatarLimeBackgroundColor = "#bed200";
|
|
@@ -170,7 +172,7 @@ export const amsBadgeLineHeight = "1.6667";
|
|
|
170
172
|
export const amsBadgePaddingInline =
|
|
171
173
|
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
172
174
|
export const amsBadgeAzureBackgroundColor = "#009de6";
|
|
173
|
-
export const amsBadgeAzureColor = "#
|
|
175
|
+
export const amsBadgeAzureColor = "#ffffff";
|
|
174
176
|
export const amsBadgeLimeBackgroundColor = "#bed200";
|
|
175
177
|
export const amsBadgeLimeColor = "#181818";
|
|
176
178
|
export const amsBadgeMagentaBackgroundColor = "#e50082";
|
|
@@ -248,8 +250,13 @@ export const amsButtonIconOnlyPaddingBlock =
|
|
|
248
250
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
249
251
|
export const amsButtonIconOnlyPaddingInline =
|
|
250
252
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
251
|
-
export const
|
|
253
|
+
export const amsCardHeadingMarginBlockEnd =
|
|
254
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
252
255
|
export const amsCardHeadingGroupGap =
|
|
256
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
257
|
+
export const amsCardHeadingGroupMarginBlockEnd =
|
|
258
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
259
|
+
export const amsCardImageMarginBlockEnd =
|
|
253
260
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
254
261
|
export const amsCardLinkColor = "#004699";
|
|
255
262
|
export const amsCardLinkTextDecorationLine = "none";
|
|
@@ -367,24 +374,38 @@ export const amsDialogBackgroundColor = "#ffffff";
|
|
|
367
374
|
export const amsDialogBorder = "0.125rem solid #ffffff";
|
|
368
375
|
export const amsDialogGap = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
369
376
|
export const amsDialogInlineSize =
|
|
370
|
-
"calc(100% - 2 * clamp(
|
|
377
|
+
"calc(100% - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
371
378
|
export const amsDialogMaxBlockSize =
|
|
372
|
-
"calc(100dvh - 2 * clamp(
|
|
379
|
+
"calc(100dvh - 2 * clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem))";
|
|
373
380
|
export const amsDialogMaxInlineSize = "48rem";
|
|
381
|
+
export const amsDialogMediumInlineSize =
|
|
382
|
+
"calc(100% - 2 * clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem))";
|
|
383
|
+
export const amsDialogMediumMaxBlockSize =
|
|
384
|
+
"calc(100dvh - 2 * clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem))";
|
|
374
385
|
export const amsDialogBackdropBackgroundColor = "rgb(24 24 24 / 62.5%)";
|
|
375
386
|
export const amsDialogHeaderGap =
|
|
376
387
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
377
388
|
export const amsDialogHeaderPaddingBlock =
|
|
378
|
-
"clamp(
|
|
389
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem) 0";
|
|
379
390
|
export const amsDialogHeaderPaddingInline =
|
|
380
|
-
"clamp(
|
|
391
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
392
|
+
export const amsDialogHeaderMediumPaddingBlock =
|
|
393
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem) 0";
|
|
394
|
+
export const amsDialogHeaderMediumPaddingInline =
|
|
395
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
381
396
|
export const amsDialogBodyPaddingBlock = "0";
|
|
382
397
|
export const amsDialogBodyPaddingInline =
|
|
383
|
-
"clamp(
|
|
398
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
399
|
+
export const amsDialogBodyMediumPaddingInline =
|
|
400
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
384
401
|
export const amsDialogFooterPaddingBlock =
|
|
385
|
-
"0 clamp(
|
|
402
|
+
"0 clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
386
403
|
export const amsDialogFooterPaddingInline =
|
|
387
|
-
"clamp(
|
|
404
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
405
|
+
export const amsDialogFooterMediumPaddingBlock =
|
|
406
|
+
"0 clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
407
|
+
export const amsDialogFooterMediumPaddingInline =
|
|
408
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
388
409
|
export const amsErrorMessageColor = "#ec0000";
|
|
389
410
|
export const amsErrorMessageFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
390
411
|
export const amsErrorMessageFontSize =
|
|
@@ -405,6 +426,7 @@ export const amsFieldSetLegendFontWeight = "800";
|
|
|
405
426
|
export const amsFieldSetLegendLineHeight = "1.2928";
|
|
406
427
|
export const amsFieldSetLegendMarginBlockEnd =
|
|
407
428
|
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
429
|
+
export const amsFieldSetLegendTextWrap = "balance";
|
|
408
430
|
export const amsFieldGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
409
431
|
export const amsFieldInvalidBorderInlineStart = "0.1875rem solid #ec0000";
|
|
410
432
|
export const amsFieldInvalidPaddingInlineStart =
|
|
@@ -465,86 +487,26 @@ export const amsFileListFileGap =
|
|
|
465
487
|
export const amsFileListFileLineHeight = "1.5152";
|
|
466
488
|
export const amsFileListFileDetailsColor = "#767676";
|
|
467
489
|
export const amsFileListFilePreviewWidth = "clamp(2.5rem, 10vw, 5rem)";
|
|
468
|
-
export const amsFooterMenuColumnGap =
|
|
469
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
470
|
-
export const amsFooterMenuPaddingBlock =
|
|
471
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
472
|
-
export const amsFooterMenuPaddingInline =
|
|
473
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
474
|
-
export const amsFooterMenuRowGap =
|
|
475
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
476
|
-
export const amsFooterMenuLinkColor = "#004699";
|
|
477
|
-
export const amsFooterMenuLinkFontFamily =
|
|
478
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
479
|
-
export const amsFooterMenuLinkFontSize =
|
|
480
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
481
|
-
export const amsFooterMenuLinkFontWeight = "400";
|
|
482
|
-
export const amsFooterMenuLinkLineHeight = "1.5152";
|
|
483
|
-
export const amsFooterMenuLinkOutlineOffset = "0.125rem";
|
|
484
|
-
export const amsFooterMenuLinkTextDecorationLine = "none";
|
|
485
|
-
export const amsFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
486
|
-
export const amsFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
487
|
-
export const amsFooterMenuLinkHoverColor = "#003677";
|
|
488
|
-
export const amsFooterMenuLinkHoverTextDecorationLine = "underline";
|
|
489
|
-
export const amsFooterSpotlightBackgroundColor = "#004699";
|
|
490
490
|
export const amsGridColumnCount = "4";
|
|
491
491
|
export const amsGridColumnGap = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
492
|
-
export const
|
|
492
|
+
export const amsGridPaddingBlockL =
|
|
493
493
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
494
|
-
export const
|
|
494
|
+
export const amsGridPaddingBlockXl =
|
|
495
495
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
496
|
-
export const
|
|
496
|
+
export const amsGridPaddingBlock_2xl =
|
|
497
497
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
498
498
|
export const amsGridPaddingInline =
|
|
499
499
|
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
500
|
-
export const
|
|
501
|
-
export const
|
|
502
|
-
export const
|
|
500
|
+
export const amsGridRowGapL = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
501
|
+
export const amsGridRowGapXl = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
502
|
+
export const amsGridRowGap_2xl =
|
|
503
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
503
504
|
export const amsGridMediumColumnCount = "8";
|
|
504
505
|
export const amsGridMediumPaddingInline =
|
|
505
506
|
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
506
507
|
export const amsGridWideColumnCount = "12";
|
|
507
508
|
export const amsGridWidePaddingInline =
|
|
508
509
|
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
509
|
-
export const amsHeaderFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
510
|
-
export const amsHeaderPaddingBlock =
|
|
511
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
512
|
-
export const amsHeaderPaddingInline =
|
|
513
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"; // Must be the Grid inline padding, to make sure Header and Grid line up
|
|
514
|
-
export const amsHeaderLogoLinkColumnGap =
|
|
515
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
516
|
-
export const amsHeaderLogoLinkOutlineOffset = "0.125rem";
|
|
517
|
-
export const amsHeaderBrandNameColor = "#181818";
|
|
518
|
-
export const amsHeaderBrandNameFontSize =
|
|
519
|
-
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
520
|
-
export const amsHeaderBrandNameFontWeight = "800";
|
|
521
|
-
export const amsHeaderMegaMenuButtonCursor = "pointer";
|
|
522
|
-
export const amsHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
523
|
-
export const amsHeaderMenuColumnGap =
|
|
524
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
525
|
-
export const amsHeaderMenuRowGap =
|
|
526
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
527
|
-
export const amsHeaderMenuItemColor = "#004699";
|
|
528
|
-
export const amsHeaderMenuItemColumnGap =
|
|
529
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
530
|
-
export const amsHeaderMenuItemFontFamily =
|
|
531
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
532
|
-
export const amsHeaderMenuItemFontSize =
|
|
533
|
-
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
534
|
-
export const amsHeaderMenuItemFontWeight = "400";
|
|
535
|
-
export const amsHeaderMenuItemLineHeight = "1.6667";
|
|
536
|
-
export const amsHeaderMenuItemOutlineOffset = "0.125rem";
|
|
537
|
-
export const amsHeaderMenuItemPaddingBlock =
|
|
538
|
-
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
539
|
-
export const amsHeaderMenuItemHoverColor = "#003677";
|
|
540
|
-
export const amsHeaderMenuLinkTextDecorationLine = "none";
|
|
541
|
-
export const amsHeaderMenuLinkTextDecorationThickness = "0.125rem";
|
|
542
|
-
export const amsHeaderMenuLinkTextUnderlineOffset = "0.3333em";
|
|
543
|
-
export const amsHeaderMenuLinkHoverTextDecorationLine = "underline";
|
|
544
|
-
export const amsHeaderNavigationColumnGap =
|
|
545
|
-
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
546
|
-
export const amsHeaderNavigationRowGap =
|
|
547
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
548
510
|
export const amsHeading_1FontSize =
|
|
549
511
|
"clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)";
|
|
550
512
|
export const amsHeading_1LineHeight = "1.1754";
|
|
@@ -566,6 +528,7 @@ export const amsHeading_6LineHeight = "1.3776";
|
|
|
566
528
|
export const amsHeadingColor = "#181818";
|
|
567
529
|
export const amsHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
568
530
|
export const amsHeadingFontWeight = "800";
|
|
531
|
+
export const amsHeadingTextWrap = "balance";
|
|
569
532
|
export const amsHeadingInverseColor = "#ffffff";
|
|
570
533
|
export const amsHintColor = "#767676";
|
|
571
534
|
export const amsIconButtonColor = "#004699";
|
|
@@ -628,6 +591,7 @@ export const amsLabelFontSize =
|
|
|
628
591
|
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
629
592
|
export const amsLabelFontWeight = "800";
|
|
630
593
|
export const amsLabelLineHeight = "1.2928";
|
|
594
|
+
export const amsLabelTextWrap = "balance";
|
|
631
595
|
export const amsLinkListGap = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
632
596
|
export const amsLinkListLinkColor = "#004699";
|
|
633
597
|
export const amsLinkListLinkFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -654,24 +618,16 @@ export const amsLinkListLinkContrastHoverColor = "#000000";
|
|
|
654
618
|
export const amsLinkListLinkInverseColor = "#ffffff";
|
|
655
619
|
export const amsLinkListLinkInverseHoverColor = "#ffffff";
|
|
656
620
|
export const amsLinkColor = "#004699";
|
|
657
|
-
export const amsLinkFontFamily = "
|
|
621
|
+
export const amsLinkFontFamily = "inherit";
|
|
622
|
+
export const amsLinkFontSize = "inherit";
|
|
658
623
|
export const amsLinkFontWeight = "400";
|
|
624
|
+
export const amsLinkLineHeight = "inherit";
|
|
659
625
|
export const amsLinkOutlineOffset = "0.125rem";
|
|
626
|
+
export const amsLinkTextDecorationThickness = "0.125rem";
|
|
627
|
+
export const amsLinkTextUnderlineOffset = "0.3333em";
|
|
660
628
|
export const amsLinkHoverColor = "#003677";
|
|
661
|
-
export const
|
|
662
|
-
export const
|
|
663
|
-
export const amsLinkInlineFontFamily = "inherit";
|
|
664
|
-
export const amsLinkInlineFontSize = "inherit";
|
|
665
|
-
export const amsLinkInlineLineHeight = "inherit";
|
|
666
|
-
export const amsLinkInlineHoverTextDecorationThickness = "0.1875rem";
|
|
667
|
-
export const amsLinkInlineHoverTextUnderlineOffset = "0.2778em";
|
|
668
|
-
export const amsLinkStandaloneFontSize =
|
|
669
|
-
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
670
|
-
export const amsLinkStandaloneLineHeight = "1.6667";
|
|
671
|
-
export const amsLinkStandaloneTextDecorationThickness = "0.125rem";
|
|
672
|
-
export const amsLinkStandaloneTextUnderlineOffset = "0.3333em";
|
|
673
|
-
export const amsLinkStandaloneHoverTextDecorationThickness = "0.1875rem";
|
|
674
|
-
export const amsLinkStandaloneHoverTextUnderlineOffset = "0.2778em";
|
|
629
|
+
export const amsLinkHoverTextDecorationThickness = "0.1875rem";
|
|
630
|
+
export const amsLinkHoverTextUnderlineOffset = "0.2778em";
|
|
675
631
|
export const amsLinkContrastColor = "#000000";
|
|
676
632
|
export const amsLinkContrastHoverColor = "#000000";
|
|
677
633
|
export const amsLinkInverseColor = "#ffffff";
|
|
@@ -682,13 +638,6 @@ export const amsLogoEmblemColor = "#ec0000";
|
|
|
682
638
|
export const amsLogoSubsiteColor = "#181818";
|
|
683
639
|
export const amsLogoTitleColor = "#ec0000";
|
|
684
640
|
export const amsMarkBackgroundColor = "#ffe600";
|
|
685
|
-
export const amsMegaMenuListCategoryColumnGap =
|
|
686
|
-
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)"; // Must have the same value as `ams.grid.column-gap`.
|
|
687
|
-
export const amsMegaMenuListCategoryColumnWidth = "20rem";
|
|
688
|
-
export const amsMegaMenuListCategoryPaddingBlockStart =
|
|
689
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
690
|
-
export const amsMegaMenuListCategoryPaddingBlockEnd =
|
|
691
|
-
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)"; // Must have the same value as `ams.grid.row-gap.md`.
|
|
692
641
|
export const amsOrderedListColor = "#181818";
|
|
693
642
|
export const amsOrderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
694
643
|
export const amsOrderedListFontSize =
|
|
@@ -712,31 +661,86 @@ export const amsOrderedListOrderedListPaddingBlockStart =
|
|
|
712
661
|
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
713
662
|
export const amsOrderedListOrderedListItemMarginInlineStart = "1.5rem"; // Indent less than the parent to start-align the child’s marker with the parent text.
|
|
714
663
|
export const amsOrderedListOrderedListItemPaddingInlineStart = "0.25rem"; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
|
|
664
|
+
export const amsPageFooterMenuColumnGap =
|
|
665
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
666
|
+
export const amsPageFooterMenuPaddingBlock =
|
|
667
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
668
|
+
export const amsPageFooterMenuPaddingInline =
|
|
669
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
670
|
+
export const amsPageFooterMenuRowGap =
|
|
671
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
672
|
+
export const amsPageFooterMenuMediumPaddingInline =
|
|
673
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
674
|
+
export const amsPageFooterMenuWidePaddingInline =
|
|
675
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
676
|
+
export const amsPageFooterMenuLinkColor = "#004699";
|
|
677
|
+
export const amsPageFooterMenuLinkFontFamily =
|
|
678
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
679
|
+
export const amsPageFooterMenuLinkFontSize =
|
|
680
|
+
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
681
|
+
export const amsPageFooterMenuLinkFontWeight = "400";
|
|
682
|
+
export const amsPageFooterMenuLinkLineHeight = "1.5152";
|
|
683
|
+
export const amsPageFooterMenuLinkOutlineOffset = "0.125rem";
|
|
684
|
+
export const amsPageFooterMenuLinkTextDecorationLine = "none";
|
|
685
|
+
export const amsPageFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
686
|
+
export const amsPageFooterMenuLinkTextUnderlineOffset = "0.3333em";
|
|
687
|
+
export const amsPageFooterMenuLinkHoverColor = "#003677";
|
|
688
|
+
export const amsPageFooterMenuLinkHoverTextDecorationLine = "underline";
|
|
689
|
+
export const amsPageFooterSpotlightBackgroundColor = "#004699";
|
|
690
|
+
export const amsPageHeaderFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
691
|
+
export const amsPageHeaderPaddingBlock =
|
|
692
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
693
|
+
export const amsPageHeaderPaddingInline =
|
|
694
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"; // Must be the Grid inline padding, to make sure Header and Grid line up
|
|
695
|
+
export const amsPageHeaderMediumPaddingInline =
|
|
696
|
+
"clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
697
|
+
export const amsPageHeaderWidePaddingInline =
|
|
698
|
+
"clamp(2.8125rem, 2.2031rem + 3.0469vw, 5.25rem)";
|
|
699
|
+
export const amsPageHeaderLogoLinkColumnGap =
|
|
700
|
+
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
701
|
+
export const amsPageHeaderLogoLinkOutlineOffset = "0.125rem";
|
|
702
|
+
export const amsPageHeaderBrandNameColor = "#181818";
|
|
703
|
+
export const amsPageHeaderBrandNameFontSize =
|
|
704
|
+
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
705
|
+
export const amsPageHeaderBrandNameFontWeight = "800";
|
|
706
|
+
export const amsPageHeaderBrandNameTextWrap = "balance";
|
|
707
|
+
export const amsPageHeaderMegaMenuButtonCursor = "pointer";
|
|
708
|
+
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "800";
|
|
709
|
+
export const amsPageHeaderMenuColumnGap =
|
|
710
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
711
|
+
export const amsPageHeaderMenuRowGap =
|
|
712
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
713
|
+
export const amsPageHeaderMenuItemColor = "#004699";
|
|
714
|
+
export const amsPageHeaderMenuItemColumnGap =
|
|
715
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
716
|
+
export const amsPageHeaderMenuItemFontFamily =
|
|
717
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
718
|
+
export const amsPageHeaderMenuItemFontSize =
|
|
719
|
+
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
720
|
+
export const amsPageHeaderMenuItemFontWeight = "400";
|
|
721
|
+
export const amsPageHeaderMenuItemLineHeight = "1.6667";
|
|
722
|
+
export const amsPageHeaderMenuItemOutlineOffset = "0.125rem";
|
|
723
|
+
export const amsPageHeaderMenuItemPaddingBlock =
|
|
724
|
+
"clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)";
|
|
725
|
+
export const amsPageHeaderMenuItemHoverColor = "#003677";
|
|
726
|
+
export const amsPageHeaderMenuLinkTextDecorationLine = "none";
|
|
727
|
+
export const amsPageHeaderMenuLinkTextDecorationThickness = "0.125rem";
|
|
728
|
+
export const amsPageHeaderMenuLinkTextUnderlineOffset = "0.3333em";
|
|
729
|
+
export const amsPageHeaderMenuLinkHoverTextDecorationLine = "underline";
|
|
730
|
+
export const amsPageHeaderNavigationColumnGap =
|
|
731
|
+
"clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
732
|
+
export const amsPageHeaderNavigationRowGap =
|
|
733
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
715
734
|
export const amsPageHeadingColor = "#181818";
|
|
716
735
|
export const amsPageHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
717
736
|
export const amsPageHeadingFontSize =
|
|
718
737
|
"clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)";
|
|
719
738
|
export const amsPageHeadingFontWeight = "800";
|
|
720
739
|
export const amsPageHeadingLineHeight = "1.1386";
|
|
740
|
+
export const amsPageHeadingTextWrap = "balance";
|
|
721
741
|
export const amsPageHeadingInverseColor = "#ffffff";
|
|
722
|
-
export const
|
|
723
|
-
|
|
724
|
-
export const amsPageMenuRowGap =
|
|
725
|
-
"clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
726
|
-
export const amsPageMenuItemColor = "#004699";
|
|
727
|
-
export const amsPageMenuItemFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
728
|
-
export const amsPageMenuItemFontSize =
|
|
729
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
730
|
-
export const amsPageMenuItemFontWeight = "400";
|
|
731
|
-
export const amsPageMenuItemGap =
|
|
732
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
733
|
-
export const amsPageMenuItemLineHeight = "1.5152";
|
|
734
|
-
export const amsPageMenuItemOutlineOffset = "0.125rem";
|
|
735
|
-
export const amsPageMenuItemTextDecorationLine = "none";
|
|
736
|
-
export const amsPageMenuItemTextDecorationThickness = "0.125rem";
|
|
737
|
-
export const amsPageMenuItemTextUnderlineOffset = "0.3333em";
|
|
738
|
-
export const amsPageMenuItemHoverColor = "#003677";
|
|
739
|
-
export const amsPageMenuItemHoverTextDecorationLine = "underline";
|
|
742
|
+
export const amsPageBackgroundColor = "#ffffff";
|
|
743
|
+
export const amsPageMaxInlineSize = "100rem";
|
|
740
744
|
export const amsPaginationFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
741
745
|
export const amsPaginationFontSize =
|
|
742
746
|
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
@@ -833,9 +837,6 @@ export const amsRowGapSmall = "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
|
833
837
|
export const amsRowGapMedium = "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)";
|
|
834
838
|
export const amsRowGapLarge = "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)";
|
|
835
839
|
export const amsRowGapXLarge = "clamp(2.25rem, 1.9375rem + 1.5625vw, 3.5rem)";
|
|
836
|
-
export const amsScreenBackgroundColor = "#ffffff";
|
|
837
|
-
export const amsScreenWideMaxInlineSize = "100rem";
|
|
838
|
-
export const amsScreenXWideMaxInlineSize = "132rem";
|
|
839
840
|
export const amsSearchFieldInputBackgroundColor = "#ffffff";
|
|
840
841
|
export const amsSearchFieldInputBoxShadow = "inset 0 0 0 0.0625rem #181818";
|
|
841
842
|
export const amsSearchFieldInputColor = "#181818";
|
|
@@ -910,6 +911,27 @@ export const amsSpotlightLimeBackgroundColor = "#bed200";
|
|
|
910
911
|
export const amsSpotlightMagentaBackgroundColor = "#e50082";
|
|
911
912
|
export const amsSpotlightOrangeBackgroundColor = "#ff9100";
|
|
912
913
|
export const amsSpotlightYellowBackgroundColor = "#ffe600";
|
|
914
|
+
export const amsStandaloneLinkColor = "#004699";
|
|
915
|
+
export const amsStandaloneLinkColumnGap =
|
|
916
|
+
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
917
|
+
export const amsStandaloneLinkFontFamily =
|
|
918
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
919
|
+
export const amsStandaloneLinkFontSize =
|
|
920
|
+
"clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)";
|
|
921
|
+
export const amsStandaloneLinkFontWeight = "400";
|
|
922
|
+
export const amsStandaloneLinkLineHeight = "1.6667";
|
|
923
|
+
export const amsStandaloneLinkOutlineOffset = "0.125rem";
|
|
924
|
+
export const amsStandaloneLinkTextDecorationThickness = "0.125rem";
|
|
925
|
+
export const amsStandaloneLinkTextUnderlineOffset = "0.3333em";
|
|
926
|
+
export const amsStandaloneLinkContrastColor = "#000000";
|
|
927
|
+
export const amsStandaloneLinkContrastHoverColor = "#000000";
|
|
928
|
+
export const amsStandaloneLinkHoverColor = "#003677";
|
|
929
|
+
export const amsStandaloneLinkHoverTextDecorationThickness = "0.1875rem";
|
|
930
|
+
export const amsStandaloneLinkHoverTextUnderlineOffset = "0.2778em";
|
|
931
|
+
export const amsStandaloneLinkInverseColor = "#ffffff";
|
|
932
|
+
export const amsStandaloneLinkInverseHoverColor = "#ffffff";
|
|
933
|
+
export const amsStandaloneLinkWithIconTextDecorationLine = "none";
|
|
934
|
+
export const amsStandaloneLinkWithIconHoverTextDecorationLine = "underline";
|
|
913
935
|
export const amsSwitchBackgroundColor = "#767676";
|
|
914
936
|
export const amsSwitchCursor = "pointer";
|
|
915
937
|
export const amsSwitchOutlineOffset = "0.125rem";
|
|
@@ -1051,28 +1073,6 @@ export const amsTimeInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
|
1051
1073
|
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23102E62'><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>\")";
|
|
1052
1074
|
export const amsTimeInputInvalidBoxShadow = "inset 0 0 0 0.0625rem #ec0000";
|
|
1053
1075
|
export const amsTimeInputInvalidHoverBoxShadow = "inset 0 0 0 0.125rem #b70000";
|
|
1054
|
-
export const amsTopTaskLinkGap =
|
|
1055
|
-
"clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)";
|
|
1056
|
-
export const amsTopTaskLinkDescriptionColor = "#181818";
|
|
1057
|
-
export const amsTopTaskLinkDescriptionFontFamily =
|
|
1058
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
1059
|
-
export const amsTopTaskLinkDescriptionFontSize =
|
|
1060
|
-
"clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)";
|
|
1061
|
-
export const amsTopTaskLinkDescriptionFontWeight = "400";
|
|
1062
|
-
export const amsTopTaskLinkDescriptionLineHeight = "1.5152";
|
|
1063
|
-
export const amsTopTaskLinkLabelColor = "#004699";
|
|
1064
|
-
export const amsTopTaskLinkLabelFontFamily =
|
|
1065
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
1066
|
-
export const amsTopTaskLinkLabelFontSize =
|
|
1067
|
-
"clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)";
|
|
1068
|
-
export const amsTopTaskLinkLabelFontWeight = "800";
|
|
1069
|
-
export const amsTopTaskLinkLabelLineHeight = "1.2928";
|
|
1070
|
-
export const amsTopTaskLinkLabelTextDecorationLine = "none";
|
|
1071
|
-
export const amsTopTaskLinkLabelTextDecorationThickness = "0.125rem";
|
|
1072
|
-
export const amsTopTaskLinkLabelTextUnderlineOffset = "0.3333em";
|
|
1073
|
-
export const amsTopTaskLinkLabelHoverColor = "#003677";
|
|
1074
|
-
export const amsTopTaskLinkLabelHoverTextDecorationLine = "underline";
|
|
1075
|
-
export const amsTopTaskLinkOutlineOffset = "0.125rem";
|
|
1076
1076
|
export const amsUnorderedListColor = "#181818";
|
|
1077
1077
|
export const amsUnorderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1078
1078
|
export const amsUnorderedListFontSize =
|