@amsterdam/design-system-tokens 0.2.0 → 0.3.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 +22 -0
- package/dist/_variables.scss +136 -89
- package/dist/index.css +136 -89
- package/dist/index.d.ts +65 -18
- package/dist/index.js +116 -69
- package/dist/index.json +115 -68
- package/dist/index.tokens.json +177 -86
- package/dist/root.css +136 -89
- package/dist/tokens.d.ts +135 -44
- package/dist/tokens.js +2147 -1124
- package/dist/variables.less +136 -89
- package/package.json +3 -3
- package/src/brand/amsterdam/typography.tokens.json +10 -18
- package/src/common/amsterdam/border.tokens.json +3 -9
- package/src/common/amsterdam/spacing.tokens.json +4 -12
- package/src/components/amsterdam/accordion.tokens.json +1 -3
- package/src/components/amsterdam/breadcrumb.tokens.json +7 -5
- package/src/components/amsterdam/button.tokens.json +9 -19
- package/src/components/amsterdam/checkbox.tokens.json +24 -64
- package/src/components/amsterdam/form-label.tokens.json +4 -4
- package/src/components/amsterdam/grid.tokens.json +3 -9
- package/src/components/amsterdam/header.tokens.json +7 -0
- package/src/components/amsterdam/heading.tokens.json +24 -24
- package/src/components/amsterdam/icon.tokens.json +0 -8
- package/src/components/amsterdam/link.tokens.json +13 -23
- package/src/components/amsterdam/mark.tokens.json +7 -0
- package/src/components/amsterdam/ordered-list.tokens.json +4 -4
- package/src/components/amsterdam/page-heading.tokens.json +4 -12
- package/src/components/amsterdam/page-menu.tokens.json +4 -4
- package/src/components/amsterdam/pagination.tokens.json +4 -4
- package/src/components/amsterdam/paragraph.tokens.json +10 -10
- package/src/components/amsterdam/search-field.tokens.json +47 -0
- package/src/components/amsterdam/skip-link.tokens.json +20 -0
- package/src/components/amsterdam/spotlight.tokens.json +30 -0
- package/src/components/amsterdam/switch.tokens.json +10 -30
- package/src/components/amsterdam/text-input.tokens.json +36 -0
- package/src/components/amsterdam/top-task-link.tokens.json +4 -4
- package/src/components/amsterdam/unordered-list.tokens.json +4 -4
- package/src/components/utrecht/button.tokens.json +24 -72
- package/src/components/amsterdam/highlight.tokens.json +0 -46
package/dist/root.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri,
|
|
3
|
+
* Generated on Fri, 22 Dec 2023 12:50:01 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -23,6 +23,7 @@
|
|
|
23
23
|
--amsterdam-switch-thumb-height: 1.75rem;
|
|
24
24
|
--amsterdam-switch-thumb-width: 1.75rem;
|
|
25
25
|
--amsterdam-switch-width: 3.5rem;
|
|
26
|
+
--amsterdam-search-field-input-cancel-button-background-image: 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>");
|
|
26
27
|
--amsterdam-screen-x-wide-max-width: 132rem;
|
|
27
28
|
--amsterdam-screen-wide-max-width: 100rem;
|
|
28
29
|
--amsterdam-page-menu-item-gap: 0.5rem;
|
|
@@ -35,6 +36,7 @@
|
|
|
35
36
|
--amsterdam-ordered-list-item-margin-inline-start: 2.25rem; /* Divide your total indentation width over margin and padding to position the marker. */
|
|
36
37
|
--amsterdam-ordered-list-list-style-type: decimal;
|
|
37
38
|
--amsterdam-ordered-list-gap: 0.75rem;
|
|
39
|
+
--amsterdam-mark-background-color: var(--amsterdam-color-yellow);
|
|
38
40
|
--amsterdam-logo-height: 2.5rem;
|
|
39
41
|
--amsterdam-link-in-list-gap: 0.5em;
|
|
40
42
|
--amsterdam-link-inline-line-height: inherit;
|
|
@@ -59,6 +61,7 @@
|
|
|
59
61
|
--amsterdam-dialog-backdrop-background: #0006;
|
|
60
62
|
--amsterdam-dialog-max-inline-size: min(87.69vw, 45rem);
|
|
61
63
|
--amsterdam-dialog-border: 0;
|
|
64
|
+
--amsterdam-breadcrumb-separator-background-image: 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>");
|
|
62
65
|
--amsterdam-alert-close-background-color: transparent;
|
|
63
66
|
--amsterdam-alert-gap: 1rem;
|
|
64
67
|
--amsterdam-spacing-inset-xl: 2.5rem;
|
|
@@ -76,37 +79,33 @@
|
|
|
76
79
|
--amsterdam-border-width-lg: 3px;
|
|
77
80
|
--amsterdam-border-width-md: 2px;
|
|
78
81
|
--amsterdam-border-width-sm: 1px;
|
|
79
|
-
--amsterdam-typography-compact-text-level-7-line-height: 1.6;
|
|
80
|
-
--amsterdam-typography-compact-text-level-7-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
|
|
81
82
|
--amsterdam-typography-compact-text-level-6-line-height: 1.6;
|
|
82
|
-
--amsterdam-typography-compact-text-level-6-font-size: clamp(0.
|
|
83
|
-
--amsterdam-typography-compact-text-level-5-line-height: 1.
|
|
84
|
-
--amsterdam-typography-compact-text-level-5-font-size: clamp(
|
|
85
|
-
--amsterdam-typography-compact-text-level-4-line-height: 1.
|
|
83
|
+
--amsterdam-typography-compact-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
|
|
84
|
+
--amsterdam-typography-compact-text-level-5-line-height: 1.6;
|
|
85
|
+
--amsterdam-typography-compact-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
|
|
86
|
+
--amsterdam-typography-compact-text-level-4-line-height: 1.5;
|
|
86
87
|
--amsterdam-typography-compact-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
|
|
87
|
-
--amsterdam-typography-compact-text-level-3-line-height: 1.
|
|
88
|
+
--amsterdam-typography-compact-text-level-3-line-height: 1.3;
|
|
88
89
|
--amsterdam-typography-compact-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
|
|
89
|
-
--amsterdam-typography-compact-text-level-2-line-height: 1.
|
|
90
|
+
--amsterdam-typography-compact-text-level-2-line-height: 1.25;
|
|
90
91
|
--amsterdam-typography-compact-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
|
|
91
92
|
--amsterdam-typography-compact-text-level-1-line-height: 1.2;
|
|
92
93
|
--amsterdam-typography-compact-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
|
|
93
|
-
--amsterdam-typography-compact-text-level-0-line-height: 1.
|
|
94
|
+
--amsterdam-typography-compact-text-level-0-line-height: 1.15;
|
|
94
95
|
--amsterdam-typography-compact-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
|
|
95
|
-
--amsterdam-typography-spacious-text-level-7-line-height: 1.6;
|
|
96
|
-
--amsterdam-typography-spacious-text-level-7-font-size: clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem);
|
|
97
96
|
--amsterdam-typography-spacious-text-level-6-line-height: 1.6;
|
|
98
|
-
--amsterdam-typography-spacious-text-level-6-font-size: clamp(
|
|
99
|
-
--amsterdam-typography-spacious-text-level-5-line-height: 1.
|
|
100
|
-
--amsterdam-typography-spacious-text-level-5-font-size: clamp(1.
|
|
101
|
-
--amsterdam-typography-spacious-text-level-4-line-height: 1.
|
|
97
|
+
--amsterdam-typography-spacious-text-level-6-font-size: clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem);
|
|
98
|
+
--amsterdam-typography-spacious-text-level-5-line-height: 1.6;
|
|
99
|
+
--amsterdam-typography-spacious-text-level-5-font-size: clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem);
|
|
100
|
+
--amsterdam-typography-spacious-text-level-4-line-height: 1.5;
|
|
102
101
|
--amsterdam-typography-spacious-text-level-4-font-size: clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem);
|
|
103
|
-
--amsterdam-typography-spacious-text-level-3-line-height: 1.
|
|
102
|
+
--amsterdam-typography-spacious-text-level-3-line-height: 1.3;
|
|
104
103
|
--amsterdam-typography-spacious-text-level-3-font-size: clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem);
|
|
105
|
-
--amsterdam-typography-spacious-text-level-2-line-height: 1.
|
|
104
|
+
--amsterdam-typography-spacious-text-level-2-line-height: 1.25;
|
|
106
105
|
--amsterdam-typography-spacious-text-level-2-font-size: clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem);
|
|
107
106
|
--amsterdam-typography-spacious-text-level-1-line-height: 1.2;
|
|
108
107
|
--amsterdam-typography-spacious-text-level-1-font-size: clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem);
|
|
109
|
-
--amsterdam-typography-spacious-text-level-0-line-height: 1.
|
|
108
|
+
--amsterdam-typography-spacious-text-level-0-line-height: 1.15;
|
|
110
109
|
--amsterdam-typography-spacious-text-level-0-font-size: clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem);
|
|
111
110
|
--amsterdam-typography-font-weight-bold: 800;
|
|
112
111
|
--amsterdam-typography-font-weight-normal: 400;
|
|
@@ -155,10 +154,10 @@
|
|
|
155
154
|
--utrecht-button-font-family: var(--amsterdam-typography-font-family);
|
|
156
155
|
--utrecht-button-color: var(--amsterdam-color-primary-white);
|
|
157
156
|
--utrecht-button-background-color: var(--amsterdam-color-primary-blue);
|
|
158
|
-
--amsterdam-unordered-list-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
159
|
-
--amsterdam-unordered-list-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
160
|
-
--amsterdam-unordered-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
161
|
-
--amsterdam-unordered-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
157
|
+
--amsterdam-unordered-list-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
158
|
+
--amsterdam-unordered-list-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
159
|
+
--amsterdam-unordered-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
160
|
+
--amsterdam-unordered-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
162
161
|
--amsterdam-unordered-list-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
163
162
|
--amsterdam-unordered-list-font-family: var(--amsterdam-typography-font-family);
|
|
164
163
|
--amsterdam-unordered-list-color: var(--amsterdam-color-primary-black);
|
|
@@ -174,13 +173,29 @@
|
|
|
174
173
|
--amsterdam-top-task-link-label-text-decoration-line: var(--amsterdam-link-appearance-subtle-text-decoration-line);
|
|
175
174
|
--amsterdam-top-task-link-label-font-weight: var(--amsterdam-typography-font-weight-bold);
|
|
176
175
|
--amsterdam-top-task-link-label-font-family: var(--amsterdam-typography-font-family);
|
|
177
|
-
--amsterdam-top-task-link-description-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
178
|
-
--amsterdam-top-task-link-description-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
179
|
-
--amsterdam-top-task-link-description-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
180
|
-
--amsterdam-top-task-link-description-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
176
|
+
--amsterdam-top-task-link-description-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
177
|
+
--amsterdam-top-task-link-description-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
178
|
+
--amsterdam-top-task-link-description-spacious-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
179
|
+
--amsterdam-top-task-link-description-spacious-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
181
180
|
--amsterdam-top-task-link-description-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
182
181
|
--amsterdam-top-task-link-description-font-family: var(--amsterdam-typography-font-family);
|
|
183
182
|
--amsterdam-top-task-link-description-color: var(--amsterdam-color-primary-black);
|
|
183
|
+
--amsterdam-text-input-spacious-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
184
|
+
--amsterdam-text-input-spacious-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
185
|
+
--amsterdam-text-input-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
186
|
+
--amsterdam-text-input-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
187
|
+
--amsterdam-text-input-placeholder-color: var(--amsterdam-color-neutral-grey3);
|
|
188
|
+
--amsterdam-text-input-invalid-hover-box-shadow: inset 0 0 0 2px var(--amsterdam-color-primary-red);
|
|
189
|
+
--amsterdam-text-input-invalid-box-shadow: inset 0 0 0 1px var(--amsterdam-color-primary-red);
|
|
190
|
+
--amsterdam-text-input-hover-box-shadow: inset 0 0 0 2px var(--amsterdam-color-primary-black);
|
|
191
|
+
--amsterdam-text-input-disabled-color: var(--amsterdam-color-neutral-grey2);
|
|
192
|
+
--amsterdam-text-input-disabled-box-shadow: inset 0 0 0 1px var(--amsterdam-color-neutral-grey2);
|
|
193
|
+
--amsterdam-text-input-disabled-background-color: var(--amsterdam-color-primary-white);
|
|
194
|
+
--amsterdam-text-input-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
195
|
+
--amsterdam-text-input-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
196
|
+
--amsterdam-text-input-font-family: var(--amsterdam-typography-font-family);
|
|
197
|
+
--amsterdam-text-input-color: var(--amsterdam-color-primary-black);
|
|
198
|
+
--amsterdam-text-input-box-shadow: inset 0 0 0 1px var(--amsterdam-color-primary-black);
|
|
184
199
|
--amsterdam-switch-disabled-background-color: var(--amsterdam-color-neutral-grey2);
|
|
185
200
|
--amsterdam-switch-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
186
201
|
--amsterdam-switch-checked-background-color: var(--amsterdam-color-primary-blue);
|
|
@@ -188,18 +203,54 @@
|
|
|
188
203
|
--amsterdam-switch-thumb-background-color: var(--amsterdam-color-primary-white);
|
|
189
204
|
--amsterdam-switch-background-color: var(--amsterdam-color-neutral-grey3);
|
|
190
205
|
--amsterdam-switch-font-family: var(--amsterdam-typography-font-family);
|
|
191
|
-
--amsterdam-
|
|
192
|
-
--amsterdam-
|
|
193
|
-
--amsterdam-
|
|
194
|
-
--amsterdam-
|
|
195
|
-
--amsterdam-
|
|
196
|
-
--amsterdam-
|
|
197
|
-
--amsterdam-
|
|
198
|
-
--amsterdam-
|
|
199
|
-
--amsterdam-
|
|
200
|
-
--amsterdam-
|
|
201
|
-
--amsterdam-
|
|
202
|
-
--amsterdam-
|
|
206
|
+
--amsterdam-spotlight-yellow-background-color: var(--amsterdam-color-yellow);
|
|
207
|
+
--amsterdam-spotlight-purple-background-color: var(--amsterdam-color-purple);
|
|
208
|
+
--amsterdam-spotlight-orange-background-color: var(--amsterdam-color-orange);
|
|
209
|
+
--amsterdam-spotlight-magenta-background-color: var(--amsterdam-color-magenta);
|
|
210
|
+
--amsterdam-spotlight-light-blue-background-color: var(--amsterdam-color-blue);
|
|
211
|
+
--amsterdam-spotlight-green-background-color: var(--amsterdam-color-green);
|
|
212
|
+
--amsterdam-spotlight-dark-green-background-color: var(--amsterdam-color-dark-green);
|
|
213
|
+
--amsterdam-spotlight-blue-background-color: var(--amsterdam-color-primary-blue);
|
|
214
|
+
--amsterdam-skip-link-hover-background-color: var(--amsterdam-color-dark-blue);
|
|
215
|
+
--amsterdam-skip-link-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
216
|
+
--amsterdam-skip-link-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
217
|
+
--amsterdam-skip-link-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
218
|
+
--amsterdam-skip-link-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
219
|
+
--amsterdam-skip-link-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
220
|
+
--amsterdam-skip-link-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
221
|
+
--amsterdam-skip-link-font-family: var(--amsterdam-typography-font-family);
|
|
222
|
+
--amsterdam-skip-link-color: var(--amsterdam-color-primary-white);
|
|
223
|
+
--amsterdam-skip-link-background-color: var(--amsterdam-color-primary-blue);
|
|
224
|
+
--amsterdam-search-field-input-spacious-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
225
|
+
--amsterdam-search-field-input-spacious-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
226
|
+
--amsterdam-search-field-input-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
227
|
+
--amsterdam-search-field-input-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
228
|
+
--amsterdam-search-field-input-placeholder-color: var(--amsterdam-color-neutral-grey3);
|
|
229
|
+
--amsterdam-search-field-input-hover-box-shadow: inset 0 0 0 2px var(--amsterdam-color-primary-black);
|
|
230
|
+
--amsterdam-search-field-input-cancel-button-width: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
231
|
+
--amsterdam-search-field-input-cancel-button-height: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
232
|
+
--amsterdam-search-field-input-cancel-button-color: var(--amsterdam-color-primary-blue);
|
|
233
|
+
--amsterdam-search-field-input-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
234
|
+
--amsterdam-search-field-input-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
235
|
+
--amsterdam-search-field-input-font-family: var(--amsterdam-typography-font-family);
|
|
236
|
+
--amsterdam-search-field-input-color: var(--amsterdam-color-primary-black);
|
|
237
|
+
--amsterdam-search-field-input-box-shadow: inset 0 0 0 1px var(--amsterdam-color-primary-black);
|
|
238
|
+
--amsterdam-search-field-button-hover-background-color: var(--amsterdam-color-dark-blue);
|
|
239
|
+
--amsterdam-search-field-button-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
240
|
+
--amsterdam-search-field-button-color: var(--amsterdam-color-primary-white);
|
|
241
|
+
--amsterdam-search-field-button-background-color: var(--amsterdam-color-primary-blue);
|
|
242
|
+
--amsterdam-paragraph-compact-large-line-height: var(--amsterdam-typography-compact-text-level-4-line-height);
|
|
243
|
+
--amsterdam-paragraph-compact-large-font-size: var(--amsterdam-typography-compact-text-level-4-font-size);
|
|
244
|
+
--amsterdam-paragraph-compact-medium-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
245
|
+
--amsterdam-paragraph-compact-medium-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
246
|
+
--amsterdam-paragraph-compact-small-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
247
|
+
--amsterdam-paragraph-compact-small-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
248
|
+
--amsterdam-paragraph-spacious-large-line-height: var(--amsterdam-typography-spacious-text-level-4-line-height);
|
|
249
|
+
--amsterdam-paragraph-spacious-large-font-size: var(--amsterdam-typography-spacious-text-level-4-font-size);
|
|
250
|
+
--amsterdam-paragraph-spacious-medium-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
251
|
+
--amsterdam-paragraph-spacious-medium-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
252
|
+
--amsterdam-paragraph-spacious-small-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
253
|
+
--amsterdam-paragraph-spacious-small-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
203
254
|
--amsterdam-paragraph-inverse-color: var(--amsterdam-color-primary-white);
|
|
204
255
|
--amsterdam-paragraph-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
205
256
|
--amsterdam-paragraph-font-family: var(--amsterdam-typography-font-family);
|
|
@@ -210,17 +261,17 @@
|
|
|
210
261
|
--amsterdam-pagination-button-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
211
262
|
--amsterdam-pagination-button-text-decoration-line: var(--amsterdam-link-appearance-subtle-text-decoration-line);
|
|
212
263
|
--amsterdam-pagination-button-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
213
|
-
--amsterdam-pagination-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
214
|
-
--amsterdam-pagination-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
215
|
-
--amsterdam-pagination-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
216
|
-
--amsterdam-pagination-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
264
|
+
--amsterdam-pagination-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
265
|
+
--amsterdam-pagination-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
266
|
+
--amsterdam-pagination-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
267
|
+
--amsterdam-pagination-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
217
268
|
--amsterdam-pagination-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
218
269
|
--amsterdam-pagination-font-family: var(--amsterdam-typography-font-family);
|
|
219
270
|
--amsterdam-page-menu-item-hover-text-decoration-line: var(--amsterdam-link-appearance-subtle-hover-text-decoration-line);
|
|
220
|
-
--amsterdam-page-menu-item-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
221
|
-
--amsterdam-page-menu-item-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
222
|
-
--amsterdam-page-menu-item-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
223
|
-
--amsterdam-page-menu-item-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
271
|
+
--amsterdam-page-menu-item-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
272
|
+
--amsterdam-page-menu-item-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
273
|
+
--amsterdam-page-menu-item-spacious-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
274
|
+
--amsterdam-page-menu-item-spacious-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
224
275
|
--amsterdam-page-menu-item-text-underline-offset: var(--amsterdam-link-appearance-text-underline-offset);
|
|
225
276
|
--amsterdam-page-menu-item-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
226
277
|
--amsterdam-page-menu-item-text-decoration-line: var(--amsterdam-link-appearance-subtle-text-decoration-line);
|
|
@@ -235,29 +286,29 @@
|
|
|
235
286
|
--amsterdam-page-heading-font-weight: var(--amsterdam-typography-font-weight-bold);
|
|
236
287
|
--amsterdam-page-heading-font-family: var(--amsterdam-typography-font-family);
|
|
237
288
|
--amsterdam-page-heading-color: var(--amsterdam-color-primary-black);
|
|
238
|
-
--amsterdam-ordered-list-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
239
|
-
--amsterdam-ordered-list-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
240
|
-
--amsterdam-ordered-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
241
|
-
--amsterdam-ordered-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
289
|
+
--amsterdam-ordered-list-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
290
|
+
--amsterdam-ordered-list-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
291
|
+
--amsterdam-ordered-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
292
|
+
--amsterdam-ordered-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
242
293
|
--amsterdam-ordered-list-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
243
294
|
--amsterdam-ordered-list-font-family: var(--amsterdam-typography-font-family);
|
|
244
295
|
--amsterdam-ordered-list-color: var(--amsterdam-color-primary-black);
|
|
245
296
|
--amsterdam-logo-subsite-color: var(--amsterdam-color-primary-black);
|
|
246
297
|
--amsterdam-logo-title-color: var(--amsterdam-color-primary-red);
|
|
247
298
|
--amsterdam-logo-emblem-color: var(--amsterdam-color-primary-red);
|
|
248
|
-
--amsterdam-link-standalone-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
249
|
-
--amsterdam-link-standalone-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
250
|
-
--amsterdam-link-standalone-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
251
|
-
--amsterdam-link-standalone-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
299
|
+
--amsterdam-link-standalone-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
300
|
+
--amsterdam-link-standalone-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
301
|
+
--amsterdam-link-standalone-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
302
|
+
--amsterdam-link-standalone-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
252
303
|
--amsterdam-link-standalone-hover-text-underline-offset: var(--amsterdam-link-appearance-regular-hover-text-underline-offset);
|
|
253
304
|
--amsterdam-link-standalone-hover-text-decoration-thickness: var(--amsterdam-link-appearance-regular-hover-text-decoration-thickness);
|
|
254
305
|
--amsterdam-link-standalone-text-underline-offset: var(--amsterdam-link-appearance-text-underline-offset);
|
|
255
306
|
--amsterdam-link-standalone-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
256
307
|
--amsterdam-link-standalone-text-decoration-line: var(--amsterdam-link-appearance-regular-text-decoration-line);
|
|
257
|
-
--amsterdam-link-in-list-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
258
|
-
--amsterdam-link-in-list-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
259
|
-
--amsterdam-link-in-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
260
|
-
--amsterdam-link-in-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
308
|
+
--amsterdam-link-in-list-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
309
|
+
--amsterdam-link-in-list-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
310
|
+
--amsterdam-link-in-list-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
311
|
+
--amsterdam-link-in-list-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
261
312
|
--amsterdam-link-in-list-hover-text-decoration-line: var(--amsterdam-link-appearance-subtle-hover-text-decoration-line);
|
|
262
313
|
--amsterdam-link-in-list-text-underline-offset: var(--amsterdam-link-appearance-text-underline-offset);
|
|
263
314
|
--amsterdam-link-in-list-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
@@ -271,8 +322,6 @@
|
|
|
271
322
|
--amsterdam-link-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
272
323
|
--amsterdam-link-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
273
324
|
--amsterdam-link-font-family: var(--amsterdam-typography-font-family);
|
|
274
|
-
--amsterdam-icon-compact-size-7-line-height: var(--amsterdam-typography-compact-text-level-7-line-height);
|
|
275
|
-
--amsterdam-icon-compact-size-7-font-size: var(--amsterdam-typography-compact-text-level-7-font-size);
|
|
276
325
|
--amsterdam-icon-compact-size-6-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
277
326
|
--amsterdam-icon-compact-size-6-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
278
327
|
--amsterdam-icon-compact-size-5-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
@@ -281,8 +330,6 @@
|
|
|
281
330
|
--amsterdam-icon-compact-size-4-font-size: var(--amsterdam-typography-compact-text-level-4-font-size);
|
|
282
331
|
--amsterdam-icon-compact-size-3-line-height: var(--amsterdam-typography-compact-text-level-3-line-height);
|
|
283
332
|
--amsterdam-icon-compact-size-3-font-size: var(--amsterdam-typography-compact-text-level-3-font-size);
|
|
284
|
-
--amsterdam-icon-spacious-size-7-line-height: var(--amsterdam-typography-spacious-text-level-7-line-height);
|
|
285
|
-
--amsterdam-icon-spacious-size-7-font-size: var(--amsterdam-typography-spacious-text-level-7-font-size);
|
|
286
333
|
--amsterdam-icon-spacious-size-6-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
287
334
|
--amsterdam-icon-spacious-size-6-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
288
335
|
--amsterdam-icon-spacious-size-5-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
@@ -291,14 +338,10 @@
|
|
|
291
338
|
--amsterdam-icon-spacious-size-4-font-size: var(--amsterdam-typography-spacious-text-level-4-font-size);
|
|
292
339
|
--amsterdam-icon-spacious-size-3-line-height: var(--amsterdam-typography-spacious-text-level-3-line-height);
|
|
293
340
|
--amsterdam-icon-spacious-size-3-font-size: var(--amsterdam-typography-spacious-text-level-3-font-size);
|
|
294
|
-
--amsterdam-
|
|
295
|
-
--amsterdam-
|
|
296
|
-
--amsterdam-
|
|
297
|
-
--amsterdam-
|
|
298
|
-
--amsterdam-highlight-light-blue-background-color: var(--amsterdam-color-blue);
|
|
299
|
-
--amsterdam-highlight-green-background-color: var(--amsterdam-color-green);
|
|
300
|
-
--amsterdam-highlight-dark-green-background-color: var(--amsterdam-color-dark-green);
|
|
301
|
-
--amsterdam-highlight-blue-background-color: var(--amsterdam-color-primary-blue);
|
|
341
|
+
--amsterdam-heading-compact-level-6-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
342
|
+
--amsterdam-heading-compact-level-6-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
343
|
+
--amsterdam-heading-compact-level-5-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
344
|
+
--amsterdam-heading-compact-level-5-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
302
345
|
--amsterdam-heading-compact-level-4-font-size: var(--amsterdam-typography-compact-text-level-4-font-size);
|
|
303
346
|
--amsterdam-heading-compact-level-4-line-height: var(--amsterdam-typography-compact-text-level-4-line-height);
|
|
304
347
|
--amsterdam-heading-compact-level-3-font-size: var(--amsterdam-typography-compact-text-level-3-font-size);
|
|
@@ -307,6 +350,10 @@
|
|
|
307
350
|
--amsterdam-heading-compact-level-2-line-height: var(--amsterdam-typography-compact-text-level-2-line-height);
|
|
308
351
|
--amsterdam-heading-compact-level-1-font-size: var(--amsterdam-typography-compact-text-level-1-font-size);
|
|
309
352
|
--amsterdam-heading-compact-level-1-line-height: var(--amsterdam-typography-compact-text-level-1-line-height);
|
|
353
|
+
--amsterdam-heading-spacious-level-6-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
354
|
+
--amsterdam-heading-spacious-level-6-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
355
|
+
--amsterdam-heading-spacious-level-5-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
356
|
+
--amsterdam-heading-spacious-level-5-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
310
357
|
--amsterdam-heading-spacious-level-4-font-size: var(--amsterdam-typography-spacious-text-level-4-font-size);
|
|
311
358
|
--amsterdam-heading-spacious-level-4-line-height: var(--amsterdam-typography-spacious-text-level-4-line-height);
|
|
312
359
|
--amsterdam-heading-spacious-level-3-font-size: var(--amsterdam-typography-spacious-text-level-3-font-size);
|
|
@@ -319,10 +366,11 @@
|
|
|
319
366
|
--amsterdam-heading-font-weight: var(--amsterdam-typography-font-weight-bold);
|
|
320
367
|
--amsterdam-heading-font-family: var(--amsterdam-typography-font-family);
|
|
321
368
|
--amsterdam-heading-color: var(--amsterdam-color-primary-black);
|
|
322
|
-
--amsterdam-
|
|
323
|
-
--amsterdam-form-label-compact-
|
|
324
|
-
--amsterdam-form-label-
|
|
325
|
-
--amsterdam-form-label-spacious-
|
|
369
|
+
--amsterdam-header-column-gap: var(--amsterdam-grid-spacious-gap);
|
|
370
|
+
--amsterdam-form-label-compact-line-height: var(--amsterdam-typography-compact-text-level-4-line-height);
|
|
371
|
+
--amsterdam-form-label-compact-font-size: var(--amsterdam-typography-compact-text-level-4-font-size);
|
|
372
|
+
--amsterdam-form-label-spacious-line-height: var(--amsterdam-typography-spacious-text-level-4-line-height);
|
|
373
|
+
--amsterdam-form-label-spacious-font-size: var(--amsterdam-typography-spacious-text-level-4-font-size);
|
|
326
374
|
--amsterdam-form-label-font-weight: var(--amsterdam-typography-font-weight-bold);
|
|
327
375
|
--amsterdam-form-label-font-family: var(--amsterdam-typography-font-family);
|
|
328
376
|
--amsterdam-form-label-color: var(--amsterdam-color-primary-black);
|
|
@@ -336,10 +384,10 @@
|
|
|
336
384
|
--amsterdam-dialog-title-font-family: var(--amsterdam-typography-font-family);
|
|
337
385
|
--amsterdam-dialog-title-color: var(--amsterdam-color-primary-black);
|
|
338
386
|
--amsterdam-dialog-background-color: var(--amsterdam-color-primary-white);
|
|
339
|
-
--amsterdam-checkbox-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
340
|
-
--amsterdam-checkbox-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
341
|
-
--amsterdam-checkbox-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
342
|
-
--amsterdam-checkbox-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
387
|
+
--amsterdam-checkbox-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
388
|
+
--amsterdam-checkbox-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
389
|
+
--amsterdam-checkbox-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
390
|
+
--amsterdam-checkbox-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
343
391
|
--amsterdam-checkbox-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
344
392
|
--amsterdam-checkbox-hover-color: var(--amsterdam-color-dark-blue);
|
|
345
393
|
--amsterdam-checkbox-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
@@ -368,26 +416,25 @@
|
|
|
368
416
|
--amsterdam-card-link-text-underline-offset: var(--amsterdam-link-appearance-text-underline-offset);
|
|
369
417
|
--amsterdam-card-link-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
370
418
|
--amsterdam-card-link-text-decoration-line: var(--amsterdam-link-appearance-subtle-text-decoration-line);
|
|
371
|
-
--amsterdam-button-tertiary-hover-box-shadow: inset 0 0 0 2px var(--amsterdam-color-
|
|
419
|
+
--amsterdam-button-tertiary-hover-box-shadow: inset 0 0 0 2px var(--amsterdam-color-dark-blue);
|
|
372
420
|
--amsterdam-button-secondary-focus-box-shadow: inset 0 0 0 2px var(--amsterdam-color-primary-blue);
|
|
373
421
|
--amsterdam-button-secondary-disabled-box-shadow: inset 0 0 0 2px var(--amsterdam-color-neutral-grey2);
|
|
374
422
|
--amsterdam-button-secondary-hover-box-shadow: inset 0 0 0 3px var(--amsterdam-color-dark-blue);
|
|
375
423
|
--amsterdam-button-secondary-box-shadow: inset 0 0 0 2px var(--amsterdam-color-primary-blue);
|
|
376
|
-
--amsterdam-button-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
377
|
-
--amsterdam-button-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
378
|
-
--amsterdam-button-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
379
|
-
--amsterdam-button-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
380
|
-
--amsterdam-breadcrumb-compact-line-height: var(--amsterdam-typography-compact-text-level-
|
|
381
|
-
--amsterdam-breadcrumb-compact-font-size: var(--amsterdam-typography-compact-text-level-
|
|
382
|
-
--amsterdam-breadcrumb-spacious-line-height: var(--amsterdam-typography-spacious-text-level-
|
|
383
|
-
--amsterdam-breadcrumb-spacious-font-size: var(--amsterdam-typography-spacious-text-level-
|
|
424
|
+
--amsterdam-button-compact-line-height: var(--amsterdam-typography-compact-text-level-5-line-height);
|
|
425
|
+
--amsterdam-button-compact-font-size: var(--amsterdam-typography-compact-text-level-5-font-size);
|
|
426
|
+
--amsterdam-button-spacious-line-height: var(--amsterdam-typography-spacious-text-level-5-line-height);
|
|
427
|
+
--amsterdam-button-spacious-font-size: var(--amsterdam-typography-spacious-text-level-5-font-size);
|
|
428
|
+
--amsterdam-breadcrumb-compact-line-height: var(--amsterdam-typography-compact-text-level-6-line-height);
|
|
429
|
+
--amsterdam-breadcrumb-compact-font-size: var(--amsterdam-typography-compact-text-level-6-font-size);
|
|
430
|
+
--amsterdam-breadcrumb-spacious-line-height: var(--amsterdam-typography-spacious-text-level-6-line-height);
|
|
431
|
+
--amsterdam-breadcrumb-spacious-font-size: var(--amsterdam-typography-spacious-text-level-6-font-size);
|
|
384
432
|
--amsterdam-breadcrumb-item-link-hover-text-decoration-line: var(--amsterdam-link-appearance-subtle-hover-text-decoration-line);
|
|
385
433
|
--amsterdam-breadcrumb-item-link-hover-color: var(--amsterdam-color-dark-blue);
|
|
386
434
|
--amsterdam-breadcrumb-item-link-text-underline-offset: var(--amsterdam-link-appearance-text-underline-offset);
|
|
387
435
|
--amsterdam-breadcrumb-item-link-text-decoration-thickness: var(--amsterdam-link-appearance-text-decoration-thickness);
|
|
388
436
|
--amsterdam-breadcrumb-item-link-text-decoration-line: var(--amsterdam-link-appearance-subtle-text-decoration-line);
|
|
389
437
|
--amsterdam-breadcrumb-item-link-outline-offset: var(--amsterdam-focus-outline-offset);
|
|
390
|
-
--amsterdam-breadcrumb-separator-background-color: var(--amsterdam-color-primary-blue);
|
|
391
438
|
--amsterdam-breadcrumb-font-weight: var(--amsterdam-typography-font-weight-normal);
|
|
392
439
|
--amsterdam-breadcrumb-font-family: var(--amsterdam-typography-font-family);
|
|
393
440
|
--amsterdam-blockquote-compact-line-height: var(--amsterdam-typography-compact-text-level-3-line-height);
|
package/dist/tokens.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri,
|
|
3
|
+
* Generated on Fri, 22 Dec 2023 12:50:01 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export default tokens;
|
|
@@ -84,10 +84,6 @@ declare const tokens: {
|
|
|
84
84
|
"6": {
|
|
85
85
|
"font-size": DesignToken,
|
|
86
86
|
"line-height": DesignToken
|
|
87
|
-
},
|
|
88
|
-
"7": {
|
|
89
|
-
"font-size": DesignToken,
|
|
90
|
-
"line-height": DesignToken
|
|
91
87
|
}
|
|
92
88
|
}
|
|
93
89
|
},
|
|
@@ -120,10 +116,6 @@ declare const tokens: {
|
|
|
120
116
|
"6": {
|
|
121
117
|
"font-size": DesignToken,
|
|
122
118
|
"line-height": DesignToken
|
|
123
|
-
},
|
|
124
|
-
"7": {
|
|
125
|
-
"font-size": DesignToken,
|
|
126
|
-
"line-height": DesignToken
|
|
127
119
|
}
|
|
128
120
|
}
|
|
129
121
|
}
|
|
@@ -255,7 +247,7 @@ declare const tokens: {
|
|
|
255
247
|
"font-family": DesignToken,
|
|
256
248
|
"font-weight": DesignToken,
|
|
257
249
|
"separator": {
|
|
258
|
-
"background-
|
|
250
|
+
"background-image": DesignToken
|
|
259
251
|
},
|
|
260
252
|
"item-link": {
|
|
261
253
|
"color": DesignToken,
|
|
@@ -462,6 +454,9 @@ declare const tokens: {
|
|
|
462
454
|
"column-count": DesignToken
|
|
463
455
|
}
|
|
464
456
|
},
|
|
457
|
+
"header": {
|
|
458
|
+
"column-gap": DesignToken
|
|
459
|
+
},
|
|
465
460
|
"heading": {
|
|
466
461
|
"color": DesignToken,
|
|
467
462
|
"font-family": DesignToken,
|
|
@@ -483,6 +478,14 @@ declare const tokens: {
|
|
|
483
478
|
"level-4": {
|
|
484
479
|
"line-height": DesignToken,
|
|
485
480
|
"font-size": DesignToken
|
|
481
|
+
},
|
|
482
|
+
"level-5": {
|
|
483
|
+
"line-height": DesignToken,
|
|
484
|
+
"font-size": DesignToken
|
|
485
|
+
},
|
|
486
|
+
"level-6": {
|
|
487
|
+
"line-height": DesignToken,
|
|
488
|
+
"font-size": DesignToken
|
|
486
489
|
}
|
|
487
490
|
},
|
|
488
491
|
"compact": {
|
|
@@ -501,35 +504,17 @@ declare const tokens: {
|
|
|
501
504
|
"level-4": {
|
|
502
505
|
"line-height": DesignToken,
|
|
503
506
|
"font-size": DesignToken
|
|
507
|
+
},
|
|
508
|
+
"level-5": {
|
|
509
|
+
"line-height": DesignToken,
|
|
510
|
+
"font-size": DesignToken
|
|
511
|
+
},
|
|
512
|
+
"level-6": {
|
|
513
|
+
"line-height": DesignToken,
|
|
514
|
+
"font-size": DesignToken
|
|
504
515
|
}
|
|
505
516
|
}
|
|
506
517
|
},
|
|
507
|
-
"highlight": {
|
|
508
|
-
"blue": {
|
|
509
|
-
"background-color": DesignToken
|
|
510
|
-
},
|
|
511
|
-
"dark-green": {
|
|
512
|
-
"background-color": DesignToken
|
|
513
|
-
},
|
|
514
|
-
"green": {
|
|
515
|
-
"background-color": DesignToken
|
|
516
|
-
},
|
|
517
|
-
"light-blue": {
|
|
518
|
-
"background-color": DesignToken
|
|
519
|
-
},
|
|
520
|
-
"magenta": {
|
|
521
|
-
"background-color": DesignToken
|
|
522
|
-
},
|
|
523
|
-
"orange": {
|
|
524
|
-
"background-color": DesignToken
|
|
525
|
-
},
|
|
526
|
-
"purple": {
|
|
527
|
-
"background-color": DesignToken
|
|
528
|
-
},
|
|
529
|
-
"yellow": {
|
|
530
|
-
"background-color": DesignToken
|
|
531
|
-
}
|
|
532
|
-
},
|
|
533
518
|
"icon": {
|
|
534
519
|
"spacious": {
|
|
535
520
|
"size-3": {
|
|
@@ -547,10 +532,6 @@ declare const tokens: {
|
|
|
547
532
|
"size-6": {
|
|
548
533
|
"font-size": DesignToken,
|
|
549
534
|
"line-height": DesignToken
|
|
550
|
-
},
|
|
551
|
-
"size-7": {
|
|
552
|
-
"font-size": DesignToken,
|
|
553
|
-
"line-height": DesignToken
|
|
554
535
|
}
|
|
555
536
|
},
|
|
556
537
|
"compact": {
|
|
@@ -569,10 +550,6 @@ declare const tokens: {
|
|
|
569
550
|
"size-6": {
|
|
570
551
|
"font-size": DesignToken,
|
|
571
552
|
"line-height": DesignToken
|
|
572
|
-
},
|
|
573
|
-
"size-7": {
|
|
574
|
-
"font-size": DesignToken,
|
|
575
|
-
"line-height": DesignToken
|
|
576
553
|
}
|
|
577
554
|
}
|
|
578
555
|
},
|
|
@@ -664,6 +641,9 @@ declare const tokens: {
|
|
|
664
641
|
"color": DesignToken
|
|
665
642
|
}
|
|
666
643
|
},
|
|
644
|
+
"mark": {
|
|
645
|
+
"background-color": DesignToken
|
|
646
|
+
},
|
|
667
647
|
"ordered-list": {
|
|
668
648
|
"color": DesignToken,
|
|
669
649
|
"font-family": DesignToken,
|
|
@@ -798,6 +778,85 @@ declare const tokens: {
|
|
|
798
778
|
"max-width": DesignToken
|
|
799
779
|
}
|
|
800
780
|
},
|
|
781
|
+
"search-field": {
|
|
782
|
+
"button": {
|
|
783
|
+
"background-color": DesignToken,
|
|
784
|
+
"color": DesignToken,
|
|
785
|
+
"outline-offset": DesignToken,
|
|
786
|
+
"hover": {
|
|
787
|
+
"background-color": DesignToken
|
|
788
|
+
}
|
|
789
|
+
},
|
|
790
|
+
"input": {
|
|
791
|
+
"box-shadow": DesignToken,
|
|
792
|
+
"color": DesignToken,
|
|
793
|
+
"font-family": DesignToken,
|
|
794
|
+
"font-weight": DesignToken,
|
|
795
|
+
"outline-offset": DesignToken,
|
|
796
|
+
"cancel-button": {
|
|
797
|
+
"background-image": DesignToken,
|
|
798
|
+
"color": DesignToken,
|
|
799
|
+
"height": DesignToken,
|
|
800
|
+
"width": DesignToken
|
|
801
|
+
},
|
|
802
|
+
"hover": {
|
|
803
|
+
"box-shadow": DesignToken
|
|
804
|
+
},
|
|
805
|
+
"placeholder": {
|
|
806
|
+
"color": DesignToken
|
|
807
|
+
},
|
|
808
|
+
"compact": {
|
|
809
|
+
"font-size": DesignToken,
|
|
810
|
+
"line-height": DesignToken
|
|
811
|
+
},
|
|
812
|
+
"spacious": {
|
|
813
|
+
"font-size": DesignToken,
|
|
814
|
+
"line-height": DesignToken
|
|
815
|
+
}
|
|
816
|
+
}
|
|
817
|
+
},
|
|
818
|
+
"skip-link": {
|
|
819
|
+
"background-color": DesignToken,
|
|
820
|
+
"color": DesignToken,
|
|
821
|
+
"font-family": DesignToken,
|
|
822
|
+
"font-weight": DesignToken,
|
|
823
|
+
"font-size": DesignToken,
|
|
824
|
+
"line-height": DesignToken,
|
|
825
|
+
"outline-offset": DesignToken,
|
|
826
|
+
"compact": {
|
|
827
|
+
"font-size": DesignToken,
|
|
828
|
+
"line-height": DesignToken
|
|
829
|
+
},
|
|
830
|
+
"hover": {
|
|
831
|
+
"background-color": DesignToken
|
|
832
|
+
}
|
|
833
|
+
},
|
|
834
|
+
"spotlight": {
|
|
835
|
+
"blue": {
|
|
836
|
+
"background-color": DesignToken
|
|
837
|
+
},
|
|
838
|
+
"dark-green": {
|
|
839
|
+
"background-color": DesignToken
|
|
840
|
+
},
|
|
841
|
+
"green": {
|
|
842
|
+
"background-color": DesignToken
|
|
843
|
+
},
|
|
844
|
+
"light-blue": {
|
|
845
|
+
"background-color": DesignToken
|
|
846
|
+
},
|
|
847
|
+
"magenta": {
|
|
848
|
+
"background-color": DesignToken
|
|
849
|
+
},
|
|
850
|
+
"orange": {
|
|
851
|
+
"background-color": DesignToken
|
|
852
|
+
},
|
|
853
|
+
"purple": {
|
|
854
|
+
"background-color": DesignToken
|
|
855
|
+
},
|
|
856
|
+
"yellow": {
|
|
857
|
+
"background-color": DesignToken
|
|
858
|
+
}
|
|
859
|
+
},
|
|
801
860
|
"switch": {
|
|
802
861
|
"font-family": DesignToken,
|
|
803
862
|
"background-color": DesignToken,
|
|
@@ -818,6 +877,38 @@ declare const tokens: {
|
|
|
818
877
|
"background-color": DesignToken
|
|
819
878
|
}
|
|
820
879
|
},
|
|
880
|
+
"text-input": {
|
|
881
|
+
"box-shadow": DesignToken,
|
|
882
|
+
"color": DesignToken,
|
|
883
|
+
"font-family": DesignToken,
|
|
884
|
+
"font-weight": DesignToken,
|
|
885
|
+
"outline-offset": DesignToken,
|
|
886
|
+
"disabled": {
|
|
887
|
+
"background-color": DesignToken,
|
|
888
|
+
"box-shadow": DesignToken,
|
|
889
|
+
"color": DesignToken
|
|
890
|
+
},
|
|
891
|
+
"hover": {
|
|
892
|
+
"box-shadow": DesignToken
|
|
893
|
+
},
|
|
894
|
+
"invalid": {
|
|
895
|
+
"box-shadow": DesignToken,
|
|
896
|
+
"hover": {
|
|
897
|
+
"box-shadow": DesignToken
|
|
898
|
+
}
|
|
899
|
+
},
|
|
900
|
+
"placeholder": {
|
|
901
|
+
"color": DesignToken
|
|
902
|
+
},
|
|
903
|
+
"compact": {
|
|
904
|
+
"font-size": DesignToken,
|
|
905
|
+
"line-height": DesignToken
|
|
906
|
+
},
|
|
907
|
+
"spacious": {
|
|
908
|
+
"font-size": DesignToken,
|
|
909
|
+
"line-height": DesignToken
|
|
910
|
+
}
|
|
911
|
+
},
|
|
821
912
|
"top-task-link": {
|
|
822
913
|
"description": {
|
|
823
914
|
"color": DesignToken,
|