@amsterdam/design-system-tokens 3.3.0 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +61 -3
- package/README.md +131 -22
- package/build.js +11 -1
- package/dist/compact.css +9 -2
- package/dist/compact.d.ts +21 -6
- package/dist/compact.json +33 -18
- package/dist/compact.mjs +21 -13
- package/dist/compact.scss +9 -2
- package/dist/compact.theme.css +9 -2
- package/dist/index.css +177 -165
- package/dist/index.d.ts +250 -226
- package/dist/index.json +345 -321
- package/dist/index.mjs +285 -267
- package/dist/index.scss +177 -165
- package/dist/index.theme.css +177 -165
- package/package.json +2 -2
- package/src/brand/ams/aspect-ratio.tokens.json +24 -6
- package/src/brand/ams/border.compact.tokens.json +20 -0
- package/src/brand/ams/border.tokens.json +25 -0
- package/src/brand/ams/color.compact.tokens.json +15 -0
- package/src/brand/ams/color.tokens.json +37 -49
- package/src/brand/ams/cursor.tokens.json +9 -2
- package/src/brand/ams/focus.tokens.json +1 -0
- package/src/brand/ams/space.compact.tokens.json +16 -4
- package/src/brand/ams/space.tokens.json +31 -6
- package/src/brand/ams/typography.compact.tokens.json +36 -27
- package/src/brand/ams/typography.tokens.json +60 -32
- package/src/common/ams/inputs.tokens.json +41 -19
- package/src/common/ams/links.tokens.json +35 -10
- package/src/components/ams/accordion.tokens.json +18 -11
- package/src/components/ams/action-group.tokens.json +2 -2
- package/src/components/ams/alert.tokens.json +38 -20
- package/src/components/ams/avatar.tokens.json +79 -29
- package/src/components/ams/badge.tokens.json +60 -23
- package/src/components/ams/blockquote.tokens.json +14 -5
- package/src/components/ams/body.compact.tokens.json +12 -0
- package/src/components/ams/body.tokens.json +12 -0
- package/src/components/ams/breadcrumb.tokens.json +36 -15
- package/src/components/ams/button.tokens.json +74 -33
- package/src/components/ams/call-to-action-link.tokens.json +29 -16
- package/src/components/ams/card.tokens.json +30 -17
- package/src/components/ams/character-count.tokens.json +14 -5
- package/src/components/ams/checkbox.tokens.json +106 -39
- package/src/components/ams/column.tokens.json +10 -10
- package/src/components/ams/date-input.tokens.json +56 -23
- package/src/components/ams/description-list.tokens.json +101 -23
- package/src/components/ams/dialog.tokens.json +104 -28
- package/src/components/ams/error-message.tokens.json +13 -6
- package/src/components/ams/field-set.tokens.json +40 -17
- package/src/components/ams/field.tokens.json +18 -7
- package/src/components/ams/figure.tokens.json +16 -7
- package/src/components/ams/file-input.tokens.json +69 -30
- package/src/components/ams/file-list.tokens.json +20 -11
- package/src/components/ams/grid.compact.tokens.json +24 -2
- package/src/components/ams/grid.tokens.json +77 -24
- package/src/components/ams/heading.tokens.json +38 -36
- package/src/components/ams/hint.tokens.json +6 -2
- package/src/components/ams/icon-button.tokens.json +46 -16
- package/src/components/ams/icon.tokens.json +19 -23
- package/src/components/ams/image-slider.tokens.json +28 -16
- package/src/components/ams/image.tokens.json +4 -1
- package/src/components/ams/invalid-form-alert.tokens.json +2 -2
- package/src/components/ams/label.tokens.json +18 -6
- package/src/components/ams/link-list.tokens.json +50 -22
- package/src/components/ams/link.tokens.json +38 -25
- package/src/components/ams/logo.tokens.json +6 -2
- package/src/components/ams/mark.tokens.json +3 -1
- package/src/components/ams/menu.tokens.json +81 -28
- package/src/components/ams/ordered-list.tokens.json +39 -25
- package/src/components/ams/page-footer.tokens.json +70 -26
- package/src/components/ams/page-header.compact.tokens.json +2 -1
- package/src/components/ams/page-header.tokens.json +128 -59
- package/src/components/ams/page.compact.tokens.json +12 -0
- package/src/components/ams/page.tokens.json +5 -3
- package/src/components/ams/pagination.tokens.json +37 -17
- package/src/components/ams/paragraph.tokens.json +22 -8
- package/src/components/ams/password-input.tokens.json +47 -21
- package/src/components/ams/progress-list.tokens.json +194 -52
- package/src/components/ams/radio.tokens.json +97 -36
- package/src/components/ams/row.tokens.json +10 -10
- package/src/components/ams/search-field.tokens.json +57 -24
- package/src/components/ams/select.tokens.json +63 -23
- package/src/components/ams/skip-link.tokens.json +23 -12
- package/src/components/ams/spotlight.tokens.json +21 -7
- package/src/components/ams/standalone-link.tokens.json +44 -18
- package/src/components/ams/switch.tokens.json +40 -10
- package/src/components/ams/tab-navigation.tokens.json +205 -0
- package/src/components/ams/table-of-contents.tokens.json +38 -20
- package/src/components/ams/table.tokens.json +29 -10
- package/src/components/ams/tabs.tokens.json +39 -20
- package/src/components/ams/text-area.tokens.json +49 -23
- package/src/components/ams/text-input.tokens.json +47 -19
- package/src/components/ams/time-input.tokens.json +56 -21
- package/src/components/ams/unordered-list.tokens.json +37 -25
- package/style-dictionary/transforms/dtcg-font-family.js +32 -0
- package/src/brand/ams/color.deprecated.tokens.json +0 -13
- package/src/brand/ams/typography.deprecated.compact.tokens.json +0 -26
- package/src/brand/ams/typography.deprecated.tokens.json +0 -40
- package/src/components/ams/accordion.deprecated.tokens.json +0 -39
- package/src/components/ams/checkbox.deprecated.tokens.json +0 -59
- package/src/components/ams/date-input.deprecated.tokens.json +0 -38
- package/src/components/ams/field-set.deprecated.tokens.json +0 -16
- package/src/components/ams/field.deprecated.tokens.json +0 -14
- package/src/components/ams/icon.deprecated.tokens.json +0 -22
- package/src/components/ams/menu.deprecated.tokens.json +0 -36
- package/src/components/ams/page-heading.deprecated.tokens.json +0 -46
- package/src/components/ams/standalone-link.deprecated.tokens.json +0 -38
- package/src/components/ams/table-of-contents.deprecated.tokens.json +0 -24
- package/src/components/ams/time-input.deprecated.tokens.json +0 -38
package/dist/index.mjs
CHANGED
|
@@ -8,19 +8,14 @@ export const amsAspectRatio_1_1 = "1 / 1";
|
|
|
8
8
|
export const amsAspectRatio_4_3 = "4 / 3";
|
|
9
9
|
export const amsAspectRatio_16_9 = "16 / 9";
|
|
10
10
|
export const amsAspectRatio_16_5 = "16 / 5";
|
|
11
|
-
export const amsBorderWidthS = "0.0625rem";
|
|
12
|
-
export const amsBorderWidthM = "0.125rem";
|
|
13
|
-
export const amsBorderWidthL = "0.1875rem";
|
|
14
|
-
export const amsBorderWidthXl = "0.25rem";
|
|
15
|
-
export const
|
|
16
|
-
export const
|
|
17
|
-
export const
|
|
18
|
-
export const
|
|
19
|
-
export const amsColorInteractiveHover = "#003677";
|
|
20
|
-
export const amsColorInteractiveInvalid = "#ec0000";
|
|
21
|
-
export const amsColorInteractiveInvalidHover = "#b70000";
|
|
22
|
-
export const amsColorInteractiveInverse = "#ffffff";
|
|
23
|
-
export const amsColorBackground = "#ffffff";
|
|
11
|
+
export const amsBorderWidthS = "0.0625rem"; // 1px equivalent. For subtle borders like hover reinforcement.
|
|
12
|
+
export const amsBorderWidthM = "0.125rem"; // 2px equivalent. The default border width for inputs and containers.
|
|
13
|
+
export const amsBorderWidthL = "0.1875rem"; // 3px equivalent.
|
|
14
|
+
export const amsBorderWidthXl = "0.25rem"; // 4px equivalent. For strong emphasis like active tab indicators.
|
|
15
|
+
export const amsBorderWidthNegativeM = "-0.125rem";
|
|
16
|
+
export const amsBorderWidthNegativeXl = "-0.25rem";
|
|
17
|
+
export const amsColorBackgroundBody = "#ffffff";
|
|
18
|
+
export const amsColorBackground = "#ffffff"; // The default background colour for form controls and smaller surfaces.
|
|
24
19
|
export const amsColorFeedbackError = "#ec0000";
|
|
25
20
|
export const amsColorFeedbackInfo = "#009de6";
|
|
26
21
|
export const amsColorFeedbackSuccess = "#00893c";
|
|
@@ -32,60 +27,62 @@ export const amsColorHighlightMagenta = "#e50082";
|
|
|
32
27
|
export const amsColorHighlightOrange = "#ff9100";
|
|
33
28
|
export const amsColorHighlightPurple = "#a00078";
|
|
34
29
|
export const amsColorHighlightYellow = "#ffe600";
|
|
30
|
+
export const amsColorInteractiveContrast = "#202020"; // For interactive elements on coloured backgrounds where the default blue lacks sufficient contrast.
|
|
31
|
+
export const amsColorInteractive = "#004699";
|
|
32
|
+
export const amsColorInteractiveDisabled = "#767676";
|
|
33
|
+
export const amsColorInteractiveHover = "#003677";
|
|
34
|
+
export const amsColorInteractiveInvalid = "#ec0000";
|
|
35
|
+
export const amsColorInteractiveInvalidHover = "#b70000";
|
|
36
|
+
export const amsColorInteractiveInverse = "#ffffff"; // For interactive elements on dark backgrounds.
|
|
35
37
|
export const amsColorProgressCurrent = "#00893c";
|
|
36
38
|
export const amsColorProgressCompleted = "#00893c";
|
|
37
39
|
export const amsColorProgressUpcoming = "#767676";
|
|
38
|
-
export const amsColorSeparator = "#d1d1d1";
|
|
40
|
+
export const amsColorSeparator = "#d1d1d1"; // For row borders in tables.
|
|
39
41
|
export const amsColorText = "#202020";
|
|
40
42
|
export const amsColorTextInverse = "#ffffff";
|
|
41
|
-
export const amsColorTextSecondary = "#767676";
|
|
43
|
+
export const amsColorTextSecondary = "#767676"; // For supporting text that is less prominent than the default, e.g. metadata.
|
|
42
44
|
export const amsCursorDisabled = "not-allowed";
|
|
43
|
-
export const amsCursorInteractive = "pointer";
|
|
44
|
-
export const amsFocusOutlineOffset = "0.25rem";
|
|
45
|
-
export const amsSpaceXs = "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
46
|
-
export const amsSpaceS = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
47
|
-
export const amsSpaceM = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
48
|
-
export const amsSpaceL = "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
49
|
-
export const amsSpaceXl = "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
50
|
-
export const amsSpace_2xl = "clamp(3rem, 2.25rem + 3.75vw, 5.625rem)";
|
|
51
|
-
export const
|
|
52
|
-
|
|
53
|
-
export const
|
|
45
|
+
export const amsCursorInteractive = "pointer"; // All interactive elements in their default state that lack a cursor style.
|
|
46
|
+
export const amsFocusOutlineOffset = "0.25rem"; // The distance between a focused element and its outline. Provides breathing room so the outline doesn't touch the element.
|
|
47
|
+
export const amsSpaceXs = "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)"; // Scales from 4px to 6px.
|
|
48
|
+
export const amsSpaceS = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)"; // Scales from 8px to 12px.
|
|
49
|
+
export const amsSpaceM = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)"; // Scales from 16px to 24px.
|
|
50
|
+
export const amsSpaceL = "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)"; // Scales from 24px to 36px.
|
|
51
|
+
export const amsSpaceXl = "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)"; // Scales from 36px to 60px.
|
|
52
|
+
export const amsSpace_2xl = "clamp(3rem, 2.25rem + 3.75vw, 5.625rem)"; // Scales from 48px to 90px.
|
|
53
|
+
export const amsTypographyFontFamily = "'Amsterdam Sans', Arial, sans-serif"; // The corporate typeface with system fallbacks.
|
|
54
|
+
export const amsTypographyHyphenateLimitChars = "auto"; // Lets the browser decide the minimum character count for hyphenation.
|
|
55
|
+
export const amsTypographyBodyTextFontSize =
|
|
56
|
+
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)"; // Scales from 18px to 20px.
|
|
57
|
+
export const amsTypographyBodyTextFontWeight = "400";
|
|
58
|
+
export const amsTypographyBodyTextLineHeight = 1.6;
|
|
59
|
+
export const amsTypographyBodyTextBoldFontWeight = "800";
|
|
60
|
+
export const amsTypographyBodyTextSmallFontSize = "1rem"; // Fixed at 16px; does not scale.
|
|
61
|
+
export const amsTypographyBodyTextSmallLineHeight = 1.5;
|
|
62
|
+
export const amsTypographyBodyTextLargeFontSize =
|
|
63
|
+
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)"; // Scales from 21px to 25px.
|
|
64
|
+
export const amsTypographyBodyTextLargeLineHeight = 1.5;
|
|
65
|
+
export const amsTypographyBodyTextXLargeFontSize =
|
|
66
|
+
"clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)"; // Scales from 24px to 32px.
|
|
67
|
+
export const amsTypographyBodyTextXLargeLineHeight = 1.4;
|
|
54
68
|
export const amsTypographyHeading_1FontSize =
|
|
55
|
-
"clamp(2rem, 1.7143rem + 1.4286vw, 3rem)";
|
|
56
|
-
export const amsTypographyHeading_1LineHeight =
|
|
69
|
+
"clamp(2rem, 1.7143rem + 1.4286vw, 3rem)"; // Scales from 32px to 48px.
|
|
70
|
+
export const amsTypographyHeading_1LineHeight = 1.2;
|
|
57
71
|
export const amsTypographyHeading_2FontSize =
|
|
58
72
|
"clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)";
|
|
59
|
-
export const amsTypographyHeading_2LineHeight =
|
|
73
|
+
export const amsTypographyHeading_2LineHeight = 1.3;
|
|
60
74
|
export const amsTypographyHeading_3FontSize =
|
|
61
75
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
62
|
-
export const amsTypographyHeading_3LineHeight =
|
|
76
|
+
export const amsTypographyHeading_3LineHeight = 1.3;
|
|
63
77
|
export const amsTypographyHeading_4FontSize =
|
|
64
78
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
65
|
-
export const amsTypographyHeading_4LineHeight =
|
|
79
|
+
export const amsTypographyHeading_4LineHeight = 1.4;
|
|
66
80
|
export const amsTypographyHeading_5FontSize = "1rem";
|
|
67
|
-
export const amsTypographyHeading_5LineHeight =
|
|
68
|
-
export const amsTypographyHeading_6FontSize = "1rem";
|
|
69
|
-
export const amsTypographyHeading_6LineHeight = "1.4";
|
|
81
|
+
export const amsTypographyHeading_5LineHeight = 1.4;
|
|
70
82
|
export const amsTypographyHeadingFontWeight = "800";
|
|
71
|
-
export const amsTypographyHeadingTextWrap = "balance";
|
|
72
|
-
export const amsTypographyFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
73
|
-
export const amsTypographyHyphenateLimitChars = "auto";
|
|
74
|
-
export const amsTypographyBodyTextFontSize =
|
|
75
|
-
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
76
|
-
export const amsTypographyBodyTextFontWeight = "400";
|
|
77
|
-
export const amsTypographyBodyTextLineHeight = "1.8";
|
|
78
|
-
export const amsTypographyBodyTextBoldFontWeight = "800";
|
|
79
|
-
export const amsTypographyBodyTextSmallFontSize = "1rem";
|
|
80
|
-
export const amsTypographyBodyTextSmallLineHeight = "1.6";
|
|
81
|
-
export const amsTypographyBodyTextLargeFontSize =
|
|
82
|
-
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
83
|
-
export const amsTypographyBodyTextLargeLineHeight = "1.6";
|
|
84
|
-
export const amsTypographyBodyTextXLargeFontSize =
|
|
85
|
-
"clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)";
|
|
86
|
-
export const amsTypographyBodyTextXLargeLineHeight = "1.4";
|
|
83
|
+
export const amsTypographyHeadingTextWrap = "balance"; // Distributes heading text evenly across lines for a more balanced appearance.
|
|
87
84
|
export const amsInputsBackgroundColor = "#ffffff";
|
|
88
|
-
export const amsInputsBorderColor = "currentColor";
|
|
85
|
+
export const amsInputsBorderColor = "currentColor"; // Uses currentColor so the border adapts to the text colour, including in error states.
|
|
89
86
|
export const amsInputsBorderStyle = "solid";
|
|
90
87
|
export const amsInputsBorderWidth = "0.125rem";
|
|
91
88
|
export const amsInputsColor = "#202020";
|
|
@@ -93,7 +90,7 @@ export const amsInputsFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
93
90
|
export const amsInputsFontSize =
|
|
94
91
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
95
92
|
export const amsInputsFontWeight = "400";
|
|
96
|
-
export const amsInputsLineHeight =
|
|
93
|
+
export const amsInputsLineHeight = 1.4; // Tighter than body text (1.6) to keep inputs compact. Buttons also use this to match.
|
|
97
94
|
export const amsInputsOutlineOffset = "0.25rem";
|
|
98
95
|
export const amsInputsPaddingBlock =
|
|
99
96
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -101,11 +98,11 @@ export const amsInputsPaddingInline =
|
|
|
101
98
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
102
99
|
export const amsInputsDisabledColor = "#767676";
|
|
103
100
|
export const amsInputsHoverBoxShadow =
|
|
104
|
-
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
101
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor"; // An inset shadow that reinforces the border on hover without shifting the layout.
|
|
105
102
|
export const amsInputsInvalidBorderColor = "#ec0000";
|
|
106
103
|
export const amsInputsInvalidHoverBorderColor = "#b70000";
|
|
107
104
|
export const amsInputsInvalidHoverBoxShadow =
|
|
108
|
-
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
105
|
+
"inset 0rem 0rem 0rem 0.0625rem #b70000"; // An inset shadow using the hover variation of the invalid interactive colour.
|
|
109
106
|
export const amsInputsPlaceholderColor = "#767676";
|
|
110
107
|
export const amsLinksColor = "#004699";
|
|
111
108
|
export const amsLinksTextDecorationThickness = "0.125rem";
|
|
@@ -119,13 +116,7 @@ export const amsLinksContrastColor = "#202020";
|
|
|
119
116
|
export const amsLinksContrastHoverColor = "#202020";
|
|
120
117
|
export const amsLinksInverseColor = "#ffffff";
|
|
121
118
|
export const amsLinksInverseHoverColor = "#ffffff";
|
|
122
|
-
export const
|
|
123
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
124
|
-
export const amsAccordionButtonFontSize =
|
|
125
|
-
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
126
|
-
export const amsAccordionButtonFontWeight = "800";
|
|
127
|
-
export const amsAccordionButtonLineHeight = "1.3";
|
|
128
|
-
export const amsAccordionButtonTextWrap = "balance";
|
|
119
|
+
export const amsAccordionGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
129
120
|
export const amsAccordionButtonColor = "#004699";
|
|
130
121
|
export const amsAccordionButtonCursor = "pointer";
|
|
131
122
|
export const amsAccordionButtonGap =
|
|
@@ -135,9 +126,6 @@ export const amsAccordionButtonPaddingBlock =
|
|
|
135
126
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
136
127
|
export const amsAccordionButtonPaddingInline = "0";
|
|
137
128
|
export const amsAccordionButtonHoverColor = "#003677";
|
|
138
|
-
export const amsAccordionPanelPaddingBlock = "0";
|
|
139
|
-
export const amsAccordionPanelPaddingInline = "0";
|
|
140
|
-
export const amsAccordionGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
141
129
|
export const amsActionGroupGap = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
142
130
|
export const amsAlertBackgroundColor = "#ffffff";
|
|
143
131
|
export const amsAlertBorderColor = "#009de6";
|
|
@@ -169,7 +157,7 @@ export const amsAvatarColor = "#ffffff";
|
|
|
169
157
|
export const amsAvatarFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
170
158
|
export const amsAvatarFontSize = "1rem";
|
|
171
159
|
export const amsAvatarFontWeight = "400";
|
|
172
|
-
export const amsAvatarLineHeight =
|
|
160
|
+
export const amsAvatarLineHeight = 1.5;
|
|
173
161
|
export const amsAvatarPaddingBlock =
|
|
174
162
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
175
163
|
export const amsAvatarPaddingInline =
|
|
@@ -200,7 +188,7 @@ export const amsBadgeFontSize =
|
|
|
200
188
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
201
189
|
export const amsBadgeFontWeight = "800";
|
|
202
190
|
export const amsBadgeGap = "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
203
|
-
export const amsBadgeLineHeight =
|
|
191
|
+
export const amsBadgeLineHeight = 1.6;
|
|
204
192
|
export const amsBadgePaddingInline =
|
|
205
193
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
206
194
|
export const amsBadgeAzureBackgroundColor = "#009de6";
|
|
@@ -222,13 +210,14 @@ export const amsBlockquoteFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
222
210
|
export const amsBlockquoteFontSize =
|
|
223
211
|
"clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)";
|
|
224
212
|
export const amsBlockquoteFontWeight = "800";
|
|
225
|
-
export const amsBlockquoteLineHeight =
|
|
213
|
+
export const amsBlockquoteLineHeight = 1.4;
|
|
226
214
|
export const amsBlockquoteInverseColor = "#ffffff";
|
|
215
|
+
export const amsBodyBackgroundColor = "#ffffff";
|
|
227
216
|
export const amsBreadcrumbFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
228
217
|
export const amsBreadcrumbFontSize =
|
|
229
218
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
230
219
|
export const amsBreadcrumbFontWeight = "400";
|
|
231
|
-
export const amsBreadcrumbLineHeight =
|
|
220
|
+
export const amsBreadcrumbLineHeight = 1.6;
|
|
232
221
|
export const amsBreadcrumbSeparatorBackgroundImage =
|
|
233
222
|
"url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23000000' fill-rule='evenodd' d='m9.757 32-2.9-2.91L19.937 16 6.857 2.91 9.757 0l16 16z'/></svg>\")";
|
|
234
223
|
export const amsBreadcrumbSeparatorBlockSize = "1ex";
|
|
@@ -249,7 +238,7 @@ export const amsButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
249
238
|
export const amsButtonFontSize =
|
|
250
239
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
251
240
|
export const amsButtonFontWeight = "400";
|
|
252
|
-
export const amsButtonLineHeight =
|
|
241
|
+
export const amsButtonLineHeight = 1.4;
|
|
253
242
|
export const amsButtonGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
254
243
|
export const amsButtonOutlineOffset = "0.25rem";
|
|
255
244
|
export const amsButtonPaddingBlock =
|
|
@@ -289,7 +278,7 @@ export const amsCallToActionLinkFontFamily =
|
|
|
289
278
|
export const amsCallToActionLinkFontSize =
|
|
290
279
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
291
280
|
export const amsCallToActionLinkFontWeight = "400";
|
|
292
|
-
export const amsCallToActionLinkLineHeight =
|
|
281
|
+
export const amsCallToActionLinkLineHeight = 1.6;
|
|
293
282
|
export const amsCallToActionLinkOutlineOffset = "0.25rem";
|
|
294
283
|
export const amsCallToActionLinkPaddingBlock =
|
|
295
284
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -320,33 +309,8 @@ export const amsCharacterCountFontFamily =
|
|
|
320
309
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
321
310
|
export const amsCharacterCountFontSize = "1rem";
|
|
322
311
|
export const amsCharacterCountFontWeight = "400";
|
|
323
|
-
export const amsCharacterCountLineHeight =
|
|
312
|
+
export const amsCharacterCountLineHeight = 1.5;
|
|
324
313
|
export const amsCharacterCountErrorColor = "#ec0000";
|
|
325
|
-
export const amsCheckboxHoverTextDecorationThickness = "0.125rem";
|
|
326
|
-
export const amsCheckboxHoverColor = "#003677";
|
|
327
|
-
export const amsCheckboxHoverTextDecorationLine = "underline";
|
|
328
|
-
export const amsCheckboxRectangleCheckedDisabledHoverFill = "#767676";
|
|
329
|
-
export const amsCheckboxRectangleCheckedDisabledFill = "#767676";
|
|
330
|
-
export const amsCheckboxRectangleCheckedHoverDisabledInvalidFill = "#767676";
|
|
331
|
-
export const amsCheckboxRectangleCheckedHoverFill = "#003677";
|
|
332
|
-
export const amsCheckboxRectangleCheckedFill = "#004699";
|
|
333
|
-
export const amsCheckboxRectangleCheckedInvalidFill = "#ec0000";
|
|
334
|
-
export const amsCheckboxRectangleCheckedInvalidHoverFill = "#b70000";
|
|
335
|
-
export const amsCheckboxRectangleHoverDisabledInvalidStroke = "#767676";
|
|
336
|
-
export const amsCheckboxRectangleHoverStroke = "#003677";
|
|
337
|
-
export const amsCheckboxRectangleIndeterminateDisabledHoverFill = "#767676";
|
|
338
|
-
export const amsCheckboxRectangleIndeterminateDisabledFill = "#767676";
|
|
339
|
-
export const amsCheckboxRectangleIndeterminateHoverDisabledInvalidFill =
|
|
340
|
-
"#767676";
|
|
341
|
-
export const amsCheckboxRectangleIndeterminateHoverFill = "#003677";
|
|
342
|
-
export const amsCheckboxRectangleIndeterminateFill = "#004699";
|
|
343
|
-
export const amsCheckboxRectangleIndeterminateInvalidFill = "#ec0000";
|
|
344
|
-
export const amsCheckboxRectangleIndeterminateInvalidHoverFill = "#b70000";
|
|
345
|
-
export const amsCheckboxRectangleFill = "#ffffff";
|
|
346
|
-
export const amsCheckboxRectangleStroke = "#004699";
|
|
347
|
-
export const amsCheckboxRectangleDisabledStroke = "#767676";
|
|
348
|
-
export const amsCheckboxRectangleInvalidStroke = "#ec0000";
|
|
349
|
-
export const amsCheckboxRectangleInvalidHoverStroke = "#b70000";
|
|
350
314
|
export const amsCheckboxColor = "#202020";
|
|
351
315
|
export const amsCheckboxCursor = "pointer";
|
|
352
316
|
export const amsCheckboxFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -354,20 +318,38 @@ export const amsCheckboxFontSize =
|
|
|
354
318
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
355
319
|
export const amsCheckboxFontWeight = "400";
|
|
356
320
|
export const amsCheckboxGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
357
|
-
export const amsCheckboxLineHeight =
|
|
321
|
+
export const amsCheckboxLineHeight = 1.6;
|
|
358
322
|
export const amsCheckboxOutlineOffset = "0.25rem";
|
|
359
323
|
export const amsCheckboxTextDecorationThickness = "0.125rem";
|
|
360
324
|
export const amsCheckboxTextUnderlineOffset = "0.15625rem";
|
|
361
325
|
export const amsCheckboxDisabledCursor = "not-allowed";
|
|
362
326
|
export const amsCheckboxDisabledColor = "#767676";
|
|
327
|
+
export const amsCheckboxHoverColor = "#003677";
|
|
328
|
+
export const amsCheckboxHoverTextDecorationLine = "underline";
|
|
363
329
|
export const amsCheckboxCheckedIndicatorStroke = "#ffffff";
|
|
364
330
|
export const amsCheckboxHoverIndicatorHoverStroke = "#003677";
|
|
365
331
|
export const amsCheckboxHoverIndicatorInvalidHoverStroke = "#b70000";
|
|
366
332
|
export const amsCheckboxIconContainerBlockSize =
|
|
367
|
-
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.
|
|
333
|
+
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.6)";
|
|
368
334
|
export const amsCheckboxIconContainerInlineSize =
|
|
369
335
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
370
336
|
export const amsCheckboxIndeterminateIndicatorStroke = "#ffffff";
|
|
337
|
+
export const amsCheckboxRectangleFill = "#ffffff";
|
|
338
|
+
export const amsCheckboxRectangleStroke = "#004699";
|
|
339
|
+
export const amsCheckboxRectangleCheckedFill = "#004699";
|
|
340
|
+
export const amsCheckboxRectangleCheckedDisabledFill = "#767676";
|
|
341
|
+
export const amsCheckboxRectangleCheckedHoverFill = "#003677";
|
|
342
|
+
export const amsCheckboxRectangleCheckedInvalidFill = "#ec0000";
|
|
343
|
+
export const amsCheckboxRectangleCheckedInvalidHoverFill = "#b70000";
|
|
344
|
+
export const amsCheckboxRectangleDisabledStroke = "#767676";
|
|
345
|
+
export const amsCheckboxRectangleHoverStroke = "#003677";
|
|
346
|
+
export const amsCheckboxRectangleIndeterminateFill = "#004699";
|
|
347
|
+
export const amsCheckboxRectangleIndeterminateDisabledFill = "#767676";
|
|
348
|
+
export const amsCheckboxRectangleIndeterminateHoverFill = "#003677";
|
|
349
|
+
export const amsCheckboxRectangleIndeterminateInvalidFill = "#ec0000";
|
|
350
|
+
export const amsCheckboxRectangleIndeterminateInvalidHoverFill = "#b70000";
|
|
351
|
+
export const amsCheckboxRectangleInvalidStroke = "#ec0000";
|
|
352
|
+
export const amsCheckboxRectangleInvalidHoverStroke = "#b70000";
|
|
371
353
|
export const amsColumnGapXSmall =
|
|
372
354
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
373
355
|
export const amsColumnGapSmall = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -375,20 +357,6 @@ export const amsColumnGapMedium = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
|
375
357
|
export const amsColumnGapLarge = "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
376
358
|
export const amsColumnGapXLarge =
|
|
377
359
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
378
|
-
export const amsDateInputDisabledCalendarPickerIndicatorBackgroundImage =
|
|
379
|
-
"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>\")";
|
|
380
|
-
export const amsDateInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
381
|
-
"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>\")";
|
|
382
|
-
export const amsDateInputDisabledColor = "#767676";
|
|
383
|
-
export const amsDateInputDisabledCursor = "not-allowed";
|
|
384
|
-
export const amsDateInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
385
|
-
"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>\")";
|
|
386
|
-
export const amsDateInputHoverBoxShadow = "0 0 0 #000000";
|
|
387
|
-
export const amsDateInputHoverCalendarPickerIndicatorBackgroundImage =
|
|
388
|
-
"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>\")";
|
|
389
|
-
export const amsDateInputCalenderPickerIndicatorBackgroundImage =
|
|
390
|
-
"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>\")";
|
|
391
|
-
export const amsDateInputCalenderPickerIndicatorCursor = "pointer";
|
|
392
360
|
export const amsDateInputBackgroundColor = "#ffffff";
|
|
393
361
|
export const amsDateInputBorderColor = "currentColor";
|
|
394
362
|
export const amsDateInputBorderStyle = "solid";
|
|
@@ -398,32 +366,41 @@ export const amsDateInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
398
366
|
export const amsDateInputFontSize =
|
|
399
367
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
400
368
|
export const amsDateInputFontWeight = "400";
|
|
401
|
-
export const amsDateInputLineHeight =
|
|
369
|
+
export const amsDateInputLineHeight = 1.4;
|
|
402
370
|
export const amsDateInputOutlineOffset = "0.25rem";
|
|
403
371
|
export const amsDateInputPaddingBlock =
|
|
404
372
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
405
373
|
export const amsDateInputPaddingInline =
|
|
406
374
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
375
|
+
export const amsDateInputDisabledColor = "#767676";
|
|
376
|
+
export const amsDateInputDisabledCursor = "not-allowed";
|
|
377
|
+
export const amsDateInputHoverBoxShadow =
|
|
378
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
379
|
+
export const amsDateInputHoverCalendarPickerIndicatorBackgroundImage =
|
|
380
|
+
"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>\")";
|
|
407
381
|
export const amsDateInputInvalidBorderColor = "#ec0000";
|
|
408
382
|
export const amsDateInputInvalidHoverBorderColor = "#b70000";
|
|
409
|
-
export const amsDateInputInvalidHoverBoxShadow =
|
|
383
|
+
export const amsDateInputInvalidHoverBoxShadow =
|
|
384
|
+
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
410
385
|
export const amsDateInputCalendarPickerIndicatorBackgroundImage =
|
|
411
386
|
"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>\")";
|
|
412
387
|
export const amsDateInputCalendarPickerIndicatorCursor = "pointer";
|
|
413
388
|
export const amsDescriptionListColor = "#202020";
|
|
414
|
-
export const amsDescriptionListColumnGap =
|
|
415
|
-
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
389
|
+
export const amsDescriptionListColumnGap = "initial";
|
|
416
390
|
export const amsDescriptionListFontFamily =
|
|
417
391
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
418
392
|
export const amsDescriptionListFontSize =
|
|
419
393
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
420
|
-
export const amsDescriptionListLineHeight =
|
|
421
|
-
export const amsDescriptionListRowGap =
|
|
422
|
-
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
394
|
+
export const amsDescriptionListLineHeight = 1.6;
|
|
395
|
+
export const amsDescriptionListRowGap = "0";
|
|
423
396
|
export const amsDescriptionListInverseColor = "#ffffff";
|
|
397
|
+
export const amsDescriptionListTermFontSize =
|
|
398
|
+
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
424
399
|
export const amsDescriptionListTermFontWeight = "800";
|
|
400
|
+
export const amsDescriptionListTermLineHeight = 1.4;
|
|
425
401
|
export const amsDescriptionListTermMarginBlockEnd =
|
|
426
402
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
403
|
+
export const amsDescriptionListTermTextWrap = "balance";
|
|
427
404
|
export const amsDescriptionListTermViMediumMarginBlockEnd =
|
|
428
405
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
429
406
|
export const amsDescriptionListDescriptionFontWeight = "400";
|
|
@@ -432,9 +409,14 @@ export const amsDescriptionListDescriptionMarginBlockEnd =
|
|
|
432
409
|
export const amsDescriptionListDescriptionPaddingInlineStart = "0";
|
|
433
410
|
export const amsDescriptionListSectionMarginBlockEnd =
|
|
434
411
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
435
|
-
export const amsDescriptionListNarrowGridTemplateColumns = "
|
|
436
|
-
export const amsDescriptionListMediumGridTemplateColumns = "
|
|
437
|
-
export const amsDescriptionListWideGridTemplateColumns = "
|
|
412
|
+
export const amsDescriptionListNarrowGridTemplateColumns = "initial";
|
|
413
|
+
export const amsDescriptionListMediumGridTemplateColumns = "initial";
|
|
414
|
+
export const amsDescriptionListWideGridTemplateColumns = "initial";
|
|
415
|
+
export const amsDescriptionListViMediumColumnGap =
|
|
416
|
+
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
417
|
+
export const amsDescriptionListViMediumNarrowGridTemplateColumns = "1fr 4fr";
|
|
418
|
+
export const amsDescriptionListViMediumMediumGridTemplateColumns = "1fr 2fr";
|
|
419
|
+
export const amsDescriptionListViMediumWideGridTemplateColumns = "1fr 1fr";
|
|
438
420
|
export const amsDialogBackgroundColor = "#ffffff";
|
|
439
421
|
export const amsDialogBorderColor = "#ffffff";
|
|
440
422
|
export const amsDialogBorderRadius = "initial";
|
|
@@ -447,9 +429,11 @@ export const amsDialogInlineSize =
|
|
|
447
429
|
export const amsDialogMaxBlockSize =
|
|
448
430
|
"calc(100dvh - 2 * clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem))";
|
|
449
431
|
export const amsDialogMaxInlineSize = "48rem";
|
|
450
|
-
export const amsDialogMediumInlineSize =
|
|
432
|
+
export const amsDialogMediumInlineSize = "initial";
|
|
433
|
+
export const amsDialogMediumMaxBlockSize = "initial";
|
|
434
|
+
export const amsDialogViMediumInlineSize =
|
|
451
435
|
"calc(100% - 2 * clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem))";
|
|
452
|
-
export const
|
|
436
|
+
export const amsDialogViMediumMaxBlockSize =
|
|
453
437
|
"calc(100dvh - 2 * clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem))";
|
|
454
438
|
export const amsDialogBackdropBackgroundColor = "rgb(24 24 24 / 62.5%)";
|
|
455
439
|
export const amsDialogHeaderGap = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
@@ -457,22 +441,27 @@ export const amsDialogHeaderPaddingBlock =
|
|
|
457
441
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem) 0";
|
|
458
442
|
export const amsDialogHeaderPaddingInline =
|
|
459
443
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
460
|
-
export const amsDialogHeaderMediumPaddingBlock =
|
|
444
|
+
export const amsDialogHeaderMediumPaddingBlock = "initial";
|
|
445
|
+
export const amsDialogHeaderMediumPaddingInline = "initial";
|
|
446
|
+
export const amsDialogHeaderViMediumPaddingBlock =
|
|
461
447
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem) 0";
|
|
462
|
-
export const
|
|
448
|
+
export const amsDialogHeaderViMediumPaddingInline =
|
|
463
449
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
464
450
|
export const amsDialogBodyPaddingBlock = "0";
|
|
465
451
|
export const amsDialogBodyPaddingInline =
|
|
466
452
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
467
|
-
export const amsDialogBodyMediumPaddingInline =
|
|
453
|
+
export const amsDialogBodyMediumPaddingInline = "initial";
|
|
454
|
+
export const amsDialogBodyViMediumPaddingInline =
|
|
468
455
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
469
456
|
export const amsDialogFooterPaddingBlock =
|
|
470
457
|
"0 clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
471
458
|
export const amsDialogFooterPaddingInline =
|
|
472
459
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
473
|
-
export const amsDialogFooterMediumPaddingBlock =
|
|
460
|
+
export const amsDialogFooterMediumPaddingBlock = "initial";
|
|
461
|
+
export const amsDialogFooterMediumPaddingInline = "initial";
|
|
462
|
+
export const amsDialogFooterViMediumPaddingBlock =
|
|
474
463
|
"0 clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
475
|
-
export const
|
|
464
|
+
export const amsDialogFooterViMediumPaddingInline =
|
|
476
465
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
477
466
|
export const amsErrorMessageColor = "#ec0000";
|
|
478
467
|
export const amsErrorMessageFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -481,18 +470,7 @@ export const amsErrorMessageFontSize =
|
|
|
481
470
|
export const amsErrorMessageFontWeight = "400";
|
|
482
471
|
export const amsErrorMessageGap =
|
|
483
472
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
484
|
-
export const amsErrorMessageLineHeight =
|
|
485
|
-
export const amsFieldSetLegendMarginBlockEnd =
|
|
486
|
-
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
487
|
-
export const amsFieldSetLegendColor = "#202020";
|
|
488
|
-
export const amsFieldSetLegendFontFamily =
|
|
489
|
-
"'Amsterdam Sans', Arial, sans-serif";
|
|
490
|
-
export const amsFieldSetLegendFontSize =
|
|
491
|
-
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
492
|
-
export const amsFieldSetLegendFontWeight = "800";
|
|
493
|
-
export const amsFieldSetLegendLineHeight = "1.3";
|
|
494
|
-
export const amsFieldSetLegendTextWrap = "balance";
|
|
495
|
-
export const amsFieldSetLegendInFieldsetFontWeight = "400";
|
|
473
|
+
export const amsErrorMessageLineHeight = 1.6;
|
|
496
474
|
export const amsFieldSetChildMarginBlockEnd =
|
|
497
475
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
498
476
|
export const amsFieldSetChildBeforeErrorMessageMarginBlockEnd =
|
|
@@ -504,6 +482,17 @@ export const amsFieldSetChildBetweenFieldsAndFieldSetsMarginBlockEnd =
|
|
|
504
482
|
export const amsFieldSetInvalidBorderInlineStart = "0.1875rem solid #ec0000";
|
|
505
483
|
export const amsFieldSetInvalidPaddingInlineStart =
|
|
506
484
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
485
|
+
export const amsFieldSetLegendMarginBlockEnd =
|
|
486
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
487
|
+
export const amsFieldSetLegendColor = "#202020";
|
|
488
|
+
export const amsFieldSetLegendFontFamily =
|
|
489
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
490
|
+
export const amsFieldSetLegendFontSize =
|
|
491
|
+
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
492
|
+
export const amsFieldSetLegendFontWeight = "800";
|
|
493
|
+
export const amsFieldSetLegendLineHeight = 1.3;
|
|
494
|
+
export const amsFieldSetLegendTextWrap = "balance";
|
|
495
|
+
export const amsFieldSetLegendInFieldsetFontWeight = "400";
|
|
507
496
|
export const amsFieldGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
508
497
|
export const amsFieldChildMarginBlockEnd =
|
|
509
498
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -517,7 +506,7 @@ export const amsFigureCaptionColor = "#202020";
|
|
|
517
506
|
export const amsFigureCaptionFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
518
507
|
export const amsFigureCaptionFontSize = "1rem";
|
|
519
508
|
export const amsFigureCaptionFontWeight = "400";
|
|
520
|
-
export const amsFigureCaptionLineHeight =
|
|
509
|
+
export const amsFigureCaptionLineHeight = 1.5;
|
|
521
510
|
export const amsFigureCaptionInverseColor = "#ffffff";
|
|
522
511
|
export const amsFileInputBackgroundColor = "#ffffff";
|
|
523
512
|
export const amsFileInputBorderColor = "currentColor";
|
|
@@ -529,7 +518,7 @@ export const amsFileInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
529
518
|
export const amsFileInputFontSize =
|
|
530
519
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
531
520
|
export const amsFileInputFontWeight = "400";
|
|
532
|
-
export const amsFileInputLineHeight =
|
|
521
|
+
export const amsFileInputLineHeight = 1.4;
|
|
533
522
|
export const amsFileInputOutlineOffset = "0.25rem";
|
|
534
523
|
export const amsFileInputPaddingBlock =
|
|
535
524
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
@@ -543,7 +532,7 @@ export const amsFileInputFileSelectorButtonBorderStyle = "solid";
|
|
|
543
532
|
export const amsFileInputFileSelectorButtonBorderWidth = "0.125rem";
|
|
544
533
|
export const amsFileInputFileSelectorButtonColor = "#004699";
|
|
545
534
|
export const amsFileInputFileSelectorButtonCursor = "pointer";
|
|
546
|
-
export const amsFileInputFileSelectorButtonLineHeight =
|
|
535
|
+
export const amsFileInputFileSelectorButtonLineHeight = 1.4;
|
|
547
536
|
export const amsFileInputFileSelectorButtonMarginInlineEnd =
|
|
548
537
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
549
538
|
export const amsFileInputFileSelectorButtonPaddingBlock =
|
|
@@ -563,10 +552,10 @@ export const amsFileListFileFontSize = "1rem";
|
|
|
563
552
|
export const amsFileListFileFontWeight = "400";
|
|
564
553
|
export const amsFileListFileGap =
|
|
565
554
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
566
|
-
export const amsFileListFileLineHeight =
|
|
555
|
+
export const amsFileListFileLineHeight = 1.5;
|
|
567
556
|
export const amsFileListFileDetailsColor = "#767676";
|
|
568
557
|
export const amsFileListFilePreviewWidth = "clamp(2.5rem, 10vw, 5rem)";
|
|
569
|
-
export const amsGridColumnCount =
|
|
558
|
+
export const amsGridColumnCount = 4;
|
|
570
559
|
export const amsGridColumnGap = "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
571
560
|
export const amsGridPaddingBlockL =
|
|
572
561
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
@@ -579,26 +568,31 @@ export const amsGridPaddingInline =
|
|
|
579
568
|
export const amsGridRowGapL = "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
580
569
|
export const amsGridRowGapXl = "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
581
570
|
export const amsGridRowGap_2xl = "clamp(3rem, 2.25rem + 3.75vw, 5.625rem)";
|
|
582
|
-
export const amsGridMediumColumnCount = "
|
|
583
|
-
export const amsGridMediumPaddingInline =
|
|
571
|
+
export const amsGridMediumColumnCount = "initial";
|
|
572
|
+
export const amsGridMediumPaddingInline = "initial";
|
|
573
|
+
export const amsGridWideColumnCount = "initial";
|
|
574
|
+
export const amsGridWidePaddingInline = "initial";
|
|
575
|
+
export const amsGridViMediumColumnCount = 8;
|
|
576
|
+
export const amsGridViMediumPaddingInline =
|
|
584
577
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
585
|
-
export const
|
|
586
|
-
export const
|
|
578
|
+
export const amsGridViWideColumnCount = 12;
|
|
579
|
+
export const amsGridViWidePaddingInline =
|
|
587
580
|
"clamp(3rem, 2.25rem + 3.75vw, 5.625rem)";
|
|
581
|
+
export const amsGridCellBackgroundColor = "initial";
|
|
582
|
+
export const amsGridCellPaddingBlock = "initial";
|
|
583
|
+
export const amsGridCellPaddingInline = "initial";
|
|
588
584
|
export const amsHeading_1FontSize = "clamp(2rem, 1.7143rem + 1.4286vw, 3rem)";
|
|
589
|
-
export const amsHeading_1LineHeight =
|
|
585
|
+
export const amsHeading_1LineHeight = 1.2;
|
|
590
586
|
export const amsHeading_2FontSize = "clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)";
|
|
591
|
-
export const amsHeading_2LineHeight =
|
|
587
|
+
export const amsHeading_2LineHeight = 1.3;
|
|
592
588
|
export const amsHeading_3FontSize =
|
|
593
589
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
594
|
-
export const amsHeading_3LineHeight =
|
|
590
|
+
export const amsHeading_3LineHeight = 1.3;
|
|
595
591
|
export const amsHeading_4FontSize =
|
|
596
592
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
597
|
-
export const amsHeading_4LineHeight =
|
|
593
|
+
export const amsHeading_4LineHeight = 1.4;
|
|
598
594
|
export const amsHeading_5FontSize = "1rem";
|
|
599
|
-
export const amsHeading_5LineHeight =
|
|
600
|
-
export const amsHeading_6FontSize = "1rem";
|
|
601
|
-
export const amsHeading_6LineHeight = "1.4";
|
|
595
|
+
export const amsHeading_5LineHeight = 1.4;
|
|
602
596
|
export const amsHeadingColor = "#202020";
|
|
603
597
|
export const amsHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
604
598
|
export const amsHeadingFontWeight = "800";
|
|
@@ -623,32 +617,27 @@ export const amsIconButtonInverseHoverBackgroundColor = "#003677";
|
|
|
623
617
|
export const amsIconButtonInverseHoverColor = "#ffffff";
|
|
624
618
|
export const amsIconButtonInverseDisabledColor = "#ffffff";
|
|
625
619
|
export const amsIconButtonInverseDisabledBackgroundColor = "#767676";
|
|
626
|
-
export const amsIconHeading_0FontSize =
|
|
627
|
-
"clamp(2.435rem, 2.0409rem + 1.9709vw, 3.8147rem)";
|
|
628
|
-
export const amsIconHeading_0LineHeight = "1.1";
|
|
629
620
|
export const amsIconFontSize = "clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
630
|
-
export const amsIconLineHeight =
|
|
621
|
+
export const amsIconLineHeight = 1.6;
|
|
631
622
|
export const amsIconSmallFontSize = "1rem";
|
|
632
|
-
export const amsIconSmallLineHeight =
|
|
623
|
+
export const amsIconSmallLineHeight = 1.5;
|
|
633
624
|
export const amsIconLargeFontSize =
|
|
634
625
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
635
|
-
export const amsIconLargeLineHeight =
|
|
626
|
+
export const amsIconLargeLineHeight = 1.5;
|
|
636
627
|
export const amsIconHeading_1FontSize =
|
|
637
628
|
"clamp(2rem, 1.7143rem + 1.4286vw, 3rem)";
|
|
638
|
-
export const amsIconHeading_1LineHeight =
|
|
629
|
+
export const amsIconHeading_1LineHeight = 1.2;
|
|
639
630
|
export const amsIconHeading_2FontSize =
|
|
640
631
|
"clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)";
|
|
641
|
-
export const amsIconHeading_2LineHeight =
|
|
632
|
+
export const amsIconHeading_2LineHeight = 1.3;
|
|
642
633
|
export const amsIconHeading_3FontSize =
|
|
643
634
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
644
|
-
export const amsIconHeading_3LineHeight =
|
|
635
|
+
export const amsIconHeading_3LineHeight = 1.3;
|
|
645
636
|
export const amsIconHeading_4FontSize =
|
|
646
637
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
647
|
-
export const amsIconHeading_4LineHeight =
|
|
638
|
+
export const amsIconHeading_4LineHeight = 1.4;
|
|
648
639
|
export const amsIconHeading_5FontSize = "1rem";
|
|
649
|
-
export const amsIconHeading_5LineHeight =
|
|
650
|
-
export const amsIconHeading_6FontSize = "1rem";
|
|
651
|
-
export const amsIconHeading_6LineHeight = "1.4";
|
|
640
|
+
export const amsIconHeading_5LineHeight = 1.4;
|
|
652
641
|
export const amsIconInverseColor = "#ffffff";
|
|
653
642
|
export const amsImageSliderGap =
|
|
654
643
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -672,7 +661,7 @@ export const amsLabelFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
672
661
|
export const amsLabelFontSize =
|
|
673
662
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
674
663
|
export const amsLabelFontWeight = "800";
|
|
675
|
-
export const amsLabelLineHeight =
|
|
664
|
+
export const amsLabelLineHeight = 1.3;
|
|
676
665
|
export const amsLabelTextWrap = "balance";
|
|
677
666
|
export const amsLabelInFieldsetFontWeight = "400";
|
|
678
667
|
export const amsLinkListGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -683,16 +672,16 @@ export const amsLinkListLinkFontSize =
|
|
|
683
672
|
export const amsLinkListLinkFontWeight = "400";
|
|
684
673
|
export const amsLinkListLinkGap =
|
|
685
674
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
686
|
-
export const amsLinkListLinkLineHeight =
|
|
675
|
+
export const amsLinkListLinkLineHeight = 1.6;
|
|
687
676
|
export const amsLinkListLinkOutlineOffset = "0.25rem";
|
|
688
677
|
export const amsLinkListLinkTextDecorationLine = "none";
|
|
689
678
|
export const amsLinkListLinkTextDecorationThickness = "0.125rem";
|
|
690
679
|
export const amsLinkListLinkTextUnderlineOffset = "0.15625rem";
|
|
691
680
|
export const amsLinkListLinkSmallFontSize = "1rem";
|
|
692
|
-
export const amsLinkListLinkSmallLineHeight =
|
|
681
|
+
export const amsLinkListLinkSmallLineHeight = 1.5;
|
|
693
682
|
export const amsLinkListLinkLargeFontSize =
|
|
694
683
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
695
|
-
export const amsLinkListLinkLargeLineHeight =
|
|
684
|
+
export const amsLinkListLinkLargeLineHeight = 1.5;
|
|
696
685
|
export const amsLinkListLinkHoverColor = "#003677";
|
|
697
686
|
export const amsLinkListLinkHoverTextDecorationLine = "underline";
|
|
698
687
|
export const amsLinkListLinkContrastColor = "#202020";
|
|
@@ -720,10 +709,20 @@ export const amsLogoEmblemColor = "#ec0000";
|
|
|
720
709
|
export const amsLogoSubsiteColor = "#202020";
|
|
721
710
|
export const amsLogoTitleColor = "#ec0000";
|
|
722
711
|
export const amsMarkBackgroundColor = "#ffe600";
|
|
723
|
-
export const
|
|
724
|
-
export const
|
|
725
|
-
export const
|
|
726
|
-
export const
|
|
712
|
+
export const amsMenuBackgroundColor = "#004699";
|
|
713
|
+
export const amsMenuFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
714
|
+
export const amsMenuFontSize = "clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
715
|
+
export const amsMenuFontWeight = "400";
|
|
716
|
+
export const amsMenuLineHeight = 1.6;
|
|
717
|
+
export const amsMenuPaddingBlock = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
718
|
+
export const amsMenuWideMaxInlineSize = "initial";
|
|
719
|
+
export const amsMenuWidePaddingBlock = "initial";
|
|
720
|
+
export const amsMenuWidePaddingInline = "initial";
|
|
721
|
+
export const amsMenuViWideMaxInlineSize = "8rem";
|
|
722
|
+
export const amsMenuViWidePaddingBlock =
|
|
723
|
+
"calc(clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem) + 2 * clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)) clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
724
|
+
export const amsMenuViWidePaddingInline =
|
|
725
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
727
726
|
export const amsMenuLinkColor = "#ffffff";
|
|
728
727
|
export const amsMenuLinkGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
729
728
|
export const amsMenuLinkOutlineOffset = "0.25rem";
|
|
@@ -736,19 +735,9 @@ export const amsMenuLinkTextDecorationThickness = "0.125rem";
|
|
|
736
735
|
export const amsMenuLinkTextUnderlineOffset = "0.15625rem";
|
|
737
736
|
export const amsMenuLinkHoverColor = "#ffffff";
|
|
738
737
|
export const amsMenuLinkHoverTextDecorationLine = "underline";
|
|
739
|
-
export const amsMenuLinkWideGap =
|
|
738
|
+
export const amsMenuLinkWideGap = "initial";
|
|
739
|
+
export const amsMenuLinkViWideGap =
|
|
740
740
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
741
|
-
export const amsMenuBackgroundColor = "#004699";
|
|
742
|
-
export const amsMenuFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
743
|
-
export const amsMenuFontSize = "clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
744
|
-
export const amsMenuFontWeight = "400";
|
|
745
|
-
export const amsMenuLineHeight = "1.8";
|
|
746
|
-
export const amsMenuPaddingBlock = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
747
|
-
export const amsMenuWideMaxInlineSize = "8rem";
|
|
748
|
-
export const amsMenuWidePaddingBlock =
|
|
749
|
-
"calc(clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem) + 2 * clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)) clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
750
|
-
export const amsMenuWidePaddingInline =
|
|
751
|
-
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
752
741
|
export const amsMenuListGap = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
753
742
|
export const amsOrderedListColor = "#202020";
|
|
754
743
|
export const amsOrderedListFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
@@ -756,10 +745,10 @@ export const amsOrderedListFontSize =
|
|
|
756
745
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
757
746
|
export const amsOrderedListFontWeight = "400";
|
|
758
747
|
export const amsOrderedListGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
759
|
-
export const amsOrderedListLineHeight =
|
|
748
|
+
export const amsOrderedListLineHeight = 1.6;
|
|
760
749
|
export const amsOrderedListListStyleType = "decimal";
|
|
761
750
|
export const amsOrderedListSmallFontSize = "1rem";
|
|
762
|
-
export const amsOrderedListSmallLineHeight =
|
|
751
|
+
export const amsOrderedListSmallLineHeight = 1.5;
|
|
763
752
|
export const amsOrderedListInverseColor = "#ffffff";
|
|
764
753
|
export const amsOrderedListItemMarginInlineStart = "2.25rem";
|
|
765
754
|
export const amsOrderedListItemPaddingInlineStart = "0.25rem";
|
|
@@ -772,6 +761,7 @@ export const amsOrderedListOrderedListPaddingBlockStart =
|
|
|
772
761
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
773
762
|
export const amsOrderedListOrderedListItemMarginInlineStart = "1.5rem";
|
|
774
763
|
export const amsOrderedListOrderedListItemPaddingInlineStart = "0.25rem";
|
|
764
|
+
export const amsPageFooterMenuBackgroundColor = "#ffffff";
|
|
775
765
|
export const amsPageFooterMenuColumnGap =
|
|
776
766
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
777
767
|
export const amsPageFooterMenuPaddingBlock =
|
|
@@ -780,9 +770,11 @@ export const amsPageFooterMenuPaddingInline =
|
|
|
780
770
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
781
771
|
export const amsPageFooterMenuRowGap =
|
|
782
772
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
783
|
-
export const amsPageFooterMenuMediumPaddingInline =
|
|
773
|
+
export const amsPageFooterMenuMediumPaddingInline = "initial";
|
|
774
|
+
export const amsPageFooterMenuWidePaddingInline = "initial";
|
|
775
|
+
export const amsPageFooterMenuViMediumPaddingInline =
|
|
784
776
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
785
|
-
export const
|
|
777
|
+
export const amsPageFooterMenuViWidePaddingInline =
|
|
786
778
|
"clamp(3rem, 2.25rem + 3.75vw, 5.625rem)";
|
|
787
779
|
export const amsPageFooterMenuLinkColor = "#004699";
|
|
788
780
|
export const amsPageFooterMenuLinkFontFamily =
|
|
@@ -790,7 +782,7 @@ export const amsPageFooterMenuLinkFontFamily =
|
|
|
790
782
|
export const amsPageFooterMenuLinkFontSize =
|
|
791
783
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
792
784
|
export const amsPageFooterMenuLinkFontWeight = "400";
|
|
793
|
-
export const amsPageFooterMenuLinkLineHeight =
|
|
785
|
+
export const amsPageFooterMenuLinkLineHeight = 1.6;
|
|
794
786
|
export const amsPageFooterMenuLinkOutlineOffset = "0.25rem";
|
|
795
787
|
export const amsPageFooterMenuLinkTextDecorationLine = "none";
|
|
796
788
|
export const amsPageFooterMenuLinkTextDecorationThickness = "0.125rem";
|
|
@@ -798,14 +790,17 @@ export const amsPageFooterMenuLinkTextUnderlineOffset = "0.15625rem";
|
|
|
798
790
|
export const amsPageFooterMenuLinkHoverColor = "#003677";
|
|
799
791
|
export const amsPageFooterMenuLinkHoverTextDecorationLine = "underline";
|
|
800
792
|
export const amsPageFooterSpotlightBackgroundColor = "#004699";
|
|
793
|
+
export const amsPageHeaderBackgroundColor = "#ffffff";
|
|
801
794
|
export const amsPageHeaderFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
802
795
|
export const amsPageHeaderPaddingBlock =
|
|
803
796
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
804
797
|
export const amsPageHeaderPaddingInline =
|
|
805
798
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
806
|
-
export const amsPageHeaderMediumPaddingInline =
|
|
799
|
+
export const amsPageHeaderMediumPaddingInline = "initial";
|
|
800
|
+
export const amsPageHeaderWidePaddingInline = "initial";
|
|
801
|
+
export const amsPageHeaderViMediumPaddingInline =
|
|
807
802
|
"clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)";
|
|
808
|
-
export const
|
|
803
|
+
export const amsPageHeaderViWidePaddingInline =
|
|
809
804
|
"clamp(3rem, 2.25rem + 3.75vw, 5.625rem)";
|
|
810
805
|
export const amsPageHeaderLogoLinkColumnGap =
|
|
811
806
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
@@ -814,14 +809,14 @@ export const amsPageHeaderBrandNameColor = "#202020";
|
|
|
814
809
|
export const amsPageHeaderBrandNameFontSize =
|
|
815
810
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
816
811
|
export const amsPageHeaderBrandNameFontWeight = "800";
|
|
817
|
-
export const amsPageHeaderBrandNameLineHeight =
|
|
812
|
+
export const amsPageHeaderBrandNameLineHeight = 1.3;
|
|
818
813
|
export const amsPageHeaderBrandNameTextWrap = "balance";
|
|
819
814
|
export const amsPageHeaderMegaMenuPaddingBlock =
|
|
820
815
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
821
816
|
export const amsPageHeaderMegaMenuButtonBackgroundColor = "#004699";
|
|
822
817
|
export const amsPageHeaderMegaMenuButtonColor = "#ffffff";
|
|
823
818
|
export const amsPageHeaderMegaMenuButtonCursor = "pointer";
|
|
824
|
-
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "
|
|
819
|
+
export const amsPageHeaderMegaMenuButtonLabelOpenFontWeight = "400";
|
|
825
820
|
export const amsPageHeaderMegaMenuButtonPaddingInline =
|
|
826
821
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
827
822
|
export const amsPageHeaderMegaMenuButtonHoverBackgroundColor = "#003677";
|
|
@@ -838,7 +833,7 @@ export const amsPageHeaderMenuItemFontFamily =
|
|
|
838
833
|
export const amsPageHeaderMenuItemFontSize =
|
|
839
834
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
840
835
|
export const amsPageHeaderMenuItemFontWeight = "400";
|
|
841
|
-
export const amsPageHeaderMenuItemLineHeight =
|
|
836
|
+
export const amsPageHeaderMenuItemLineHeight = 1.6;
|
|
842
837
|
export const amsPageHeaderMenuItemOutlineOffset = "0.25rem";
|
|
843
838
|
export const amsPageHeaderMenuItemPaddingBlock =
|
|
844
839
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -854,14 +849,6 @@ export const amsPageHeaderNavigationColumnGap =
|
|
|
854
849
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
855
850
|
export const amsPageHeaderNavigationRowGap =
|
|
856
851
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
857
|
-
export const amsPageHeadingColor = "#202020";
|
|
858
|
-
export const amsPageHeadingFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
859
|
-
export const amsPageHeadingFontSize =
|
|
860
|
-
"clamp(2.435rem, 2.0409rem + 1.9709vw, 3.8147rem)";
|
|
861
|
-
export const amsPageHeadingFontWeight = "800";
|
|
862
|
-
export const amsPageHeadingLineHeight = "1.1";
|
|
863
|
-
export const amsPageHeadingTextWrap = "balance";
|
|
864
|
-
export const amsPageHeadingInverseColor = "#ffffff";
|
|
865
852
|
export const amsPageBackgroundColor = "#ffffff";
|
|
866
853
|
export const amsPageMaxInlineSize = "90rem";
|
|
867
854
|
export const amsPageWithMenuMaxInlineSize = "120rem";
|
|
@@ -871,7 +858,7 @@ export const amsPaginationFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
871
858
|
export const amsPaginationFontSize =
|
|
872
859
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
873
860
|
export const amsPaginationFontWeight = "400";
|
|
874
|
-
export const amsPaginationLineHeight =
|
|
861
|
+
export const amsPaginationLineHeight = 1.6;
|
|
875
862
|
export const amsPaginationLinkColor = "#004699";
|
|
876
863
|
export const amsPaginationLinkGap =
|
|
877
864
|
"clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -889,13 +876,13 @@ export const amsParagraphFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
889
876
|
export const amsParagraphFontSize =
|
|
890
877
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
891
878
|
export const amsParagraphFontWeight = "400";
|
|
892
|
-
export const amsParagraphLineHeight =
|
|
879
|
+
export const amsParagraphLineHeight = 1.6;
|
|
893
880
|
export const amsParagraphInverseColor = "#ffffff";
|
|
894
881
|
export const amsParagraphSmallFontSize = "1rem";
|
|
895
|
-
export const amsParagraphSmallLineHeight =
|
|
882
|
+
export const amsParagraphSmallLineHeight = 1.5;
|
|
896
883
|
export const amsParagraphLargeFontSize =
|
|
897
884
|
"clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)";
|
|
898
|
-
export const amsParagraphLargeLineHeight =
|
|
885
|
+
export const amsParagraphLargeLineHeight = 1.5;
|
|
899
886
|
export const amsParagraphLargeTextWrap = "balance";
|
|
900
887
|
export const amsPasswordInputBackgroundColor = "#ffffff";
|
|
901
888
|
export const amsPasswordInputBorderColor = "currentColor";
|
|
@@ -906,7 +893,7 @@ export const amsPasswordInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
906
893
|
export const amsPasswordInputFontSize =
|
|
907
894
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
908
895
|
export const amsPasswordInputFontWeight = "400";
|
|
909
|
-
export const amsPasswordInputLineHeight =
|
|
896
|
+
export const amsPasswordInputLineHeight = 1.4;
|
|
910
897
|
export const amsPasswordInputOutlineOffset = "0.25rem";
|
|
911
898
|
export const amsPasswordInputPaddingBlock =
|
|
912
899
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -914,10 +901,12 @@ export const amsPasswordInputPaddingInline =
|
|
|
914
901
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
915
902
|
export const amsPasswordInputDisabledColor = "#767676";
|
|
916
903
|
export const amsPasswordInputDisabledCursor = "not-allowed";
|
|
917
|
-
export const amsPasswordInputHoverBoxShadow =
|
|
904
|
+
export const amsPasswordInputHoverBoxShadow =
|
|
905
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
918
906
|
export const amsPasswordInputInvalidBorderColor = "#ec0000";
|
|
919
907
|
export const amsPasswordInputInvalidHoverBorderColor = "#b70000";
|
|
920
|
-
export const amsPasswordInputInvalidHoverBoxShadow =
|
|
908
|
+
export const amsPasswordInputInvalidHoverBoxShadow =
|
|
909
|
+
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
921
910
|
export const amsPasswordInputPlaceholderColor = "#767676";
|
|
922
911
|
export const amsProgressListHeading_2StepMarkerBlockSize =
|
|
923
912
|
"calc(clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem) * 1.3)";
|
|
@@ -931,9 +920,20 @@ export const amsProgressListHeading_4StepMarkerBlockSize =
|
|
|
931
920
|
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.4)";
|
|
932
921
|
export const amsProgressListHeading_4StepMarkerMarginBlockStart =
|
|
933
922
|
"calc((1.4 * clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)) / 2)";
|
|
923
|
+
export const amsProgressListButtonColor = "#004699";
|
|
924
|
+
export const amsProgressListButtonCursor = "pointer";
|
|
925
|
+
export const amsProgressListButtonGap =
|
|
926
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
927
|
+
export const amsProgressListButtonOutlineOffset = "0.25rem";
|
|
928
|
+
export const amsProgressListButtonPaddingBlock = "0";
|
|
929
|
+
export const amsProgressListButtonPaddingInline = "0";
|
|
930
|
+
export const amsProgressListButtonHoverColor = "#003677";
|
|
931
|
+
export const amsProgressListIconTransitionDuration = "0.3s";
|
|
932
|
+
export const amsProgressListIconTransitionTimingFunction = "ease";
|
|
934
933
|
export const amsProgressListStepGap =
|
|
935
934
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
936
|
-
export const amsProgressListStepMediumGap =
|
|
935
|
+
export const amsProgressListStepMediumGap = "initial";
|
|
936
|
+
export const amsProgressListStepViMediumGap =
|
|
937
937
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
938
938
|
export const amsProgressListStepMarkerShapeBlockSize = "1.5rem";
|
|
939
939
|
export const amsProgressListStepMarkerShapeBackgroundColor = "#ffffff";
|
|
@@ -962,9 +962,11 @@ export const amsProgressListSubstepsPaddingBlockStart =
|
|
|
962
962
|
export const amsProgressListSubstepsStepIndicatorMarginInlineEnd =
|
|
963
963
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
964
964
|
export const amsProgressListSubstepsStepIndicatorMediumMarginInlineEnd =
|
|
965
|
+
"initial";
|
|
966
|
+
export const amsProgressListSubstepsStepIndicatorViMediumMarginInlineEnd =
|
|
965
967
|
"clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)";
|
|
966
968
|
export const amsProgressListSubstepsStepMarkerBlockSize =
|
|
967
|
-
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.
|
|
969
|
+
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.6)";
|
|
968
970
|
export const amsProgressListSubstepsStepMarkerInlineSize = "1.5rem";
|
|
969
971
|
export const amsProgressListSubstepsStepMarkerShapeBlockSize = "0.75rem";
|
|
970
972
|
export const amsProgressListSubstepsStepMarkerShapeBackgroundColor = "#ffffff";
|
|
@@ -979,7 +981,7 @@ export const amsProgressListSubstepsStepConnectorBorderInlineColor = "#767676";
|
|
|
979
981
|
export const amsProgressListSubstepsStepConnectorBorderInlineStyle = "dashed";
|
|
980
982
|
export const amsProgressListSubstepsStepConnectorBorderInlineWidth = "1px";
|
|
981
983
|
export const amsProgressListSubstepsStepConnectorMarginBlockStart =
|
|
982
|
-
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.
|
|
984
|
+
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.6 / 2)";
|
|
983
985
|
export const amsProgressListSubstepsStepConnectorLastChildBorderInlineColor =
|
|
984
986
|
"#ffffff";
|
|
985
987
|
export const amsProgressListSubstepsStepContentMarginBlockEnd =
|
|
@@ -1005,7 +1007,7 @@ export const amsRadioFontSize =
|
|
|
1005
1007
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1006
1008
|
export const amsRadioFontWeight = "400";
|
|
1007
1009
|
export const amsRadioGap = "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1008
|
-
export const amsRadioLineHeight =
|
|
1010
|
+
export const amsRadioLineHeight = 1.6;
|
|
1009
1011
|
export const amsRadioOutlineOffset = "0.25rem";
|
|
1010
1012
|
export const amsRadioTextDecorationThickness = "0.125rem";
|
|
1011
1013
|
export const amsRadioTextUnderlineOffset = "0.15625rem";
|
|
@@ -1031,7 +1033,7 @@ export const amsRadioDisabledCursor = "not-allowed";
|
|
|
1031
1033
|
export const amsRadioHoverColor = "#003677";
|
|
1032
1034
|
export const amsRadioHoverTextDecorationLine = "underline";
|
|
1033
1035
|
export const amsRadioIconContainerBlockSize =
|
|
1034
|
-
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.
|
|
1036
|
+
"calc(clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem) * 1.6)";
|
|
1035
1037
|
export const amsRadioIconContainerInlineSize =
|
|
1036
1038
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1037
1039
|
export const amsRowGapXSmall = "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
|
|
@@ -1049,16 +1051,18 @@ export const amsSearchFieldInputFontFamily =
|
|
|
1049
1051
|
export const amsSearchFieldInputFontSize =
|
|
1050
1052
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1051
1053
|
export const amsSearchFieldInputFontWeight = "400";
|
|
1052
|
-
export const amsSearchFieldInputLineHeight =
|
|
1054
|
+
export const amsSearchFieldInputLineHeight = 1.4;
|
|
1053
1055
|
export const amsSearchFieldInputOutlineOffset = "0.25rem";
|
|
1054
1056
|
export const amsSearchFieldInputPaddingBlock =
|
|
1055
1057
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1056
1058
|
export const amsSearchFieldInputPaddingInline =
|
|
1057
1059
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1058
|
-
export const amsSearchFieldInputHoverBoxShadow =
|
|
1060
|
+
export const amsSearchFieldInputHoverBoxShadow =
|
|
1061
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
1059
1062
|
export const amsSearchFieldInputInvalidBorderColor = "#ec0000";
|
|
1060
1063
|
export const amsSearchFieldInputInvalidHoverBorderColor = "#b70000";
|
|
1061
|
-
export const amsSearchFieldInputInvalidHoverBoxShadow =
|
|
1064
|
+
export const amsSearchFieldInputInvalidHoverBoxShadow =
|
|
1065
|
+
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
1062
1066
|
export const amsSearchFieldInputCancelButtonBackgroundImage =
|
|
1063
1067
|
"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='M29.333 5.47 26.53 2.668 16 13.187 5.47 2.666 2.668 5.47 13.187 16 2.666 26.53l2.804 2.803L16 18.813l10.53 10.52 2.803-2.804L18.813 16z'/></svg>\")";
|
|
1064
1068
|
export const amsSearchFieldInputCancelButtonBlockSize =
|
|
@@ -1081,7 +1085,7 @@ export const amsSelectFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1081
1085
|
export const amsSelectFontSize =
|
|
1082
1086
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1083
1087
|
export const amsSelectFontWeight = "400";
|
|
1084
|
-
export const amsSelectLineHeight =
|
|
1088
|
+
export const amsSelectLineHeight = 1.4;
|
|
1085
1089
|
export const amsSelectOutlineOffset = "0.25rem";
|
|
1086
1090
|
export const amsSelectPaddingBlock =
|
|
1087
1091
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1106,7 +1110,7 @@ export const amsSkipLinkFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1106
1110
|
export const amsSkipLinkFontSize =
|
|
1107
1111
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1108
1112
|
export const amsSkipLinkFontWeight = "400";
|
|
1109
|
-
export const amsSkipLinkLineHeight =
|
|
1113
|
+
export const amsSkipLinkLineHeight = 1.6;
|
|
1110
1114
|
export const amsSkipLinkOutlineOffset = "0.25rem";
|
|
1111
1115
|
export const amsSkipLinkPaddingBlock =
|
|
1112
1116
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1120,13 +1124,6 @@ export const amsSpotlightLimeBackgroundColor = "#bed200";
|
|
|
1120
1124
|
export const amsSpotlightMagentaBackgroundColor = "#e50082";
|
|
1121
1125
|
export const amsSpotlightOrangeBackgroundColor = "#ff9100";
|
|
1122
1126
|
export const amsSpotlightYellowBackgroundColor = "#ffe600";
|
|
1123
|
-
export const amsStandaloneLinkHoverTextDecorationThickness = "0.1875rem";
|
|
1124
|
-
export const amsStandaloneLinkHoverTextUnderlineOffset = "0.09375rem";
|
|
1125
|
-
export const amsStandaloneLinkHoverColor = "#003677";
|
|
1126
|
-
export const amsStandaloneLinkHoverTextDecorationLine = "underline";
|
|
1127
|
-
export const amsStandaloneLinkWithIconTextDecorationLine = "none";
|
|
1128
|
-
export const amsStandaloneLinkWithIconTextDecorationThickness = "0.125rem";
|
|
1129
|
-
export const amsStandaloneLinkWithIconHoverTextDecorationLine = "underline";
|
|
1130
1127
|
export const amsStandaloneLinkColor = "#004699";
|
|
1131
1128
|
export const amsStandaloneLinkColumnGap =
|
|
1132
1129
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1135,11 +1132,13 @@ export const amsStandaloneLinkFontFamily =
|
|
|
1135
1132
|
export const amsStandaloneLinkFontSize =
|
|
1136
1133
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1137
1134
|
export const amsStandaloneLinkFontWeight = "400";
|
|
1138
|
-
export const amsStandaloneLinkLineHeight =
|
|
1135
|
+
export const amsStandaloneLinkLineHeight = 1.6;
|
|
1139
1136
|
export const amsStandaloneLinkOutlineOffset = "0.25rem";
|
|
1140
1137
|
export const amsStandaloneLinkTextDecorationLine = "none";
|
|
1141
1138
|
export const amsStandaloneLinkTextDecorationThickness = "0.125rem";
|
|
1142
1139
|
export const amsStandaloneLinkTextUnderlineOffset = "0.15625rem";
|
|
1140
|
+
export const amsStandaloneLinkHoverColor = "#003677";
|
|
1141
|
+
export const amsStandaloneLinkHoverTextDecorationLine = "underline";
|
|
1143
1142
|
export const amsStandaloneLinkContrastColor = "#202020";
|
|
1144
1143
|
export const amsStandaloneLinkContrastHoverColor = "#202020";
|
|
1145
1144
|
export const amsStandaloneLinkInverseColor = "#ffffff";
|
|
@@ -1151,15 +1150,40 @@ export const amsSwitchInlineSize = "3.5rem";
|
|
|
1151
1150
|
export const amsSwitchThumbBackgroundColor = "#ffffff";
|
|
1152
1151
|
export const amsSwitchThumbBlockSize = "1.75rem";
|
|
1153
1152
|
export const amsSwitchThumbInlineSize = "1.75rem";
|
|
1154
|
-
export const amsSwitchThumbHoverBoxShadow = "
|
|
1153
|
+
export const amsSwitchThumbHoverBoxShadow = "0rem 0rem 0rem 0.125rem #003677";
|
|
1155
1154
|
export const amsSwitchThumbHoverColor = "#003677";
|
|
1156
1155
|
export const amsSwitchCheckedBackgroundColor = "#004699";
|
|
1157
1156
|
export const amsSwitchDisabledBackgroundColor = "#767676";
|
|
1158
1157
|
export const amsSwitchDisabledCursor = "not-allowed";
|
|
1159
|
-
export const
|
|
1160
|
-
|
|
1158
|
+
export const amsTabNavigationListBoxShadow =
|
|
1159
|
+
"inset 0rem -0.125rem 0rem 0rem #d1d1d1";
|
|
1160
|
+
export const amsTabNavigationListVerticalBoxShadow =
|
|
1161
|
+
"inset -0.125rem 0rem 0rem 0rem #d1d1d1";
|
|
1162
|
+
export const amsTabNavigationLinkGap =
|
|
1163
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1164
|
+
export const amsTabNavigationLinkColor = "#004699";
|
|
1165
|
+
export const amsTabNavigationLinkCursor = "pointer";
|
|
1166
|
+
export const amsTabNavigationLinkFontFamily =
|
|
1167
|
+
"'Amsterdam Sans', Arial, sans-serif";
|
|
1168
|
+
export const amsTabNavigationLinkFontSize =
|
|
1161
1169
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1162
|
-
export const
|
|
1170
|
+
export const amsTabNavigationLinkFontWeight = "400";
|
|
1171
|
+
export const amsTabNavigationLinkLineHeight = 1.6;
|
|
1172
|
+
export const amsTabNavigationLinkOutlineOffset = "calc(0.25rem * -1)";
|
|
1173
|
+
export const amsTabNavigationLinkPaddingBlock =
|
|
1174
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1175
|
+
export const amsTabNavigationLinkPaddingInline =
|
|
1176
|
+
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1177
|
+
export const amsTabNavigationLinkHoverBoxShadow =
|
|
1178
|
+
"inset 0rem -0.125rem 0rem 0rem currentColor";
|
|
1179
|
+
export const amsTabNavigationLinkHoverColor = "#003677";
|
|
1180
|
+
export const amsTabNavigationLinkCurrentBoxShadow =
|
|
1181
|
+
"inset 0rem -0.25rem 0rem 0rem currentColor";
|
|
1182
|
+
export const amsTabNavigationLinkCurrentFontWeight = "800";
|
|
1183
|
+
export const amsTabNavigationLinkVerticalHoverBoxShadow =
|
|
1184
|
+
"inset -0.125rem 0rem 0rem 0rem currentColor";
|
|
1185
|
+
export const amsTabNavigationLinkVerticalCurrentBoxShadow =
|
|
1186
|
+
"inset -0.25rem 0rem 0rem 0rem currentColor";
|
|
1163
1187
|
export const amsTableOfContentsFontFamily =
|
|
1164
1188
|
"'Amsterdam Sans', Arial, sans-serif";
|
|
1165
1189
|
export const amsTableOfContentsFontSize =
|
|
@@ -1167,7 +1191,7 @@ export const amsTableOfContentsFontSize =
|
|
|
1167
1191
|
export const amsTableOfContentsFontWeight = "400";
|
|
1168
1192
|
export const amsTableOfContentsGap =
|
|
1169
1193
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1170
|
-
export const amsTableOfContentsLineHeight =
|
|
1194
|
+
export const amsTableOfContentsLineHeight = 1.6;
|
|
1171
1195
|
export const amsTableOfContentsLinkColor = "#004699";
|
|
1172
1196
|
export const amsTableOfContentsLinkOutlineOffset = "0.25rem";
|
|
1173
1197
|
export const amsTableOfContentsLinkTextDecorationLine = "none";
|
|
@@ -1186,8 +1210,10 @@ export const amsTableFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1186
1210
|
export const amsTableFontSize =
|
|
1187
1211
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1188
1212
|
export const amsTableFontWeight = "400";
|
|
1189
|
-
export const amsTableLineHeight =
|
|
1213
|
+
export const amsTableLineHeight = 1.6;
|
|
1190
1214
|
export const amsTableCaptionFontWeight = "800";
|
|
1215
|
+
export const amsTableCaptionMarginBlockEnd =
|
|
1216
|
+
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1191
1217
|
export const amsTableCellBorderBlockEnd = "0.0625rem solid #d1d1d1";
|
|
1192
1218
|
export const amsTableCellPaddingBlock =
|
|
1193
1219
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1195,25 +1221,24 @@ export const amsTableCellPaddingInline =
|
|
|
1195
1221
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1196
1222
|
export const amsTableHeaderCellFontWeight = "800";
|
|
1197
1223
|
export const amsTabsGap = "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1198
|
-
export const amsTabsListBoxShadow =
|
|
1199
|
-
"inset 0rem calc(0.125rem * -1) 0rem 0rem #d1d1d1";
|
|
1224
|
+
export const amsTabsListBoxShadow = "inset 0rem -0.125rem 0rem 0rem #d1d1d1";
|
|
1200
1225
|
export const amsTabsButtonColor = "#004699";
|
|
1201
1226
|
export const amsTabsButtonCursor = "pointer";
|
|
1202
1227
|
export const amsTabsButtonFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
1203
1228
|
export const amsTabsButtonFontSize =
|
|
1204
1229
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1205
1230
|
export const amsTabsButtonFontWeight = "400";
|
|
1206
|
-
export const amsTabsButtonLineHeight =
|
|
1231
|
+
export const amsTabsButtonLineHeight = 1.6;
|
|
1207
1232
|
export const amsTabsButtonOutlineOffset = "calc(0.25rem * -1)";
|
|
1208
1233
|
export const amsTabsButtonPaddingBlock =
|
|
1209
1234
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1210
1235
|
export const amsTabsButtonPaddingInline =
|
|
1211
1236
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1212
1237
|
export const amsTabsButtonHoverBoxShadow =
|
|
1213
|
-
"inset 0rem
|
|
1238
|
+
"inset 0rem -0.125rem 0rem 0rem currentColor";
|
|
1214
1239
|
export const amsTabsButtonHoverColor = "#003677";
|
|
1215
1240
|
export const amsTabsButtonSelectedBoxShadow =
|
|
1216
|
-
"inset 0rem
|
|
1241
|
+
"inset 0rem -0.25rem 0rem 0rem currentColor";
|
|
1217
1242
|
export const amsTabsButtonSelectedFontWeight = "800";
|
|
1218
1243
|
export const amsTabsButtonDisabledColor = "#767676";
|
|
1219
1244
|
export const amsTabsButtonDisabledCursor = "not-allowed";
|
|
@@ -1226,9 +1251,9 @@ export const amsTextAreaFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1226
1251
|
export const amsTextAreaFontSize =
|
|
1227
1252
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1228
1253
|
export const amsTextAreaFontWeight = "400";
|
|
1229
|
-
export const amsTextAreaLineHeight =
|
|
1254
|
+
export const amsTextAreaLineHeight = 1.4;
|
|
1230
1255
|
export const amsTextAreaMinBlockSize =
|
|
1231
|
-
"calc(1.
|
|
1256
|
+
"calc(1.6 * 1em + 2 * clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem))";
|
|
1232
1257
|
export const amsTextAreaOutlineOffset = "0.25rem";
|
|
1233
1258
|
export const amsTextAreaPaddingBlock =
|
|
1234
1259
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1236,10 +1261,12 @@ export const amsTextAreaPaddingInline =
|
|
|
1236
1261
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1237
1262
|
export const amsTextAreaDisabledColor = "#767676";
|
|
1238
1263
|
export const amsTextAreaDisabledCursor = "not-allowed";
|
|
1239
|
-
export const amsTextAreaHoverBoxShadow =
|
|
1264
|
+
export const amsTextAreaHoverBoxShadow =
|
|
1265
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
1240
1266
|
export const amsTextAreaInvalidBorderColor = "#ec0000";
|
|
1241
1267
|
export const amsTextAreaInvalidHoverBorderColor = "#b70000";
|
|
1242
|
-
export const amsTextAreaInvalidHoverBoxShadow =
|
|
1268
|
+
export const amsTextAreaInvalidHoverBoxShadow =
|
|
1269
|
+
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
1243
1270
|
export const amsTextAreaPlaceholderColor = "#767676";
|
|
1244
1271
|
export const amsTextInputBackgroundColor = "#ffffff";
|
|
1245
1272
|
export const amsTextInputBorderColor = "currentColor";
|
|
@@ -1250,7 +1277,7 @@ export const amsTextInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1250
1277
|
export const amsTextInputFontSize =
|
|
1251
1278
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1252
1279
|
export const amsTextInputFontWeight = "400";
|
|
1253
|
-
export const amsTextInputLineHeight =
|
|
1280
|
+
export const amsTextInputLineHeight = 1.4;
|
|
1254
1281
|
export const amsTextInputOutlineOffset = "0.25rem";
|
|
1255
1282
|
export const amsTextInputPaddingBlock =
|
|
1256
1283
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
@@ -1265,21 +1292,6 @@ export const amsTextInputInvalidHoverBorderColor = "#b70000";
|
|
|
1265
1292
|
export const amsTextInputInvalidHoverBoxShadow =
|
|
1266
1293
|
"inset 0rem 0rem 0rem 0.0625rem #b70000";
|
|
1267
1294
|
export const amsTextInputPlaceholderColor = "#767676";
|
|
1268
|
-
export const amsTimeInputDisabledCalendarPickerIndicatorBackgroundImage =
|
|
1269
|
-
"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>\")";
|
|
1270
|
-
export const amsTimeInputDisabledCalenderPickerIndicatorBackgroundImage =
|
|
1271
|
-
"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>\")";
|
|
1272
|
-
export const amsTimeInputDisabledColor = "#767676";
|
|
1273
|
-
export const amsTimeInputDisabledCursor = "not-allowed";
|
|
1274
|
-
export const amsTimeInputHoverCalenderPickerIndicatorBackgroundImage =
|
|
1275
|
-
"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>\")";
|
|
1276
|
-
export const amsTimeInputHoverBoxShadow =
|
|
1277
|
-
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
1278
|
-
export const amsTimeInputHoverCalendarPickerIndicatorBackgroundImage =
|
|
1279
|
-
"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>\")";
|
|
1280
|
-
export const amsTimeInputCalenderPickerIndicatorBackgroundImage =
|
|
1281
|
-
"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>\")";
|
|
1282
|
-
export const amsTimeInputCalenderPickerIndicatorCursor = "pointer";
|
|
1283
1295
|
export const amsTimeInputBackgroundColor = "#ffffff";
|
|
1284
1296
|
export const amsTimeInputBorderColor = "currentColor";
|
|
1285
1297
|
export const amsTimeInputBorderStyle = "solid";
|
|
@@ -1289,12 +1301,18 @@ export const amsTimeInputFontFamily = "'Amsterdam Sans', Arial, sans-serif";
|
|
|
1289
1301
|
export const amsTimeInputFontSize =
|
|
1290
1302
|
"clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)";
|
|
1291
1303
|
export const amsTimeInputFontWeight = "400";
|
|
1292
|
-
export const amsTimeInputLineHeight =
|
|
1304
|
+
export const amsTimeInputLineHeight = 1.4;
|
|
1293
1305
|
export const amsTimeInputOutlineOffset = "0.25rem";
|
|
1294
1306
|
export const amsTimeInputPaddingBlock =
|
|
1295
1307
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1296
1308
|
export const amsTimeInputPaddingInline =
|
|
1297
1309
|
"clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
|
|
1310
|
+
export const amsTimeInputDisabledColor = "#767676";
|
|
1311
|
+
export const amsTimeInputDisabledCursor = "not-allowed";
|
|
1312
|
+
export const amsTimeInputHoverBoxShadow =
|
|
1313
|
+
"inset 0rem 0rem 0rem 0.0625rem currentColor";
|
|
1314
|
+
export const amsTimeInputHoverCalendarPickerIndicatorBackgroundImage =
|
|
1315
|
+
"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>\")";
|
|
1298
1316
|
export const amsTimeInputInvalidBorderColor = "#ec0000";
|
|
1299
1317
|
export const amsTimeInputInvalidHoverBorderColor = "#b70000";
|
|
1300
1318
|
export const amsTimeInputInvalidHoverBoxShadow =
|
|
@@ -1309,11 +1327,11 @@ export const amsUnorderedListFontSize =
|
|
|
1309
1327
|
export const amsUnorderedListFontWeight = "400";
|
|
1310
1328
|
export const amsUnorderedListGap =
|
|
1311
1329
|
"clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)";
|
|
1312
|
-
export const amsUnorderedListLineHeight =
|
|
1330
|
+
export const amsUnorderedListLineHeight = 1.6;
|
|
1313
1331
|
export const amsUnorderedListListStyleType = "'\\2022'";
|
|
1314
1332
|
export const amsUnorderedListInverseColor = "#ffffff";
|
|
1315
1333
|
export const amsUnorderedListSmallFontSize = "1rem";
|
|
1316
|
-
export const amsUnorderedListSmallLineHeight =
|
|
1334
|
+
export const amsUnorderedListSmallLineHeight = 1.5;
|
|
1317
1335
|
export const amsUnorderedListItemMarginInlineStart = "1.625rem";
|
|
1318
1336
|
export const amsUnorderedListItemPaddingInlineStart = "0.875rem";
|
|
1319
1337
|
export const amsUnorderedListUnorderedListGap =
|