@amsterdam/design-system-tokens 0.3.0 → 0.5.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.
Files changed (54) hide show
  1. package/CHANGELOG.md +37 -0
  2. package/build.js +99 -0
  3. package/dist/compact.css +16 -0
  4. package/dist/compact.d.ts +56 -0
  5. package/dist/compact.json +33 -0
  6. package/dist/compact.mjs +14 -0
  7. package/dist/compact.scss +13 -0
  8. package/dist/compact.theme.css +16 -0
  9. package/dist/index.css +169 -196
  10. package/dist/index.d.ts +1103 -508
  11. package/dist/index.json +1082 -495
  12. package/dist/{index.js → index.mjs} +189 -216
  13. package/dist/{_variables.scss → index.scss} +168 -195
  14. package/dist/{root.css → index.theme.css} +169 -196
  15. package/package.json +8 -11
  16. package/src/brand/amsterdam/color.tokens.json +5 -6
  17. package/src/brand/amsterdam/typography.compact.tokens.json +29 -0
  18. package/src/brand/amsterdam/typography.tokens.json +28 -62
  19. package/src/common/amsterdam/hyphenation.tokens.json +9 -0
  20. package/src/components/amsterdam/accordion.tokens.json +4 -10
  21. package/src/components/amsterdam/alert.tokens.json +8 -18
  22. package/src/components/amsterdam/badge.tokens.json +43 -0
  23. package/src/components/amsterdam/blockquote.tokens.json +3 -9
  24. package/src/components/amsterdam/breadcrumb.tokens.json +2 -8
  25. package/src/components/amsterdam/button.tokens.json +2 -8
  26. package/src/components/amsterdam/checkbox.tokens.json +5 -11
  27. package/src/components/amsterdam/dialog.tokens.json +2 -15
  28. package/src/components/amsterdam/form-label.tokens.json +2 -8
  29. package/src/components/amsterdam/grid.compact.tokens.json +14 -0
  30. package/src/components/amsterdam/grid.tokens.json +6 -18
  31. package/src/components/amsterdam/header.tokens.json +1 -1
  32. package/src/components/amsterdam/heading.tokens.json +22 -50
  33. package/src/components/amsterdam/icon-button.tokens.json +37 -0
  34. package/src/components/amsterdam/icon.tokens.json +14 -34
  35. package/src/components/amsterdam/link-list.tokens.json +45 -0
  36. package/src/components/amsterdam/link.tokens.json +2 -25
  37. package/src/components/amsterdam/mega-menu.tokens.json +12 -0
  38. package/src/components/amsterdam/ordered-list.tokens.json +2 -8
  39. package/src/components/amsterdam/page-heading.tokens.json +2 -8
  40. package/src/components/amsterdam/page-menu.tokens.json +2 -8
  41. package/src/components/amsterdam/pagination.tokens.json +2 -8
  42. package/src/components/amsterdam/paragraph.tokens.json +10 -26
  43. package/src/components/amsterdam/search-field.tokens.json +4 -10
  44. package/src/components/amsterdam/skip-link.tokens.json +2 -6
  45. package/src/components/amsterdam/spotlight.tokens.json +3 -3
  46. package/src/components/amsterdam/table.tokens.json +20 -0
  47. package/src/components/amsterdam/text-input.tokens.json +2 -8
  48. package/src/components/amsterdam/top-task-link.tokens.json +4 -16
  49. package/src/components/amsterdam/unordered-list.tokens.json +2 -8
  50. package/dist/index.tokens.json +0 -1187
  51. package/dist/tokens.d.ts +0 -1210
  52. package/dist/tokens.js +0 -11291
  53. package/dist/variables.less +0 -499
  54. package/style-dictionary.config.json +0 -101
package/dist/variables.less DELETED
@@ -1,499 +0,0 @@
1
-
2
- // Do not edit directly
3
- // Generated on Fri, 22 Dec 2023 12:50:01 GMT
4
-
5
- @utrecht-button-subtle-disabled-background-color: transparent;
6
- @utrecht-button-subtle-background-color: transparent;
7
- @utrecht-focus-outline-offset: 2px;
8
- @utrecht-action-submit-cursor: pointer;
9
- @utrecht-action-navigate-cursor: pointer;
10
- @utrecht-action-inert-cursor: default;
11
- @utrecht-action-disabled-cursor: not-allowed;
12
- @utrecht-action-busy-cursor: wait;
13
- @utrecht-action-activate-cursor: pointer;
14
- @amsterdam-unordered-list-unordered-list-item-padding-inline-start: 0.875rem; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
15
- @amsterdam-unordered-list-unordered-list-item-margin-inline-start: 0.875rem; // Indent less than the parent to start-align the child’s marker with the parent text.
16
- @amsterdam-unordered-list-unordered-list-list-style-type: '\2013';
17
- @amsterdam-unordered-list-item-padding-inline-start: 0.875rem; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
18
- @amsterdam-unordered-list-item-margin-inline-start: 1.625rem; // Divide your total indentation width over margin and padding to position the marker.
19
- @amsterdam-unordered-list-list-style-type: '\2022';
20
- @amsterdam-unordered-list-gap: 0.75rem;
21
- @amsterdam-switch-thumb-height: 1.75rem;
22
- @amsterdam-switch-thumb-width: 1.75rem;
23
- @amsterdam-switch-width: 3.5rem;
24
- @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>");
25
- @amsterdam-screen-x-wide-max-width: 132rem;
26
- @amsterdam-screen-wide-max-width: 100rem;
27
- @amsterdam-page-menu-item-gap: 0.5rem;
28
- @amsterdam-page-menu-row-gap: 0.5rem;
29
- @amsterdam-page-menu-column-gap: 2.5rem;
30
- @amsterdam-ordered-list-ordered-list-item-padding-inline-start: 0.25rem; // The total level >=2 indentation for Amsterdam is 28 pixels, or 1.75rem.
31
- @amsterdam-ordered-list-ordered-list-item-margin-inline-start: 1.5rem; // Indent less than the parent to start-align the child’s marker with the parent text.
32
- @amsterdam-ordered-list-ordered-list-list-style-type: lower-alpha;
33
- @amsterdam-ordered-list-item-padding-inline-start: 0.25rem; // The total level 1 indentation for Amsterdam is 40 pixels, or 2.5rem.
34
- @amsterdam-ordered-list-item-margin-inline-start: 2.25rem; // Divide your total indentation width over margin and padding to position the marker.
35
- @amsterdam-ordered-list-list-style-type: decimal;
36
- @amsterdam-ordered-list-gap: 0.75rem;
37
- @amsterdam-mark-background-color: var(--amsterdam-color-yellow);
38
- @amsterdam-logo-height: 2.5rem;
39
- @amsterdam-link-in-list-gap: 0.5em;
40
- @amsterdam-link-inline-line-height: inherit;
41
- @amsterdam-link-inline-font-size: inherit;
42
- @amsterdam-link-inline-font-family: inherit;
43
- @amsterdam-grid-wide-column-count: 12;
44
- @amsterdam-grid-medium-column-count: 8;
45
- @amsterdam-grid-compact-padding-inline: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); // Equals the gap.
46
- @amsterdam-grid-compact-gap: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); // Grows from 16px at 1088px wide to 40px at 2624px wide.
47
- @amsterdam-grid-spacious-padding-inline: clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem); // Equals 1.5 times the gap.
48
- @amsterdam-grid-spacious-gap: clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem); // Grows from 16px at 320px wide to 56px at 1600px wide.
49
- @amsterdam-grid-column-count: 4;
50
- @amsterdam-dialog-footer-padding-block: 1.5rem 0;
51
- @amsterdam-dialog-footer-gap: 1rem;
52
- @amsterdam-dialog-header-gap: 1rem;
53
- @amsterdam-dialog-article-padding-inline-end: 1.5rem;
54
- @amsterdam-dialog-form-max-block-size: 75vh;
55
- @amsterdam-dialog-form-padding-inline: clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem);
56
- @amsterdam-dialog-form-padding-block: clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem);
57
- @amsterdam-dialog-form-gap: 1.5rem;
58
- @amsterdam-dialog-close-background-color: transparent;
59
- @amsterdam-dialog-backdrop-background: #0006;
60
- @amsterdam-dialog-max-inline-size: min(87.69vw, 45rem);
61
- @amsterdam-dialog-border: 0;
62
- @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>");
63
- @amsterdam-alert-close-background-color: transparent;
64
- @amsterdam-alert-gap: 1rem;
65
- @amsterdam-spacing-inset-xl: 2.5rem;
66
- @amsterdam-spacing-inset-lg: 1.5rem;
67
- @amsterdam-spacing-inset-md: 1rem;
68
- @amsterdam-spacing-inset-sm: 0.5rem;
69
- @amsterdam-link-appearance-subtle-hover-text-decoration-line: underline;
70
- @amsterdam-link-appearance-subtle-text-decoration-line: none;
71
- @amsterdam-link-appearance-regular-hover-text-underline-offset: 0.3125rem;
72
- @amsterdam-link-appearance-regular-hover-text-decoration-thickness: 0.1875rem;
73
- @amsterdam-link-appearance-regular-text-decoration-line: underline;
74
- @amsterdam-link-appearance-text-underline-offset: 0.375rem;
75
- @amsterdam-link-appearance-text-decoration-thickness: 0.125rem;
76
- @amsterdam-focus-outline-offset: 2px;
77
- @amsterdam-border-width-lg: 3px;
78
- @amsterdam-border-width-md: 2px;
79
- @amsterdam-border-width-sm: 1px;
80
- @amsterdam-typography-compact-text-level-6-line-height: 1.6;
81
- @amsterdam-typography-compact-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
82
- @amsterdam-typography-compact-text-level-5-line-height: 1.6;
83
- @amsterdam-typography-compact-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
84
- @amsterdam-typography-compact-text-level-4-line-height: 1.5;
85
- @amsterdam-typography-compact-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
86
- @amsterdam-typography-compact-text-level-3-line-height: 1.3;
87
- @amsterdam-typography-compact-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
88
- @amsterdam-typography-compact-text-level-2-line-height: 1.25;
89
- @amsterdam-typography-compact-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
90
- @amsterdam-typography-compact-text-level-1-line-height: 1.2;
91
- @amsterdam-typography-compact-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
92
- @amsterdam-typography-compact-text-level-0-line-height: 1.15;
93
- @amsterdam-typography-compact-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
94
- @amsterdam-typography-spacious-text-level-6-line-height: 1.6;
95
- @amsterdam-typography-spacious-text-level-6-font-size: clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem);
96
- @amsterdam-typography-spacious-text-level-5-line-height: 1.6;
97
- @amsterdam-typography-spacious-text-level-5-font-size: clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem);
98
- @amsterdam-typography-spacious-text-level-4-line-height: 1.5;
99
- @amsterdam-typography-spacious-text-level-4-font-size: clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem);
100
- @amsterdam-typography-spacious-text-level-3-line-height: 1.3;
101
- @amsterdam-typography-spacious-text-level-3-font-size: clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem);
102
- @amsterdam-typography-spacious-text-level-2-line-height: 1.25;
103
- @amsterdam-typography-spacious-text-level-2-font-size: clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem);
104
- @amsterdam-typography-spacious-text-level-1-line-height: 1.2;
105
- @amsterdam-typography-spacious-text-level-1-font-size: clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem);
106
- @amsterdam-typography-spacious-text-level-0-line-height: 1.15;
107
- @amsterdam-typography-spacious-text-level-0-font-size: clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem);
108
- @amsterdam-typography-font-weight-bold: 800;
109
- @amsterdam-typography-font-weight-normal: 400;
110
- @amsterdam-typography-font-family: 'Amsterdam Sans', Arial, sans-serif;
111
- @amsterdam-proportion-2x-wide: 32 / 9;
112
- @amsterdam-proportion-x-wide: 16 / 9;
113
- @amsterdam-proportion-wide: 5 / 4;
114
- @amsterdam-proportion-square: 1 / 1;
115
- @amsterdam-proportion-tall: 4 / 5;
116
- @amsterdam-proportion-x-tall: 9 / 16;
117
- @amsterdam-color-neutral-grey4: #323232;
118
- @amsterdam-color-neutral-grey3: #767676;
119
- @amsterdam-color-neutral-grey2: #B4B4B4;
120
- @amsterdam-color-neutral-grey1: #E6E6E6;
121
- @amsterdam-color-magenta: #E50082;
122
- @amsterdam-color-purple: #A00078;
123
- @amsterdam-color-blue: #009DEC;
124
- @amsterdam-color-dark-green: #00A03C;
125
- @amsterdam-color-green: #BED200;
126
- @amsterdam-color-yellow: #FFE600;
127
- @amsterdam-color-orange: #FF9100;
128
- @amsterdam-color-dark-blue: #102E62;
129
- @amsterdam-color-primary-red: #EC0000;
130
- @amsterdam-color-primary-blue: #004699;
131
- @amsterdam-color-primary-white: #ffffff;
132
- @amsterdam-color-primary-black: #000000;
133
- @utrecht-button-subtle-disabled-color: @amsterdam-color-neutral-grey2;
134
- @utrecht-button-subtle-focus-color: @amsterdam-color-dark-blue;
135
- @utrecht-button-subtle-hover-color: @amsterdam-color-dark-blue;
136
- @utrecht-button-subtle-color: @amsterdam-color-primary-blue;
137
- @utrecht-button-secondary-action-disabled-color: @amsterdam-color-neutral-grey2;
138
- @utrecht-button-secondary-action-disabled-background-color: @amsterdam-color-primary-white;
139
- @utrecht-button-secondary-action-hover-color: @amsterdam-color-dark-blue;
140
- @utrecht-button-secondary-action-color: @amsterdam-color-primary-blue;
141
- @utrecht-button-secondary-action-background-color: @amsterdam-color-primary-white;
142
- @utrecht-button-primary-action-hover-background-color: @amsterdam-color-dark-blue;
143
- @utrecht-button-primary-action-disabled-background-color: @amsterdam-color-neutral-grey2;
144
- @utrecht-button-primary-action-color: @amsterdam-color-primary-white;
145
- @utrecht-button-primary-action-background-color: @amsterdam-color-primary-blue;
146
- @utrecht-button-disabled-color: @amsterdam-color-primary-white;
147
- @utrecht-button-disabled-background-color: @amsterdam-color-neutral-grey2;
148
- @utrecht-button-padding-block-end: @amsterdam-spacing-inset-sm;
149
- @utrecht-button-padding-block-start: @amsterdam-spacing-inset-sm;
150
- @utrecht-button-padding-inline-end: @amsterdam-spacing-inset-md;
151
- @utrecht-button-padding-inline-start: @amsterdam-spacing-inset-md;
152
- @utrecht-button-font-family: @amsterdam-typography-font-family;
153
- @utrecht-button-color: @amsterdam-color-primary-white;
154
- @utrecht-button-background-color: @amsterdam-color-primary-blue;
155
- @amsterdam-unordered-list-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
156
- @amsterdam-unordered-list-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
157
- @amsterdam-unordered-list-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
158
- @amsterdam-unordered-list-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
159
- @amsterdam-unordered-list-font-weight: @amsterdam-typography-font-weight-normal;
160
- @amsterdam-unordered-list-font-family: @amsterdam-typography-font-family;
161
- @amsterdam-unordered-list-color: @amsterdam-color-primary-black;
162
- @amsterdam-top-task-link-outline-offset: @amsterdam-focus-outline-offset;
163
- @amsterdam-top-task-link-label-compact-line-height: @amsterdam-typography-compact-text-level-4-line-height;
164
- @amsterdam-top-task-link-label-compact-font-size: @amsterdam-typography-compact-text-level-4-font-size;
165
- @amsterdam-top-task-link-label-spacious-line-height: @amsterdam-typography-spacious-text-level-4-line-height;
166
- @amsterdam-top-task-link-label-spacious-font-size: @amsterdam-typography-spacious-text-level-4-font-size;
167
- @amsterdam-top-task-link-label-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
168
- @amsterdam-top-task-link-label-hover-color: @amsterdam-color-dark-blue;
169
- @amsterdam-top-task-link-label-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
170
- @amsterdam-top-task-link-label-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
171
- @amsterdam-top-task-link-label-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
172
- @amsterdam-top-task-link-label-font-weight: @amsterdam-typography-font-weight-bold;
173
- @amsterdam-top-task-link-label-font-family: @amsterdam-typography-font-family;
174
- @amsterdam-top-task-link-description-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
175
- @amsterdam-top-task-link-description-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
176
- @amsterdam-top-task-link-description-spacious-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
177
- @amsterdam-top-task-link-description-spacious-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
178
- @amsterdam-top-task-link-description-font-weight: @amsterdam-typography-font-weight-normal;
179
- @amsterdam-top-task-link-description-font-family: @amsterdam-typography-font-family;
180
- @amsterdam-top-task-link-description-color: @amsterdam-color-primary-black;
181
- @amsterdam-text-input-spacious-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
182
- @amsterdam-text-input-spacious-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
183
- @amsterdam-text-input-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
184
- @amsterdam-text-input-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
185
- @amsterdam-text-input-placeholder-color: @amsterdam-color-neutral-grey3;
186
- @amsterdam-text-input-invalid-hover-box-shadow: inset 0 0 0 2px @amsterdam-color-primary-red;
187
- @amsterdam-text-input-invalid-box-shadow: inset 0 0 0 1px @amsterdam-color-primary-red;
188
- @amsterdam-text-input-hover-box-shadow: inset 0 0 0 2px @amsterdam-color-primary-black;
189
- @amsterdam-text-input-disabled-color: @amsterdam-color-neutral-grey2;
190
- @amsterdam-text-input-disabled-box-shadow: inset 0 0 0 1px @amsterdam-color-neutral-grey2;
191
- @amsterdam-text-input-disabled-background-color: @amsterdam-color-primary-white;
192
- @amsterdam-text-input-outline-offset: @amsterdam-focus-outline-offset;
193
- @amsterdam-text-input-font-weight: @amsterdam-typography-font-weight-normal;
194
- @amsterdam-text-input-font-family: @amsterdam-typography-font-family;
195
- @amsterdam-text-input-color: @amsterdam-color-primary-black;
196
- @amsterdam-text-input-box-shadow: inset 0 0 0 1px @amsterdam-color-primary-black;
197
- @amsterdam-switch-disabled-background-color: @amsterdam-color-neutral-grey2;
198
- @amsterdam-switch-outline-offset: @amsterdam-focus-outline-offset;
199
- @amsterdam-switch-checked-background-color: @amsterdam-color-primary-blue;
200
- @amsterdam-switch-thumb-hover-color: @amsterdam-color-dark-blue;
201
- @amsterdam-switch-thumb-background-color: @amsterdam-color-primary-white;
202
- @amsterdam-switch-background-color: @amsterdam-color-neutral-grey3;
203
- @amsterdam-switch-font-family: @amsterdam-typography-font-family;
204
- @amsterdam-spotlight-yellow-background-color: @amsterdam-color-yellow;
205
- @amsterdam-spotlight-purple-background-color: @amsterdam-color-purple;
206
- @amsterdam-spotlight-orange-background-color: @amsterdam-color-orange;
207
- @amsterdam-spotlight-magenta-background-color: @amsterdam-color-magenta;
208
- @amsterdam-spotlight-light-blue-background-color: @amsterdam-color-blue;
209
- @amsterdam-spotlight-green-background-color: @amsterdam-color-green;
210
- @amsterdam-spotlight-dark-green-background-color: @amsterdam-color-dark-green;
211
- @amsterdam-spotlight-blue-background-color: @amsterdam-color-primary-blue;
212
- @amsterdam-skip-link-hover-background-color: @amsterdam-color-dark-blue;
213
- @amsterdam-skip-link-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
214
- @amsterdam-skip-link-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
215
- @amsterdam-skip-link-outline-offset: @amsterdam-focus-outline-offset;
216
- @amsterdam-skip-link-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
217
- @amsterdam-skip-link-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
218
- @amsterdam-skip-link-font-weight: @amsterdam-typography-font-weight-normal;
219
- @amsterdam-skip-link-font-family: @amsterdam-typography-font-family;
220
- @amsterdam-skip-link-color: @amsterdam-color-primary-white;
221
- @amsterdam-skip-link-background-color: @amsterdam-color-primary-blue;
222
- @amsterdam-search-field-input-spacious-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
223
- @amsterdam-search-field-input-spacious-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
224
- @amsterdam-search-field-input-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
225
- @amsterdam-search-field-input-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
226
- @amsterdam-search-field-input-placeholder-color: @amsterdam-color-neutral-grey3;
227
- @amsterdam-search-field-input-hover-box-shadow: inset 0 0 0 2px @amsterdam-color-primary-black;
228
- @amsterdam-search-field-input-cancel-button-width: @amsterdam-typography-spacious-text-level-6-font-size;
229
- @amsterdam-search-field-input-cancel-button-height: @amsterdam-typography-spacious-text-level-6-font-size;
230
- @amsterdam-search-field-input-cancel-button-color: @amsterdam-color-primary-blue;
231
- @amsterdam-search-field-input-outline-offset: @amsterdam-focus-outline-offset;
232
- @amsterdam-search-field-input-font-weight: @amsterdam-typography-font-weight-normal;
233
- @amsterdam-search-field-input-font-family: @amsterdam-typography-font-family;
234
- @amsterdam-search-field-input-color: @amsterdam-color-primary-black;
235
- @amsterdam-search-field-input-box-shadow: inset 0 0 0 1px @amsterdam-color-primary-black;
236
- @amsterdam-search-field-button-hover-background-color: @amsterdam-color-dark-blue;
237
- @amsterdam-search-field-button-outline-offset: @amsterdam-focus-outline-offset;
238
- @amsterdam-search-field-button-color: @amsterdam-color-primary-white;
239
- @amsterdam-search-field-button-background-color: @amsterdam-color-primary-blue;
240
- @amsterdam-paragraph-compact-large-line-height: @amsterdam-typography-compact-text-level-4-line-height;
241
- @amsterdam-paragraph-compact-large-font-size: @amsterdam-typography-compact-text-level-4-font-size;
242
- @amsterdam-paragraph-compact-medium-line-height: @amsterdam-typography-compact-text-level-5-line-height;
243
- @amsterdam-paragraph-compact-medium-font-size: @amsterdam-typography-compact-text-level-5-font-size;
244
- @amsterdam-paragraph-compact-small-line-height: @amsterdam-typography-compact-text-level-6-line-height;
245
- @amsterdam-paragraph-compact-small-font-size: @amsterdam-typography-compact-text-level-6-font-size;
246
- @amsterdam-paragraph-spacious-large-line-height: @amsterdam-typography-spacious-text-level-4-line-height;
247
- @amsterdam-paragraph-spacious-large-font-size: @amsterdam-typography-spacious-text-level-4-font-size;
248
- @amsterdam-paragraph-spacious-medium-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
249
- @amsterdam-paragraph-spacious-medium-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
250
- @amsterdam-paragraph-spacious-small-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
251
- @amsterdam-paragraph-spacious-small-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
252
- @amsterdam-paragraph-inverse-color: @amsterdam-color-primary-white;
253
- @amsterdam-paragraph-font-weight: @amsterdam-typography-font-weight-normal;
254
- @amsterdam-paragraph-font-family: @amsterdam-typography-font-family;
255
- @amsterdam-paragraph-color: @amsterdam-color-primary-black;
256
- @amsterdam-pagination-button-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
257
- @amsterdam-pagination-button-current-font-weight: @amsterdam-typography-font-weight-bold;
258
- @amsterdam-pagination-button-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
259
- @amsterdam-pagination-button-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
260
- @amsterdam-pagination-button-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
261
- @amsterdam-pagination-button-outline-offset: @amsterdam-focus-outline-offset;
262
- @amsterdam-pagination-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
263
- @amsterdam-pagination-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
264
- @amsterdam-pagination-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
265
- @amsterdam-pagination-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
266
- @amsterdam-pagination-font-weight: @amsterdam-typography-font-weight-normal;
267
- @amsterdam-pagination-font-family: @amsterdam-typography-font-family;
268
- @amsterdam-page-menu-item-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
269
- @amsterdam-page-menu-item-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
270
- @amsterdam-page-menu-item-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
271
- @amsterdam-page-menu-item-spacious-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
272
- @amsterdam-page-menu-item-spacious-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
273
- @amsterdam-page-menu-item-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
274
- @amsterdam-page-menu-item-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
275
- @amsterdam-page-menu-item-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
276
- @amsterdam-page-menu-item-outline-offset: @amsterdam-focus-outline-offset;
277
- @amsterdam-page-menu-item-font-weight: @amsterdam-typography-font-weight-normal;
278
- @amsterdam-page-menu-item-font-family: @amsterdam-typography-font-family;
279
- @amsterdam-page-heading-compact-line-height: @amsterdam-typography-compact-text-level-0-font-size;
280
- @amsterdam-page-heading-compact-font-size: @amsterdam-typography-compact-text-level-0-font-size;
281
- @amsterdam-page-heading-spacious-line-height: @amsterdam-typography-spacious-text-level-0-font-size;
282
- @amsterdam-page-heading-spacious-font-size: @amsterdam-typography-spacious-text-level-0-font-size;
283
- @amsterdam-page-heading-inverse-color: @amsterdam-color-primary-white;
284
- @amsterdam-page-heading-font-weight: @amsterdam-typography-font-weight-bold;
285
- @amsterdam-page-heading-font-family: @amsterdam-typography-font-family;
286
- @amsterdam-page-heading-color: @amsterdam-color-primary-black;
287
- @amsterdam-ordered-list-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
288
- @amsterdam-ordered-list-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
289
- @amsterdam-ordered-list-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
290
- @amsterdam-ordered-list-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
291
- @amsterdam-ordered-list-font-weight: @amsterdam-typography-font-weight-normal;
292
- @amsterdam-ordered-list-font-family: @amsterdam-typography-font-family;
293
- @amsterdam-ordered-list-color: @amsterdam-color-primary-black;
294
- @amsterdam-logo-subsite-color: @amsterdam-color-primary-black;
295
- @amsterdam-logo-title-color: @amsterdam-color-primary-red;
296
- @amsterdam-logo-emblem-color: @amsterdam-color-primary-red;
297
- @amsterdam-link-standalone-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
298
- @amsterdam-link-standalone-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
299
- @amsterdam-link-standalone-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
300
- @amsterdam-link-standalone-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
301
- @amsterdam-link-standalone-hover-text-underline-offset: @amsterdam-link-appearance-regular-hover-text-underline-offset;
302
- @amsterdam-link-standalone-hover-text-decoration-thickness: @amsterdam-link-appearance-regular-hover-text-decoration-thickness;
303
- @amsterdam-link-standalone-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
304
- @amsterdam-link-standalone-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
305
- @amsterdam-link-standalone-text-decoration-line: @amsterdam-link-appearance-regular-text-decoration-line;
306
- @amsterdam-link-in-list-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
307
- @amsterdam-link-in-list-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
308
- @amsterdam-link-in-list-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
309
- @amsterdam-link-in-list-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
310
- @amsterdam-link-in-list-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
311
- @amsterdam-link-in-list-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
312
- @amsterdam-link-in-list-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
313
- @amsterdam-link-in-list-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
314
- @amsterdam-link-inline-visited-color: @amsterdam-color-purple;
315
- @amsterdam-link-inline-hover-text-underline-offset: @amsterdam-link-appearance-regular-hover-text-underline-offset;
316
- @amsterdam-link-inline-hover-text-decoration-thickness: @amsterdam-link-appearance-regular-hover-text-decoration-thickness;
317
- @amsterdam-link-inline-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
318
- @amsterdam-link-inline-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
319
- @amsterdam-link-inline-text-decoration-line: @amsterdam-link-appearance-regular-text-decoration-line;
320
- @amsterdam-link-outline-offset: @amsterdam-focus-outline-offset;
321
- @amsterdam-link-font-weight: @amsterdam-typography-font-weight-normal;
322
- @amsterdam-link-font-family: @amsterdam-typography-font-family;
323
- @amsterdam-icon-compact-size-6-line-height: @amsterdam-typography-compact-text-level-6-line-height;
324
- @amsterdam-icon-compact-size-6-font-size: @amsterdam-typography-compact-text-level-6-font-size;
325
- @amsterdam-icon-compact-size-5-line-height: @amsterdam-typography-compact-text-level-5-line-height;
326
- @amsterdam-icon-compact-size-5-font-size: @amsterdam-typography-compact-text-level-5-font-size;
327
- @amsterdam-icon-compact-size-4-line-height: @amsterdam-typography-compact-text-level-4-line-height;
328
- @amsterdam-icon-compact-size-4-font-size: @amsterdam-typography-compact-text-level-4-font-size;
329
- @amsterdam-icon-compact-size-3-line-height: @amsterdam-typography-compact-text-level-3-line-height;
330
- @amsterdam-icon-compact-size-3-font-size: @amsterdam-typography-compact-text-level-3-font-size;
331
- @amsterdam-icon-spacious-size-6-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
332
- @amsterdam-icon-spacious-size-6-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
333
- @amsterdam-icon-spacious-size-5-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
334
- @amsterdam-icon-spacious-size-5-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
335
- @amsterdam-icon-spacious-size-4-line-height: @amsterdam-typography-spacious-text-level-4-line-height;
336
- @amsterdam-icon-spacious-size-4-font-size: @amsterdam-typography-spacious-text-level-4-font-size;
337
- @amsterdam-icon-spacious-size-3-line-height: @amsterdam-typography-spacious-text-level-3-line-height;
338
- @amsterdam-icon-spacious-size-3-font-size: @amsterdam-typography-spacious-text-level-3-font-size;
339
- @amsterdam-heading-compact-level-6-font-size: @amsterdam-typography-compact-text-level-6-font-size;
340
- @amsterdam-heading-compact-level-6-line-height: @amsterdam-typography-compact-text-level-6-line-height;
341
- @amsterdam-heading-compact-level-5-font-size: @amsterdam-typography-compact-text-level-5-font-size;
342
- @amsterdam-heading-compact-level-5-line-height: @amsterdam-typography-compact-text-level-5-line-height;
343
- @amsterdam-heading-compact-level-4-font-size: @amsterdam-typography-compact-text-level-4-font-size;
344
- @amsterdam-heading-compact-level-4-line-height: @amsterdam-typography-compact-text-level-4-line-height;
345
- @amsterdam-heading-compact-level-3-font-size: @amsterdam-typography-compact-text-level-3-font-size;
346
- @amsterdam-heading-compact-level-3-line-height: @amsterdam-typography-compact-text-level-3-line-height;
347
- @amsterdam-heading-compact-level-2-font-size: @amsterdam-typography-compact-text-level-2-font-size;
348
- @amsterdam-heading-compact-level-2-line-height: @amsterdam-typography-compact-text-level-2-line-height;
349
- @amsterdam-heading-compact-level-1-font-size: @amsterdam-typography-compact-text-level-1-font-size;
350
- @amsterdam-heading-compact-level-1-line-height: @amsterdam-typography-compact-text-level-1-line-height;
351
- @amsterdam-heading-spacious-level-6-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
352
- @amsterdam-heading-spacious-level-6-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
353
- @amsterdam-heading-spacious-level-5-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
354
- @amsterdam-heading-spacious-level-5-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
355
- @amsterdam-heading-spacious-level-4-font-size: @amsterdam-typography-spacious-text-level-4-font-size;
356
- @amsterdam-heading-spacious-level-4-line-height: @amsterdam-typography-spacious-text-level-4-line-height;
357
- @amsterdam-heading-spacious-level-3-font-size: @amsterdam-typography-spacious-text-level-3-font-size;
358
- @amsterdam-heading-spacious-level-3-line-height: @amsterdam-typography-spacious-text-level-3-line-height;
359
- @amsterdam-heading-spacious-level-2-font-size: @amsterdam-typography-spacious-text-level-2-font-size;
360
- @amsterdam-heading-spacious-level-2-line-height: @amsterdam-typography-spacious-text-level-2-line-height;
361
- @amsterdam-heading-spacious-level-1-font-size: @amsterdam-typography-spacious-text-level-1-font-size;
362
- @amsterdam-heading-spacious-level-1-line-height: @amsterdam-typography-spacious-text-level-1-line-height;
363
- @amsterdam-heading-inverse-color: @amsterdam-color-primary-white;
364
- @amsterdam-heading-font-weight: @amsterdam-typography-font-weight-bold;
365
- @amsterdam-heading-font-family: @amsterdam-typography-font-family;
366
- @amsterdam-heading-color: @amsterdam-color-primary-black;
367
- @amsterdam-header-column-gap: @amsterdam-grid-spacious-gap;
368
- @amsterdam-form-label-compact-line-height: @amsterdam-typography-compact-text-level-4-line-height;
369
- @amsterdam-form-label-compact-font-size: @amsterdam-typography-compact-text-level-4-font-size;
370
- @amsterdam-form-label-spacious-line-height: @amsterdam-typography-spacious-text-level-4-line-height;
371
- @amsterdam-form-label-spacious-font-size: @amsterdam-typography-spacious-text-level-4-font-size;
372
- @amsterdam-form-label-font-weight: @amsterdam-typography-font-weight-bold;
373
- @amsterdam-form-label-font-family: @amsterdam-typography-font-family;
374
- @amsterdam-form-label-color: @amsterdam-color-primary-black;
375
- @amsterdam-dialog-close-hover-fill: @amsterdam-color-primary-blue;
376
- @amsterdam-dialog-close-fill: @amsterdam-color-primary-black;
377
- @amsterdam-dialog-title-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
378
- @amsterdam-dialog-title-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
379
- @amsterdam-dialog-title-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
380
- @amsterdam-dialog-title-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
381
- @amsterdam-dialog-title-font-weight: @amsterdam-typography-font-weight-bold;
382
- @amsterdam-dialog-title-font-family: @amsterdam-typography-font-family;
383
- @amsterdam-dialog-title-color: @amsterdam-color-primary-black;
384
- @amsterdam-dialog-background-color: @amsterdam-color-primary-white;
385
- @amsterdam-checkbox-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
386
- @amsterdam-checkbox-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
387
- @amsterdam-checkbox-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
388
- @amsterdam-checkbox-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
389
- @amsterdam-checkbox-outline-offset: @amsterdam-focus-outline-offset;
390
- @amsterdam-checkbox-hover-color: @amsterdam-color-dark-blue;
391
- @amsterdam-checkbox-font-weight: @amsterdam-typography-font-weight-normal;
392
- @amsterdam-checkbox-font-family: @amsterdam-typography-font-family;
393
- @amsterdam-checkbox-disabled-color: @amsterdam-color-neutral-grey3;
394
- @amsterdam-checkbox-checkmark-indeterminate-hover-background-color: @amsterdam-color-dark-blue;
395
- @amsterdam-checkbox-checkmark-indeterminate-background-color: @amsterdam-color-primary-blue;
396
- @amsterdam-checkbox-checkmark-invalid-indeterminate-hover-background-color: @amsterdam-color-primary-red;
397
- @amsterdam-checkbox-checkmark-invalid-indeterminate-background-color: @amsterdam-color-primary-red;
398
- @amsterdam-checkbox-checkmark-invalid-hover-border-color: @amsterdam-color-primary-red;
399
- @amsterdam-checkbox-checkmark-invalid-checked-hover-background-color: @amsterdam-color-primary-red;
400
- @amsterdam-checkbox-checkmark-invalid-checked-background-color: @amsterdam-color-primary-red;
401
- @amsterdam-checkbox-checkmark-invalid-border-color: @amsterdam-color-primary-red;
402
- @amsterdam-checkbox-checkmark-hover-border-color: @amsterdam-color-dark-blue;
403
- @amsterdam-checkbox-checkmark-disabled-indeterminate-hover-background-color: @amsterdam-color-neutral-grey3;
404
- @amsterdam-checkbox-checkmark-disabled-indeterminate-background-color: @amsterdam-color-neutral-grey3;
405
- @amsterdam-checkbox-checkmark-disabled-checked-hover-background-color: @amsterdam-color-neutral-grey3;
406
- @amsterdam-checkbox-checkmark-disabled-checked-background-color: @amsterdam-color-neutral-grey3;
407
- @amsterdam-checkbox-checkmark-disabled-border-color: @amsterdam-color-neutral-grey3;
408
- @amsterdam-checkbox-checkmark-checked-hover-background-color: @amsterdam-color-dark-blue;
409
- @amsterdam-checkbox-checkmark-checked-background-color: @amsterdam-color-primary-blue;
410
- @amsterdam-checkbox-checkmark-border-color: @amsterdam-color-primary-blue;
411
- @amsterdam-checkbox-color: @amsterdam-color-primary-black;
412
- @amsterdam-card-outline-offset: @amsterdam-focus-outline-offset;
413
- @amsterdam-card-link-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
414
- @amsterdam-card-link-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
415
- @amsterdam-card-link-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
416
- @amsterdam-card-link-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
417
- @amsterdam-button-tertiary-hover-box-shadow: inset 0 0 0 2px @amsterdam-color-dark-blue;
418
- @amsterdam-button-secondary-focus-box-shadow: inset 0 0 0 2px @amsterdam-color-primary-blue;
419
- @amsterdam-button-secondary-disabled-box-shadow: inset 0 0 0 2px @amsterdam-color-neutral-grey2;
420
- @amsterdam-button-secondary-hover-box-shadow: inset 0 0 0 3px @amsterdam-color-dark-blue;
421
- @amsterdam-button-secondary-box-shadow: inset 0 0 0 2px @amsterdam-color-primary-blue;
422
- @amsterdam-button-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
423
- @amsterdam-button-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
424
- @amsterdam-button-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
425
- @amsterdam-button-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
426
- @amsterdam-breadcrumb-compact-line-height: @amsterdam-typography-compact-text-level-6-line-height;
427
- @amsterdam-breadcrumb-compact-font-size: @amsterdam-typography-compact-text-level-6-font-size;
428
- @amsterdam-breadcrumb-spacious-line-height: @amsterdam-typography-spacious-text-level-6-line-height;
429
- @amsterdam-breadcrumb-spacious-font-size: @amsterdam-typography-spacious-text-level-6-font-size;
430
- @amsterdam-breadcrumb-item-link-hover-text-decoration-line: @amsterdam-link-appearance-subtle-hover-text-decoration-line;
431
- @amsterdam-breadcrumb-item-link-hover-color: @amsterdam-color-dark-blue;
432
- @amsterdam-breadcrumb-item-link-text-underline-offset: @amsterdam-link-appearance-text-underline-offset;
433
- @amsterdam-breadcrumb-item-link-text-decoration-thickness: @amsterdam-link-appearance-text-decoration-thickness;
434
- @amsterdam-breadcrumb-item-link-text-decoration-line: @amsterdam-link-appearance-subtle-text-decoration-line;
435
- @amsterdam-breadcrumb-item-link-outline-offset: @amsterdam-focus-outline-offset;
436
- @amsterdam-breadcrumb-font-weight: @amsterdam-typography-font-weight-normal;
437
- @amsterdam-breadcrumb-font-family: @amsterdam-typography-font-family;
438
- @amsterdam-blockquote-compact-line-height: @amsterdam-typography-compact-text-level-3-line-height;
439
- @amsterdam-blockquote-compact-font-size: @amsterdam-typography-compact-text-level-3-font-size;
440
- @amsterdam-blockquote-spacious-line-height: @amsterdam-typography-spacious-text-level-3-line-height;
441
- @amsterdam-blockquote-spacious-font-size: @amsterdam-typography-spacious-text-level-3-font-size;
442
- @amsterdam-blockquote-inverse-color: @amsterdam-color-primary-white;
443
- @amsterdam-blockquote-font-weight: @amsterdam-typography-font-weight-bold;
444
- @amsterdam-blockquote-font-family: @amsterdam-typography-font-family;
445
- @amsterdam-blockquote-color: @amsterdam-color-primary-black;
446
- @amsterdam-aspect-ratio-2x-wide: @amsterdam-proportion-2x-wide;
447
- @amsterdam-aspect-ratio-x-wide: @amsterdam-proportion-x-wide;
448
- @amsterdam-aspect-ratio-wide: @amsterdam-proportion-wide;
449
- @amsterdam-aspect-ratio-square: @amsterdam-proportion-square;
450
- @amsterdam-aspect-ratio-tall: @amsterdam-proportion-tall;
451
- @amsterdam-aspect-ratio-x-tall: @amsterdam-proportion-x-tall;
452
- @amsterdam-alert-close-hover-fill: @amsterdam-color-primary-blue;
453
- @amsterdam-alert-close-fill: @amsterdam-color-primary-black;
454
- @amsterdam-alert-success-border-color: @amsterdam-color-dark-green;
455
- @amsterdam-alert-success-background-color: @amsterdam-color-primary-white;
456
- @amsterdam-alert-error-border-color: @amsterdam-color-primary-red;
457
- @amsterdam-alert-error-background-color: @amsterdam-color-primary-white;
458
- @amsterdam-alert-title-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
459
- @amsterdam-alert-title-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
460
- @amsterdam-alert-title-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
461
- @amsterdam-alert-title-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
462
- @amsterdam-alert-title-font-weight: @amsterdam-typography-font-weight-bold;
463
- @amsterdam-alert-title-font-family: @amsterdam-typography-font-family;
464
- @amsterdam-alert-title-color: @amsterdam-color-primary-black;
465
- @amsterdam-alert-padding-inline-end: @amsterdam-spacing-inset-lg;
466
- @amsterdam-alert-padding-inline-start: @amsterdam-spacing-inset-lg;
467
- @amsterdam-alert-padding-block-end: @amsterdam-spacing-inset-md;
468
- @amsterdam-alert-padding-block-start: @amsterdam-spacing-inset-md;
469
- @amsterdam-alert-border: 4px solid @amsterdam-color-yellow;
470
- @amsterdam-alert-background-color: @amsterdam-color-yellow;
471
- @amsterdam-accordion-button-compact-line-height: @amsterdam-typography-compact-text-level-5-line-height;
472
- @amsterdam-accordion-button-compact-font-size: @amsterdam-typography-compact-text-level-5-font-size;
473
- @amsterdam-accordion-button-spacious-line-height: @amsterdam-typography-spacious-text-level-5-line-height;
474
- @amsterdam-accordion-button-spacious-font-size: @amsterdam-typography-spacious-text-level-5-font-size;
475
- @amsterdam-accordion-button-hover-box-shadow: inset 0 0 0 2px @amsterdam-color-neutral-grey3;
476
- @amsterdam-accordion-button-font-weight: @amsterdam-typography-font-weight-bold;
477
- @amsterdam-accordion-button-font-family: @amsterdam-typography-font-family;
478
- @amsterdam-accordion-button-focus-outline-offset: @amsterdam-focus-outline-offset;
479
- @amsterdam-accordion-button-color: @amsterdam-color-primary-blue;
480
- @amsterdam-link-appearance-on-background-light-color: @amsterdam-color-primary-black;
481
- @amsterdam-link-appearance-on-background-dark-color: @amsterdam-color-primary-white;
482
- @amsterdam-link-appearance-hover-color: @amsterdam-color-dark-blue;
483
- @amsterdam-link-appearance-color: @amsterdam-color-primary-blue;
484
- @amsterdam-top-task-link-label-color: @amsterdam-link-appearance-color;
485
- @amsterdam-pagination-button-hover-color: @amsterdam-link-appearance-hover-color;
486
- @amsterdam-pagination-color: @amsterdam-link-appearance-color;
487
- @amsterdam-page-menu-item-hover-color: @amsterdam-link-appearance-hover-color;
488
- @amsterdam-page-menu-item-color: @amsterdam-link-appearance-color;
489
- @amsterdam-link-on-background-light-visited-color: @amsterdam-link-appearance-on-background-light-color;
490
- @amsterdam-link-on-background-light-hover-color: @amsterdam-link-appearance-on-background-light-color;
491
- @amsterdam-link-on-background-light-color: @amsterdam-link-appearance-on-background-light-color;
492
- @amsterdam-link-on-background-dark-visited-color: @amsterdam-link-appearance-on-background-dark-color;
493
- @amsterdam-link-on-background-dark-hover-color: @amsterdam-link-appearance-on-background-dark-color;
494
- @amsterdam-link-on-background-dark-color: @amsterdam-link-appearance-on-background-dark-color;
495
- @amsterdam-link-hover-color: @amsterdam-link-appearance-hover-color;
496
- @amsterdam-link-color: @amsterdam-link-appearance-color;
497
- @amsterdam-card-link-hover-color: @amsterdam-link-appearance-hover-color;
498
- @amsterdam-card-link-color: @amsterdam-link-appearance-color;
499
- @amsterdam-breadcrumb-item-link-color: @amsterdam-link-appearance-color;
package/style-dictionary.config.json DELETED
@@ -1,101 +0,0 @@
1
- {
2
- "source": ["./src/**/tokens.json", "./src/**/*.tokens.json"],
3
- "platforms": {
4
- "js": {
5
- "transforms": ["attribute/cti", "name/cti/camel", "color/hsl-4"],
6
- "buildPath": "dist/",
7
- "files": [
8
- {
9
- "destination": "index.js",
10
- "format": "javascript/es6"
11
- },
12
- {
13
- "format": "javascript/module",
14
- "destination": "tokens.js"
15
- }
16
- ]
17
- },
18
- "json": {
19
- "transforms": ["attribute/cti", "name/cti/camel", "color/hsl-4"],
20
- "buildPath": "dist/",
21
- "files": [
22
- {
23
- "destination": "index.tokens.json",
24
- "format": "json/nested"
25
- },
26
- {
27
- "destination": "index.json",
28
- "format": "json/flat"
29
- }
30
- ]
31
- },
32
- "css": {
33
- "transforms": ["attribute/cti", "name/cti/kebab", "color/hsl-4"],
34
- "buildPath": "dist/",
35
- "files": [
36
- {
37
- "destination": "root.css",
38
- "format": "css/variables",
39
- "options": {
40
- "outputReferences": true
41
- }
42
- }
43
- ]
44
- },
45
- "css-theme": {
46
- "transforms": ["attribute/cti", "name/cti/kebab", "color/hsl-4"],
47
- "buildPath": "dist/",
48
- "files": [
49
- {
50
- "destination": "index.css",
51
- "format": "css/variables",
52
- "options": {
53
- "selector": ".amsterdam-theme",
54
- "outputReferences": true
55
- }
56
- }
57
- ]
58
- },
59
- "scss": {
60
- "transforms": ["attribute/cti", "name/cti/kebab", "color/hsl-4"],
61
- "buildPath": "dist/",
62
- "files": [
63
- {
64
- "destination": "_variables.scss",
65
- "format": "scss/variables",
66
- "options": {
67
- "outputReferences": true
68
- }
69
- }
70
- ]
71
- },
72
- "typescript": {
73
- "transforms": ["attribute/cti", "name/cti/camel", "color/hsl-4"],
74
- "transformGroup": "js",
75
- "buildPath": "dist/",
76
- "files": [
77
- {
78
- "format": "typescript/es6-declarations",
79
- "destination": "index.d.ts"
80
- },
81
- {
82
- "format": "typescript/module-declarations",
83
- "destination": "tokens.d.ts"
84
- }
85
- ]
86
- },
87
- "less": {
88
- "transforms": ["attribute/cti", "name/cti/kebab", "color/hsl-4"],
89
- "buildPath": "dist/",
90
- "files": [
91
- {
92
- "destination": "variables.less",
93
- "format": "less/variables",
94
- "options": {
95
- "outputReferences": true
96
- }
97
- }
98
- ]
99
- }
100
- }
101
- }