@mozaic-ds/vue 0.23.0-beta.0 → 0.24.0-beta.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 (29) hide show
  1. package/dist/mozaic-vue.adeo.css +41 -40
  2. package/dist/mozaic-vue.adeo.umd.js +2894 -1265
  3. package/dist/mozaic-vue.common.js +2894 -1265
  4. package/dist/mozaic-vue.common.js.map +1 -1
  5. package/dist/mozaic-vue.css +1 -1
  6. package/dist/mozaic-vue.umd.js +2894 -1265
  7. package/dist/mozaic-vue.umd.js.map +1 -1
  8. package/dist/mozaic-vue.umd.min.js +2 -2
  9. package/dist/mozaic-vue.umd.min.js.map +1 -1
  10. package/package.json +16 -16
  11. package/src/components/autocomplete/MAutocomplete.vue +28 -12
  12. package/src/components/dropdown/MDropdown.vue +245 -0
  13. package/src/components/dropdown/index.js +7 -0
  14. package/src/components/icon/MIcon.vue +18 -2
  15. package/src/components/index.js +1 -0
  16. package/src/components/phonenumber/MPhoneNumber.vue +4 -2
  17. package/src/components/quantityselector/MQuantitySelector.vue +5 -0
  18. package/src/components/tabs/MTab.vue +4 -11
  19. package/src/index.js +1 -0
  20. package/src/tokens/adeo/android/colors.xml +209 -166
  21. package/src/tokens/adeo/css/_variables.scss +209 -166
  22. package/src/tokens/adeo/css/root.scss +89 -46
  23. package/src/tokens/adeo/ios/StyleDictionaryColor.h +48 -5
  24. package/src/tokens/adeo/ios/StyleDictionaryColor.m +214 -171
  25. package/src/tokens/adeo/ios/StyleDictionaryColor.swift +209 -166
  26. package/src/tokens/adeo/js/tokens.js +209 -166
  27. package/src/tokens/adeo/js/tokensObject.js +1279 -304
  28. package/src/tokens/adeo/scss/_tokens.scss +344 -174
  29. package/types/index.d.ts +2 -0
package/src/tokens/adeo/css/_variables.scss CHANGED
@@ -10,9 +10,9 @@ $color-badge-warning-text: var(--color-badge-warning-text, #8c3500);
10
10
  $color-badge-danger-background: var(--color-badge-danger-background, #fdeaea);
11
11
  $color-badge-danger-border: var(--color-badge-danger-border, #ea302d);
12
12
  $color-badge-danger-text: var(--color-badge-danger-text, #8c0003);
13
- $color-badge-neutral-background: var(--color-badge-neutral-background, #eeedea);
14
- $color-badge-neutral-border: var(--color-badge-neutral-border, #8c8b85);
15
- $color-badge-neutral-text: var(--color-badge-neutral-text, #555550);
13
+ $color-badge-neutral-background: var(--color-badge-neutral-background, #e6e6e6);
14
+ $color-badge-neutral-border: var(--color-badge-neutral-border, #808080);
15
+ $color-badge-neutral-text: var(--color-badge-neutral-text, #4d4d4d);
16
16
  $color-primary-01-100: var(--color-primary-01-100, #d9f0f3);
17
17
  $color-primary-01-200: var(--color-primary-01-200, #91d5db);
18
18
  $color-primary-01-300: var(--color-primary-01-300, #48bac4);
@@ -22,24 +22,24 @@ $color-primary-01-600: var(--color-primary-01-600, #007f8c);
22
22
  $color-primary-01-700: var(--color-primary-01-700, #006974);
23
23
  $color-primary-01-800: var(--color-primary-01-800, #004e57);
24
24
  $color-primary-01-900: var(--color-primary-01-900, #002e33);
25
- $color-primary-02-100: var(--color-primary-02-100, #dbedea);
26
- $color-primary-02-200: var(--color-primary-02-200, #a5d1cb);
27
- $color-primary-02-300: var(--color-primary-02-300, #6eb4ad);
28
- $color-primary-02-400: var(--color-primary-02-400, #379590);
29
- $color-primary-02-500: var(--color-primary-02-500, #007574);
30
- $color-primary-02-600: var(--color-primary-02-600, #035f64);
31
- $color-primary-02-700: var(--color-primary-02-700, #044c53);
32
- $color-primary-02-800: var(--color-primary-02-800, #063a44);
33
- $color-primary-02-900: var(--color-primary-02-900, #062b35);
34
- $color-grey-100: var(--color-grey-100, #eeedea);
35
- $color-grey-200: var(--color-grey-200, #dddcd5);
36
- $color-grey-300: var(--color-grey-300, #c2c1ba);
37
- $color-grey-400: var(--color-grey-400, #a7a6a0);
38
- $color-grey-500: var(--color-grey-500, #8c8b85);
39
- $color-grey-600: var(--color-grey-600, #71706b);
40
- $color-grey-700: var(--color-grey-700, #555550);
41
- $color-grey-800: var(--color-grey-800, #3a3936);
42
- $color-grey-900: var(--color-grey-900, #1e1e1c);
25
+ $color-primary-02-100: var(--color-primary-02-100, #eeeff1);
26
+ $color-primary-02-200: var(--color-primary-02-200, #cfd2d8);
27
+ $color-primary-02-300: var(--color-primary-02-300, #b3b7c1);
28
+ $color-primary-02-400: var(--color-primary-02-400, #8f94a3);
29
+ $color-primary-02-500: var(--color-primary-02-500, #6a7081);
30
+ $color-primary-02-600: var(--color-primary-02-600, #494f60);
31
+ $color-primary-02-700: var(--color-primary-02-700, #343b4c);
32
+ $color-primary-02-800: var(--color-primary-02-800, #242938);
33
+ $color-primary-02-900: var(--color-primary-02-900, #171b26);
34
+ $color-grey-100: var(--color-grey-100, #e6e6e6);
35
+ $color-grey-200: var(--color-grey-200, #cccccc);
36
+ $color-grey-300: var(--color-grey-300, #b3b3b3);
37
+ $color-grey-400: var(--color-grey-400, #999999);
38
+ $color-grey-500: var(--color-grey-500, #808080);
39
+ $color-grey-600: var(--color-grey-600, #666666);
40
+ $color-grey-700: var(--color-grey-700, #4d4d4d);
41
+ $color-grey-800: var(--color-grey-800, #333333);
42
+ $color-grey-900: var(--color-grey-900, #191919);
43
43
  $color-grey-999: var(--color-grey-999, #000000);
44
44
  $color-grey-000: var(--color-grey-000, #ffffff);
45
45
  $color-secondary-blue-100: var(--color-secondary-blue-100, #eaedef);
@@ -69,24 +69,24 @@ $color-secondary-purple-600: var(--color-secondary-purple-600, #4b4a8c);
69
69
  $color-secondary-purple-700: var(--color-secondary-purple-700, #393879);
70
70
  $color-secondary-purple-800: var(--color-secondary-purple-800, #282863);
71
71
  $color-secondary-purple-900: var(--color-secondary-purple-900, #1a1a4b);
72
- $color-secondary-red-100: var(--color-secondary-red-100, #fdeaea);
73
- $color-secondary-red-200: var(--color-secondary-red-200, #f8bcbb);
74
- $color-secondary-red-300: var(--color-secondary-red-300, #f38d8c);
75
- $color-secondary-red-400: var(--color-secondary-red-400, #ef5f5c);
76
- $color-secondary-red-500: var(--color-secondary-red-500, #ea302d);
77
- $color-secondary-red-600: var(--color-secondary-red-600, #c61112);
78
- $color-secondary-red-700: var(--color-secondary-red-700, #8c0003);
79
- $color-secondary-red-800: var(--color-secondary-red-800, #530000);
80
- $color-secondary-red-900: var(--color-secondary-red-900, #2d0000);
81
- $color-secondary-orange-100: var(--color-secondary-orange-100, #fdf1e8);
82
- $color-secondary-orange-200: var(--color-secondary-orange-200, #f8d2b3);
83
- $color-secondary-orange-300: var(--color-secondary-orange-300, #f4b27e);
84
- $color-secondary-orange-400: var(--color-secondary-orange-400, #ef934a);
85
- $color-secondary-orange-500: var(--color-secondary-orange-500, #ea7315);
86
- $color-secondary-orange-600: var(--color-secondary-orange-600, #c65200);
87
- $color-secondary-orange-700: var(--color-secondary-orange-700, #8c3500);
88
- $color-secondary-orange-800: var(--color-secondary-orange-800, #531b00);
89
- $color-secondary-orange-900: var(--color-secondary-orange-900, #360e00);
72
+ $color-secondary-red-100: var(--color-secondary-red-100, #feedee);
73
+ $color-secondary-red-200: var(--color-secondary-red-200, #fab9bc);
74
+ $color-secondary-red-300: var(--color-secondary-red-300, #f38789);
75
+ $color-secondary-red-400: var(--color-secondary-red-400, #ea5d58);
76
+ $color-secondary-red-500: var(--color-secondary-red-500, #df382b);
77
+ $color-secondary-red-600: var(--color-secondary-red-600, #b42a27);
78
+ $color-secondary-red-700: var(--color-secondary-red-700, #8b2226);
79
+ $color-secondary-red-800: var(--color-secondary-red-800, #641b21);
80
+ $color-secondary-red-900: var(--color-secondary-red-900, #3e1219);
81
+ $color-secondary-orange-100: var(--color-secondary-orange-100, #fff5eb);
82
+ $color-secondary-orange-200: var(--color-secondary-orange-200, #ffdab2);
83
+ $color-secondary-orange-300: var(--color-secondary-orange-300, #ffc17d);
84
+ $color-secondary-orange-400: var(--color-secondary-orange-400, #ffab4b);
85
+ $color-secondary-orange-500: var(--color-secondary-orange-500, #fc961e);
86
+ $color-secondary-orange-600: var(--color-secondary-orange-600, #c86f21);
87
+ $color-secondary-orange-700: var(--color-secondary-orange-700, #974f20);
88
+ $color-secondary-orange-800: var(--color-secondary-orange-800, #6a351c);
89
+ $color-secondary-orange-900: var(--color-secondary-orange-900, #401f15);
90
90
  $color-secondary-yellow-100: var(--color-secondary-yellow-100, #fff8e2);
91
91
  $color-secondary-yellow-200: var(--color-secondary-yellow-200, #ffebaf);
92
92
  $color-secondary-yellow-300: var(--color-secondary-yellow-300, #fee07d);
@@ -132,35 +132,37 @@ $color-success-600: var(--color-success-600, #188803);
132
132
  $color-success-700: var(--color-success-700, #006902);
133
133
  $color-success-800: var(--color-success-800, #035010);
134
134
  $color-success-900: var(--color-success-900, #023618);
135
+ $color-breadcrumb-arrow: var(--color-breadcrumb-arrow, #333333);
136
+ $color-breadcrumb-arrow-invert: var(--color-breadcrumb-arrow-invert, #ffffff);
135
137
  $color-button-solid-background: var(--color-button-solid-background, #007f8c);
136
138
  $color-button-solid-font: var(--color-button-solid-font, #ffffff);
137
139
  $color-button-solid-focus-border: var(--color-button-solid-focus-border, #006974);
138
- $color-button-solid-disabled-background: var(--color-button-solid-disabled-background, #dddcd5);
139
- $color-button-solid-disabled-font: var(--color-button-solid-disabled-font, #71706b);
140
+ $color-button-solid-disabled-background: var(--color-button-solid-disabled-background, #cccccc);
141
+ $color-button-solid-disabled-font: var(--color-button-solid-disabled-font, #666666);
140
142
  $color-button-solid-active-background: var(--color-button-solid-active-background, #006974);
141
143
  $color-button-solid-hover-background: var(--color-button-solid-hover-background, #006974);
142
144
  $color-button-solid-hover-font: var(--color-button-solid-hover-font, #ffffff);
143
- $color-button-solid-primary-02-background: var(--color-button-solid-primary-02-background, #007574);
145
+ $color-button-solid-primary-02-background: var(--color-button-solid-primary-02-background, #6a7081);
144
146
  $color-button-solid-primary-02-font: var(--color-button-solid-primary-02-font, #ffffff);
145
- $color-button-solid-primary-02-focus-border: var(--color-button-solid-primary-02-focus-border, #062b35);
146
- $color-button-solid-primary-02-disabled-background: var(--color-button-solid-primary-02-disabled-background, #dddcd5);
147
- $color-button-solid-primary-02-disabled-font: var(--color-button-solid-primary-02-disabled-font, #71706b);
148
- $color-button-solid-primary-02-active-background: var(--color-button-solid-primary-02-active-background, #062b35);
149
- $color-button-solid-primary-02-hover-background: var(--color-button-solid-primary-02-hover-background, #063a44);
147
+ $color-button-solid-primary-02-focus-border: var(--color-button-solid-primary-02-focus-border, #171b26);
148
+ $color-button-solid-primary-02-disabled-background: var(--color-button-solid-primary-02-disabled-background, #cccccc);
149
+ $color-button-solid-primary-02-disabled-font: var(--color-button-solid-primary-02-disabled-font, #666666);
150
+ $color-button-solid-primary-02-active-background: var(--color-button-solid-primary-02-active-background, #171b26);
151
+ $color-button-solid-primary-02-hover-background: var(--color-button-solid-primary-02-hover-background, #242938);
150
152
  $color-button-solid-primary-02-hover-font: var(--color-button-solid-primary-02-hover-font, #ffffff);
151
- $color-button-solid-neutral-background: var(--color-button-solid-neutral-background, #3a3936);
153
+ $color-button-solid-neutral-background: var(--color-button-solid-neutral-background, #333333);
152
154
  $color-button-solid-neutral-font: var(--color-button-solid-neutral-font, #ffffff);
153
- $color-button-solid-neutral-focus-border: var(--color-button-solid-neutral-focus-border, #1e1e1c);
154
- $color-button-solid-neutral-disabled-background: var(--color-button-solid-neutral-disabled-background, #dddcd5);
155
- $color-button-solid-neutral-disabled-font: var(--color-button-solid-neutral-disabled-font, #71706b);
156
- $color-button-solid-neutral-active-background: var(--color-button-solid-neutral-active-background, #3a3936);
157
- $color-button-solid-neutral-hover-background: var(--color-button-solid-neutral-hover-background, #1e1e1c);
155
+ $color-button-solid-neutral-focus-border: var(--color-button-solid-neutral-focus-border, #191919);
156
+ $color-button-solid-neutral-disabled-background: var(--color-button-solid-neutral-disabled-background, #cccccc);
157
+ $color-button-solid-neutral-disabled-font: var(--color-button-solid-neutral-disabled-font, #666666);
158
+ $color-button-solid-neutral-active-background: var(--color-button-solid-neutral-active-background, #333333);
159
+ $color-button-solid-neutral-hover-background: var(--color-button-solid-neutral-hover-background, #191919);
158
160
  $color-button-solid-neutral-hover-font: var(--color-button-solid-neutral-hover-font, #ffffff);
159
- $color-button-solid-danger-background: var(--color-button-solid-danger-background, #c61112);
161
+ $color-button-solid-danger-background: var(--color-button-solid-danger-background, #b42a27);
160
162
  $color-button-solid-danger-font: var(--color-button-solid-danger-font, #ffffff);
161
163
  $color-button-solid-danger-focus-border: var(--color-button-solid-danger-focus-border, #8c0003);
162
- $color-button-solid-danger-disabled-background: var(--color-button-solid-danger-disabled-background, #dddcd5);
163
- $color-button-solid-danger-disabled-font: var(--color-button-solid-danger-disabled-font, #71706b);
164
+ $color-button-solid-danger-disabled-background: var(--color-button-solid-danger-disabled-background, #cccccc);
165
+ $color-button-solid-danger-disabled-font: var(--color-button-solid-danger-disabled-font, #666666);
164
166
  $color-button-solid-danger-active-background: var(--color-button-solid-danger-active-background, #8c0003);
165
167
  $color-button-solid-danger-hover-background: var(--color-button-solid-danger-hover-background, #8c0003);
166
168
  $color-button-solid-danger-hover-font: var(--color-button-solid-danger-hover-font, #ffffff);
@@ -168,45 +170,51 @@ $color-button-bordered-background: var(--color-button-bordered-background, #ffff
168
170
  $color-button-bordered-border: var(--color-button-bordered-border, #007f8c);
169
171
  $color-button-bordered-font: var(--color-button-bordered-font, #007f8c);
170
172
  $color-button-bordered-focus-border: var(--color-button-bordered-focus-border, #006974);
171
- $color-button-bordered-disabled-background: var(--color-button-bordered-disabled-background, #dddcd5);
172
- $color-button-bordered-disabled-font: var(--color-button-bordered-disabled-font, #71706b);
173
+ $color-button-bordered-disabled-background: var(--color-button-bordered-disabled-background, #cccccc);
174
+ $color-button-bordered-disabled-font: var(--color-button-bordered-disabled-font, #666666);
173
175
  $color-button-bordered-active-background: var(--color-button-bordered-active-background, #91d5db);
174
176
  $color-button-bordered-hover-background: var(--color-button-bordered-hover-background, #d9f0f3);
175
177
  $color-button-bordered-primary-02-background: var(--color-button-bordered-primary-02-background, #ffffff);
176
- $color-button-bordered-primary-02-border: var(--color-button-bordered-primary-02-border, #007574);
177
- $color-button-bordered-primary-02-font: var(--color-button-bordered-primary-02-font, #007574);
178
- $color-button-bordered-primary-02-focus-border: var(--color-button-bordered-primary-02-focus-border, #062b35);
179
- $color-button-bordered-primary-02-disabled-background: var(--color-button-bordered-primary-02-disabled-background, #dddcd5);
180
- $color-button-bordered-primary-02-disabled-font: var(--color-button-bordered-primary-02-disabled-font, #71706b);
181
- $color-button-bordered-primary-02-active-background: var(--color-button-bordered-primary-02-active-background, #a5d1cb);
182
- $color-button-bordered-primary-02-hover-background: var(--color-button-bordered-primary-02-hover-background, #dbedea);
178
+ $color-button-bordered-primary-02-border: var(--color-button-bordered-primary-02-border, #6a7081);
179
+ $color-button-bordered-primary-02-font: var(--color-button-bordered-primary-02-font, #6a7081);
180
+ $color-button-bordered-primary-02-focus-border: var(--color-button-bordered-primary-02-focus-border, #171b26);
181
+ $color-button-bordered-primary-02-disabled-background: var(--color-button-bordered-primary-02-disabled-background, #cccccc);
182
+ $color-button-bordered-primary-02-disabled-font: var(--color-button-bordered-primary-02-disabled-font, #666666);
183
+ $color-button-bordered-primary-02-active-background: var(--color-button-bordered-primary-02-active-background, #cfd2d8);
184
+ $color-button-bordered-primary-02-hover-background: var(--color-button-bordered-primary-02-hover-background, #eeeff1);
183
185
  $color-button-bordered-neutral-background: var(--color-button-bordered-neutral-background, #ffffff);
184
- $color-button-bordered-neutral-border: var(--color-button-bordered-neutral-border, #3a3936);
185
- $color-button-bordered-neutral-font: var(--color-button-bordered-neutral-font, #3a3936);
186
- $color-button-bordered-neutral-focus-border: var(--color-button-bordered-neutral-focus-border, #1e1e1c);
187
- $color-button-bordered-neutral-disabled-background: var(--color-button-bordered-neutral-disabled-background, #dddcd5);
188
- $color-button-bordered-neutral-disabled-font: var(--color-button-bordered-neutral-disabled-font, #71706b);
189
- $color-button-bordered-neutral-active-background: var(--color-button-bordered-neutral-active-background, #dddcd5);
190
- $color-button-bordered-neutral-hover-background: var(--color-button-bordered-neutral-hover-background, #eeedea);
186
+ $color-button-bordered-neutral-border: var(--color-button-bordered-neutral-border, #333333);
187
+ $color-button-bordered-neutral-font: var(--color-button-bordered-neutral-font, #333333);
188
+ $color-button-bordered-neutral-focus-border: var(--color-button-bordered-neutral-focus-border, #191919);
189
+ $color-button-bordered-neutral-disabled-background: var(--color-button-bordered-neutral-disabled-background, #cccccc);
190
+ $color-button-bordered-neutral-disabled-font: var(--color-button-bordered-neutral-disabled-font, #666666);
191
+ $color-button-bordered-neutral-active-background: var(--color-button-bordered-neutral-active-background, #cccccc);
192
+ $color-button-bordered-neutral-hover-background: var(--color-button-bordered-neutral-hover-background, #e6e6e6);
191
193
  $color-button-bordered-danger-background: var(--color-button-bordered-danger-background, #ffffff);
192
- $color-button-bordered-danger-border: var(--color-button-bordered-danger-border, #c61112);
193
- $color-button-bordered-danger-font: var(--color-button-bordered-danger-font, #c61112);
194
- $color-button-bordered-danger-focus-border: var(--color-button-bordered-danger-focus-border, #8c0003);
195
- $color-button-bordered-danger-disabled-background: var(--color-button-bordered-danger-disabled-background, #dddcd5);
196
- $color-button-bordered-danger-disabled-font: var(--color-button-bordered-danger-disabled-font, #71706b);
197
- $color-button-bordered-danger-active-background: var(--color-button-bordered-danger-active-background, #f8bcbb);
198
- $color-button-bordered-danger-hover-background: var(--color-button-bordered-danger-hover-background, #fdeaea);
194
+ $color-button-bordered-danger-border: var(--color-button-bordered-danger-border, #b42a27);
195
+ $color-button-bordered-danger-font: var(--color-button-bordered-danger-font, #b42a27);
196
+ $color-button-bordered-danger-focus-border: var(--color-button-bordered-danger-focus-border, #8b2226);
197
+ $color-button-bordered-danger-disabled-background: var(--color-button-bordered-danger-disabled-background, #cccccc);
198
+ $color-button-bordered-danger-disabled-font: var(--color-button-bordered-danger-disabled-font, #666666);
199
+ $color-button-bordered-danger-active-background: var(--color-button-bordered-danger-active-background, #fab9bc);
200
+ $color-button-bordered-danger-hover-background: var(--color-button-bordered-danger-hover-background, #feedee);
201
+ $color-card-bordered-background: var(--color-card-bordered-background, #ffffff);
202
+ $color-card-bordered-border: var(--color-card-bordered-border, #808080);
203
+ $color-dialog-background: var(--color-dialog-background, #ffffff);
204
+ $color-dialog-icon: var(--color-dialog-icon, #666666);
205
+ $color-dialog-close: var(--color-dialog-close, #808080);
206
+ $color-dialog-footer-shadow: var(--color-dialog-footer-shadow, #191919);
199
207
  $color-divider-lightest: var(--color-divider-lightest, #ffffff);
200
- $color-divider-light: var(--color-divider-light, #c2c1ba);
201
- $color-divider-default: var(--color-divider-default, #71706b);
208
+ $color-divider-light: var(--color-divider-light, #b3b3b3);
209
+ $color-divider-default: var(--color-divider-default, #666666);
202
210
  $color-divider-dark: var(--color-divider-dark, #000000);
203
211
  $color-fields-error: var(--color-fields-error, #c61112);
204
- $color-fields-label: var(--color-fields-label, #3a3936);
205
- $color-fields-requirement: var(--color-fields-requirement, #71706b);
206
- $color-fields-help: var(--color-fields-help, #71706b);
212
+ $color-fields-label: var(--color-fields-label, #333333);
213
+ $color-fields-requirement: var(--color-fields-requirement, #666666);
214
+ $color-fields-help: var(--color-fields-help, #666666);
207
215
  $color-fileuploader-font: var(--color-fileuploader-font, #000000);
208
- $color-fileuploader-files-list: var(--color-fileuploader-files-list, #eeedea);
209
- $color-fileuploader-files-delete: var(--color-fileuploader-files-delete, #dddcd5);
216
+ $color-fileuploader-files-list: var(--color-fileuploader-files-list, #e6e6e6);
217
+ $color-fileuploader-files-delete: var(--color-fileuploader-files-delete, #cccccc);
210
218
  $color-fileuploader-valid: var(--color-fileuploader-valid, #00919f);
211
219
  $color-fileuploader-alert: var(--color-fileuploader-alert, #c61112);
212
220
  $color-flag-solid-background: var(--color-flag-solid-background, #007f8c);
@@ -221,8 +229,8 @@ $color-flag-solid-dark-text: var(--color-flag-solid-dark-text, #ffffff);
221
229
  $color-flag-solid-light-background: var(--color-flag-solid-light-background, #ffffff);
222
230
  $color-flag-solid-light-border: var(--color-flag-solid-light-border, #ffffff);
223
231
  $color-flag-solid-light-text: var(--color-flag-solid-light-text, #000000);
224
- $color-flag-solid-danger-background: var(--color-flag-solid-danger-background, #c61112);
225
- $color-flag-solid-danger-border: var(--color-flag-solid-danger-border, #c61112);
232
+ $color-flag-solid-danger-background: var(--color-flag-solid-danger-background, #b42a27);
233
+ $color-flag-solid-danger-border: var(--color-flag-solid-danger-border, #b42a27);
226
234
  $color-flag-solid-danger-text: var(--color-flag-solid-danger-text, #ffffff);
227
235
  $color-flag-bordered-background: var(--color-flag-bordered-background, #ffffff);
228
236
  $color-flag-bordered-border: var(--color-flag-bordered-border, #007f8c);
@@ -237,29 +245,32 @@ $color-flag-bordered-light-background: var(--color-flag-bordered-light-backgroun
237
245
  $color-flag-bordered-light-border: var(--color-flag-bordered-light-border, #ffffff);
238
246
  $color-flag-bordered-light-text: var(--color-flag-bordered-light-text, #ffffff);
239
247
  $color-flag-bordered-danger-background: var(--color-flag-bordered-danger-background, #ffffff);
240
- $color-flag-bordered-danger-border: var(--color-flag-bordered-danger-border, #c61112);
241
- $color-flag-bordered-danger-text: var(--color-flag-bordered-danger-text, #c61112);
248
+ $color-flag-bordered-danger-border: var(--color-flag-bordered-danger-border, #b42a27);
249
+ $color-flag-bordered-danger-text: var(--color-flag-bordered-danger-text, #b42a27);
242
250
  $color-focus-gap: var(--color-focus-gap, #ffffff);
243
251
  $color-focus-border: var(--color-focus-border, #758992);
244
- $color-font-primary-01: var(--color-font-primary-01, #007f8c);
245
- $color-font-primary-02: var(--color-font-primary-02, #007574);
252
+ $color-font-primary-01: var(--color-font-primary-01, #00919f);
253
+ $color-font-primary-02: var(--color-font-primary-02, #6a7081);
246
254
  $color-font-darkest: var(--color-font-darkest, #000000);
247
- $color-font-darker: var(--color-font-darker, #1e1e1c);
248
- $color-font-dark: var(--color-font-dark, #3a3936);
249
- $color-font-light: var(--color-font-light, #71706b);
255
+ $color-font-darker: var(--color-font-darker, #191919);
256
+ $color-font-dark: var(--color-font-dark, #333333);
257
+ $color-font-light: var(--color-font-light, #666666);
250
258
  $color-font-lightest: var(--color-font-lightest, #ffffff);
251
259
  $color-font-info: var(--color-font-info, #007bb4);
252
260
  $color-font-success: var(--color-font-success, #188803);
253
261
  $color-font-warning: var(--color-font-warning, #c65200);
254
262
  $color-font-danger: var(--color-font-danger, #c61112);
255
- $color-input-text: var(--color-input-text, #1e1e1c);
256
- $color-input-border: var(--color-input-border, #71706b);
257
- $color-input-placeholder: var(--color-input-placeholder, #8c8b85);
263
+ $color-heading-underline-default: var(--color-heading-underline-default, #00919f);
264
+ $color-heading-underline-lightest: var(--color-heading-underline-lightest, #91d5db);
265
+ $color-hero-cover-background: var(--color-hero-cover-background, #191919);
266
+ $color-input-text: var(--color-input-text, #191919);
267
+ $color-input-border: var(--color-input-border, #666666);
268
+ $color-input-placeholder: var(--color-input-placeholder, #808080);
258
269
  $color-input-background: var(--color-input-background, #ffffff);
259
- $color-input-disabled-border: var(--color-input-disabled-border, #eeedea);
260
- $color-input-disabled-background: var(--color-input-disabled-background, #eeedea);
261
- $color-input-disabled-icon: var(--color-input-disabled-icon, #a7a6a0);
262
- $color-input-hover-border: var(--color-input-hover-border, #1e1e1c);
270
+ $color-input-disabled-border: var(--color-input-disabled-border, #e6e6e6);
271
+ $color-input-disabled-background: var(--color-input-disabled-background, #e6e6e6);
272
+ $color-input-disabled-icon: var(--color-input-disabled-icon, #999999);
273
+ $color-input-hover-border: var(--color-input-hover-border, #191919);
263
274
  $color-input-focus-border: var(--color-input-focus-border, #758992);
264
275
  $color-input-valid-border: var(--color-input-valid-border, #46a610);
265
276
  $color-input-valid-hover-border: var(--color-input-valid-hover-border, #035010);
@@ -270,116 +281,148 @@ $color-input-checked-background: var(--color-input-checked-background, #00919f);
270
281
  $color-input-checked-icon: var(--color-input-checked-icon, #ffffff);
271
282
  $color-input-checked-hover-border: var(--color-input-checked-hover-border, #004e57);
272
283
  $color-link-dark-base: var(--color-link-dark-base, #000000);
273
- $color-link-dark-visited: var(--color-link-dark-visited, #3a3936);
274
- $color-link-dark-active: var(--color-link-dark-active, #3a3936);
275
- $color-link-dark-disabled: var(--color-link-dark-disabled, #eeedea);
276
- $color-link-dark-hover: var(--color-link-dark-hover, #71706b);
284
+ $color-link-dark-visited: var(--color-link-dark-visited, #333333);
285
+ $color-link-dark-active: var(--color-link-dark-active, #333333);
286
+ $color-link-dark-disabled: var(--color-link-dark-disabled, #e6e6e6);
287
+ $color-link-dark-hover: var(--color-link-dark-hover, #666666);
277
288
  $color-link-light-base: var(--color-link-light-base, #ffffff);
278
- $color-link-light-visited: var(--color-link-light-visited, #dddcd5);
279
- $color-link-light-active: var(--color-link-light-active, #dddcd5);
280
- $color-link-light-disabled: var(--color-link-light-disabled, #eeedea);
281
- $color-link-light-hover: var(--color-link-light-hover, #a7a6a0);
289
+ $color-link-light-visited: var(--color-link-light-visited, #cccccc);
290
+ $color-link-light-active: var(--color-link-light-active, #cccccc);
291
+ $color-link-light-disabled: var(--color-link-light-disabled, #e6e6e6);
292
+ $color-link-light-hover: var(--color-link-light-hover, #999999);
282
293
  $color-link-primary-base: var(--color-link-primary-base, #007f8c);
283
294
  $color-link-primary-visited: var(--color-link-primary-visited, #006974);
284
295
  $color-link-primary-active: var(--color-link-primary-active, #006974);
285
- $color-link-primary-disabled: var(--color-link-primary-disabled, #eeedea);
286
- $color-link-primary-hover: var(--color-link-primary-hover, #004e57);
287
- $color-link-primary-02-base: var(--color-link-primary-02-base, #035f64);
288
- $color-link-primary-02-visited: var(--color-link-primary-02-visited, #044c53);
289
- $color-link-primary-02-active: var(--color-link-primary-02-active, #044c53);
290
- $color-link-primary-02-disabled: var(--color-link-primary-02-disabled, #eeedea);
291
- $color-link-primary-02-hover: var(--color-link-primary-02-hover, #062b35);
292
- $color-link-danger-base: var(--color-link-danger-base, #c61112);
293
- $color-link-danger-visited: var(--color-link-danger-visited, #8c0003);
294
- $color-link-danger-active: var(--color-link-danger-active, #8c0003);
295
- $color-link-danger-disabled: var(--color-link-danger-disabled, #eeedea);
296
- $color-link-danger-hover: var(--color-link-danger-hover, #530000);
296
+ $color-link-primary-disabled: var(--color-link-primary-disabled, #e6e6e6);
297
+ $color-link-primary-hover: var(--color-link-primary-hover, #002e33);
298
+ $color-link-primary-02-base: var(--color-link-primary-02-base, #494f60);
299
+ $color-link-primary-02-visited: var(--color-link-primary-02-visited, #343b4c);
300
+ $color-link-primary-02-active: var(--color-link-primary-02-active, #343b4c);
301
+ $color-link-primary-02-disabled: var(--color-link-primary-02-disabled, #e6e6e6);
302
+ $color-link-primary-02-hover: var(--color-link-primary-02-hover, #171b26);
303
+ $color-link-danger-base: var(--color-link-danger-base, #b42a27);
304
+ $color-link-danger-visited: var(--color-link-danger-visited, #8b2226);
305
+ $color-link-danger-active: var(--color-link-danger-active, #8b2226);
306
+ $color-link-danger-disabled: var(--color-link-danger-disabled, #e6e6e6);
307
+ $color-link-danger-hover: var(--color-link-danger-hover, #3e1219);
297
308
  $color-notification-font: var(--color-notification-font, #000000);
298
309
  $color-notification-information-background: var(--color-notification-information-background, #daeff7);
299
310
  $color-notification-information-border: var(--color-notification-information-border, #0b96cc);
300
- $color-notification-information-icon: var(--color-notification-information-icon, #007bb4);
301
311
  $color-notification-success-background: var(--color-notification-success-background, #ebf5de);
302
312
  $color-notification-success-border: var(--color-notification-success-border, #46a610);
303
- $color-notification-success-icon: var(--color-notification-success-icon, #188803);
304
313
  $color-notification-warning-background: var(--color-notification-warning-background, #fdf1e8);
305
314
  $color-notification-warning-border: var(--color-notification-warning-border, #ea7315);
306
- $color-notification-warning-icon: var(--color-notification-warning-icon, #c65200);
307
315
  $color-notification-danger-background: var(--color-notification-danger-background, #fdeaea);
308
316
  $color-notification-danger-border: var(--color-notification-danger-border, #ea302d);
309
- $color-notification-danger-icon: var(--color-notification-danger-icon, #c61112);
310
- $color-progress-background: var(--color-progress-background, #dddcd5);
317
+ $color-option-button-label-shadow: var(--color-option-button-label-shadow, #b3b3b3);
318
+ $color-option-button-hover-label-shadow: var(--color-option-button-hover-label-shadow, #333333);
319
+ $color-option-button-checked-label-border: var(--color-option-button-checked-label-border, #00919f);
320
+ $color-option-button-checked-label-shadow: var(--color-option-button-checked-label-shadow, #d9f0f3);
321
+ $color-option-button-disabled-label-background: var(--color-option-button-disabled-label-background, #cccccc);
322
+ $color-option-card-label-shadow: var(--color-option-card-label-shadow, #b3b3b3);
323
+ $color-option-card-hover-label-shadow: var(--color-option-card-hover-label-shadow, #333333);
324
+ $color-option-card-checked-label-border: var(--color-option-card-checked-label-border, #00919f);
325
+ $color-option-card-checked-label-shadow: var(--color-option-card-checked-label-shadow, #d9f0f3);
326
+ $color-overlay-background: var(--color-overlay-background, #191919);
327
+ $color-overlay-loader-background: var(--color-overlay-loader-background, #082435);
328
+ $color-password-input-button-hover-background: var(--color-password-input-button-hover-background, #e6e6e6);
329
+ $color-phone-number-button-border: var(--color-phone-number-button-border, #666666);
330
+ $color-phone-number-list-background: var(--color-phone-number-list-background, #ffffff);
331
+ $color-phone-number-item-border: var(--color-phone-number-item-border, #b3b3b3);
332
+ $color-phone-number-item-focus-background: var(--color-phone-number-item-focus-background, #e6e6e6);
333
+ $color-progress-background: var(--color-progress-background, #cccccc);
311
334
  $color-progress-indicator: var(--color-progress-indicator, #007bb4);
312
- $color-progress-percentage-default: var(--color-progress-percentage-default, #1e1e1c);
335
+ $color-progress-percentage-default: var(--color-progress-percentage-default, #191919);
313
336
  $color-progress-percentage-half: var(--color-progress-percentage-half, #ffffff);
314
337
  $color-progress-branded-indicator: var(--color-progress-branded-indicator, #00919f);
315
- $color-star-empty: var(--color-star-empty, #dddcd5);
338
+ $color-star-empty: var(--color-star-empty, #ffffff);
316
339
  $color-star-focus: var(--color-star-focus, #758992);
317
340
  $color-star-full: var(--color-star-full, #ea7315);
318
- $color-star-hover: var(--color-star-hover, #f4b27e);
341
+ $color-star-hover: var(--color-star-hover, #ffc17d);
342
+ $color-stepper-item-background: var(--color-stepper-item-background, #999999);
343
+ $color-stepper-item-current-background: var(--color-stepper-item-current-background, #009eac);
344
+ $color-stepper-link-hover-text: var(--color-stepper-link-hover-text, #009eac);
345
+ $color-stepper-indicator-background: var(--color-stepper-indicator-background, #ffffff);
346
+ $color-stepper-indicator-border: var(--color-stepper-indicator-border, #999999);
347
+ $color-stepper-indicator-current-background: var(--color-stepper-indicator-current-background, #009eac);
348
+ $color-stepper-indicator-current-border: var(--color-stepper-indicator-current-border, #009eac);
349
+ $color-stepper-icon: var(--color-stepper-icon, #009eac);
350
+ $color-stepper-title: var(--color-stepper-title, #009eac);
319
351
  $color-tabs-background: var(--color-tabs-background, #ffffff);
320
352
  $color-tabs-shadow: var(--color-tabs-shadow, #000000);
321
- $color-tabs-default: var(--color-tabs-default, #1e1e1c);
322
- $color-tabs-hover: var(--color-tabs-hover, #004e57);
323
- $color-tabs-disabled: var(--color-tabs-disabled, #71706b);
324
- $color-tabs-active: var(--color-tabs-active, #007f8c);
353
+ $color-tabs-default: var(--color-tabs-default, #191919);
354
+ $color-tabs-hover: var(--color-tabs-hover, #007f8c);
355
+ $color-tabs-disabled: var(--color-tabs-disabled, #666666);
356
+ $color-tabs-active: var(--color-tabs-active, #00919f);
325
357
  $color-tabs-active-disabled: var(--color-tabs-active-disabled, #91d5db);
326
358
  $color-tag-text-light-background: var(--color-tag-text-light-background, #ffffff);
327
- $color-tag-text-light-border: var(--color-tag-text-light-border, #8c8b85);
328
- $color-tag-text-light-text: var(--color-tag-text-light-text, #1e1e1c);
329
- $color-tag-text-dark-background: var(--color-tag-text-dark-background, #1e1e1c);
359
+ $color-tag-text-light-border: var(--color-tag-text-light-border, #808080);
360
+ $color-tag-text-light-text: var(--color-tag-text-light-text, #191919);
361
+ $color-tag-text-dark-background: var(--color-tag-text-dark-background, #191919);
330
362
  $color-tag-text-dark-border: var(--color-tag-text-dark-border, #ffffff);
331
363
  $color-tag-text-dark-text: var(--color-tag-text-dark-text, #ffffff);
332
364
  $color-tag-link-light-background: var(--color-tag-link-light-background, #ffffff);
333
- $color-tag-link-light-border: var(--color-tag-link-light-border, #8c8b85);
334
- $color-tag-link-light-text: var(--color-tag-link-light-text, #1e1e1c);
335
- $color-tag-link-light-hover-background: var(--color-tag-link-light-hover-background, #eeedea);
336
- $color-tag-link-light-active-background: var(--color-tag-link-light-active-background, #dddcd5);
337
- $color-tag-link-dark-background: var(--color-tag-link-dark-background, #1e1e1c);
365
+ $color-tag-link-light-border: var(--color-tag-link-light-border, #808080);
366
+ $color-tag-link-light-text: var(--color-tag-link-light-text, #191919);
367
+ $color-tag-link-light-hover-background: var(--color-tag-link-light-hover-background, #e6e6e6);
368
+ $color-tag-link-light-active-background: var(--color-tag-link-light-active-background, #cccccc);
369
+ $color-tag-link-dark-background: var(--color-tag-link-dark-background, #191919);
338
370
  $color-tag-link-dark-border: var(--color-tag-link-dark-border, #ffffff);
339
371
  $color-tag-link-dark-text: var(--color-tag-link-dark-text, #ffffff);
340
- $color-tag-link-dark-hover-background: var(--color-tag-link-dark-hover-background, #3a3936);
341
- $color-tag-link-dark-active-background: var(--color-tag-link-dark-active-background, #555550);
372
+ $color-tag-link-dark-hover-background: var(--color-tag-link-dark-hover-background, #333333);
373
+ $color-tag-link-dark-active-background: var(--color-tag-link-dark-active-background, #4d4d4d);
342
374
  $color-tag-selectable-light-background: var(--color-tag-selectable-light-background, #ffffff);
343
- $color-tag-selectable-light-border: var(--color-tag-selectable-light-border, #8c8b85);
344
- $color-tag-selectable-light-text: var(--color-tag-selectable-light-text, #1e1e1c);
375
+ $color-tag-selectable-light-border: var(--color-tag-selectable-light-border, #808080);
376
+ $color-tag-selectable-light-text: var(--color-tag-selectable-light-text, #191919);
345
377
  $color-tag-selectable-light-hover-background: var(--color-tag-selectable-light-hover-background, #48bac4);
346
378
  $color-tag-selectable-light-active-background: var(--color-tag-selectable-light-active-background, #004e57);
347
379
  $color-tag-selectable-light-active-border: var(--color-tag-selectable-light-active-border, #004e57);
348
380
  $color-tag-selectable-light-active-text: var(--color-tag-selectable-light-active-text, #ffffff);
349
- $color-tag-selectable-light-disabled-background: var(--color-tag-selectable-light-disabled-background, #eeedea);
350
- $color-tag-selectable-light-disabled-text: var(--color-tag-selectable-light-disabled-text, #8c8b85);
381
+ $color-tag-selectable-light-disabled-background: var(--color-tag-selectable-light-disabled-background, #e6e6e6);
382
+ $color-tag-selectable-light-disabled-text: var(--color-tag-selectable-light-disabled-text, #808080);
351
383
  $color-tag-selectable-light-selected-background: var(--color-tag-selectable-light-selected-background, #007f8c);
352
384
  $color-tag-selectable-light-selected-text: var(--color-tag-selectable-light-selected-text, #ffffff);
353
385
  $color-tag-selectable-light-selected-hover-background: var(--color-tag-selectable-light-selected-hover-background, #006974);
354
- $color-tag-selectable-dark-background: var(--color-tag-selectable-dark-background, #1e1e1c);
386
+ $color-tag-selectable-dark-background: var(--color-tag-selectable-dark-background, #191919);
355
387
  $color-tag-selectable-dark-border: var(--color-tag-selectable-dark-border, #ffffff);
356
388
  $color-tag-selectable-dark-text: var(--color-tag-selectable-dark-text, #ffffff);
357
389
  $color-tag-selectable-dark-hover-background: var(--color-tag-selectable-dark-hover-background, #006974);
358
390
  $color-tag-selectable-dark-active-background: var(--color-tag-selectable-dark-active-background, #91d5db);
359
391
  $color-tag-selectable-dark-active-border: var(--color-tag-selectable-dark-active-border, #91d5db);
360
- $color-tag-selectable-dark-active-text: var(--color-tag-selectable-dark-active-text, #1e1e1c);
392
+ $color-tag-selectable-dark-active-text: var(--color-tag-selectable-dark-active-text, #191919);
361
393
  $color-tag-selectable-dark-selected-background: var(--color-tag-selectable-dark-selected-background, #009eac);
362
394
  $color-tag-selectable-dark-selected-border: var(--color-tag-selectable-dark-selected-border, #009eac);
363
- $color-tag-selectable-dark-selected-text: var(--color-tag-selectable-dark-selected-text, #1e1e1c);
395
+ $color-tag-selectable-dark-selected-text: var(--color-tag-selectable-dark-selected-text, #191919);
364
396
  $color-tag-selectable-dark-selected-hover-background: var(--color-tag-selectable-dark-selected-hover-background, #48bac4);
365
- $color-tag-selectable-dark-disabled-background: var(--color-tag-selectable-dark-disabled-background, #555550);
366
- $color-tag-selectable-dark-disabled-text: var(--color-tag-selectable-dark-disabled-text, #8c8b85);
367
- $color-tag-removable-light-background: var(--color-tag-removable-light-background, #3a3936);
397
+ $color-tag-selectable-dark-disabled-background: var(--color-tag-selectable-dark-disabled-background, #4d4d4d);
398
+ $color-tag-selectable-dark-disabled-text: var(--color-tag-selectable-dark-disabled-text, #808080);
399
+ $color-tag-removable-light-background: var(--color-tag-removable-light-background, #333333);
368
400
  $color-tag-removable-light-text: var(--color-tag-removable-light-text, #ffffff);
369
- $color-tag-removable-light-icon: var(--color-tag-removable-light-icon, #dddcd5);
370
- $color-tag-removable-light-hover-background: var(--color-tag-removable-light-hover-background, #555550);
371
- $color-tag-removable-light-active-background: var(--color-tag-removable-light-active-background, #71706b);
372
- $color-tag-removable-dark-background: var(--color-tag-removable-dark-background, #dddcd5);
373
- $color-tag-removable-dark-text: var(--color-tag-removable-dark-text, #1e1e1c);
374
- $color-tag-removable-dark-icon: var(--color-tag-removable-dark-icon, #1e1e1c);
375
- $color-tag-removable-dark-hover-background: var(--color-tag-removable-dark-hover-background, #c2c1ba);
376
- $color-tag-removable-dark-active-background: var(--color-tag-removable-dark-active-background, #a7a6a0);
377
- $color-toggle-off-background: var(--color-toggle-off-background, #71706b);
401
+ $color-tag-removable-light-icon: var(--color-tag-removable-light-icon, #cccccc);
402
+ $color-tag-removable-light-hover-background: var(--color-tag-removable-light-hover-background, #4d4d4d);
403
+ $color-tag-removable-light-active-background: var(--color-tag-removable-light-active-background, #666666);
404
+ $color-tag-removable-dark-background: var(--color-tag-removable-dark-background, #cccccc);
405
+ $color-tag-removable-dark-text: var(--color-tag-removable-dark-text, #191919);
406
+ $color-tag-removable-dark-icon: var(--color-tag-removable-dark-icon, #191919);
407
+ $color-tag-removable-dark-hover-background: var(--color-tag-removable-dark-hover-background, #b3b3b3);
408
+ $color-tag-removable-dark-active-background: var(--color-tag-removable-dark-active-background, #999999);
409
+ $color-toggle-off-background: var(--color-toggle-off-background, #666666);
378
410
  $color-toggle-off-circle: var(--color-toggle-off-circle, #ffffff);
379
411
  $color-toggle-on-background: var(--color-toggle-on-background, #00919f);
380
412
  $color-toggle-on-circle: var(--color-toggle-on-circle, #ffffff);
381
- $color-toggle-hover-circle: var(--color-toggle-hover-circle, #eeedea);
382
- $color-toggle-disabled-background: var(--color-toggle-disabled-background, #eeedea);
383
- $color-toggle-disabled-circle: var(--color-toggle-disabled-circle, #c2c1ba);
413
+ $color-toggle-hover-circle: var(--color-toggle-hover-circle, #e6e6e6);
414
+ $color-toggle-disabled-background: var(--color-toggle-disabled-background, #e6e6e6);
415
+ $color-toggle-disabled-circle: var(--color-toggle-disabled-circle, #b3b3b3);
384
416
  $color-toggle-disabled-checked-background: var(--color-toggle-disabled-checked-background, #91d5db);
385
417
  $color-toggle-disabled-checked-circle: var(--color-toggle-disabled-checked-circle, #ffffff);
418
+ $color-tooltip-background: var(--color-tooltip-background, #4d4d4d);
419
+ $color-tooltip-border: var(--color-tooltip-border, #ffffff);
420
+ $color-secondary-sandgrey-100: var(--color-secondary-sandgrey-100, #eeedea);
421
+ $color-secondary-sandgrey-200: var(--color-secondary-sandgrey-200, #dddcd5);
422
+ $color-secondary-sandgrey-300: var(--color-secondary-sandgrey-300, #c2c1ba);
423
+ $color-secondary-sandgrey-400: var(--color-secondary-sandgrey-400, #a7a6a0);
424
+ $color-secondary-sandgrey-500: var(--color-secondary-sandgrey-500, #8c8b85);
425
+ $color-secondary-sandgrey-600: var(--color-secondary-sandgrey-600, #71706b);
426
+ $color-secondary-sandgrey-700: var(--color-secondary-sandgrey-700, #555550);
427
+ $color-secondary-sandgrey-800: var(--color-secondary-sandgrey-800, #3a3936);
428
+ $color-secondary-sandgrey-900: var(--color-secondary-sandgrey-900, #1e1e1c);