@zonos/amino 5.2.26 → 5.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/components/badge/Badge.js +1 -1
  2. package/components/banner/Banner.js +1 -1
  3. package/components/button/Button.js +1 -1
  4. package/components/checkbox/Checkbox.js +1 -1
  5. package/components/currency/Currency.js +1 -1
  6. package/components/drop-zone/DropZone.js +1 -1
  7. package/components/file-upload/FileUpload.js +1 -1
  8. package/components/filter/FilterWrapper.js +1 -1
  9. package/components/layout/Layout.js +1 -1
  10. package/components/layout/NavigationGroup.js +1 -1
  11. package/components/rich-checkbox/RichCheckbox.js +1 -1
  12. package/components/select/_StyledReactSelect.js +1 -1
  13. package/components/slider/Slider.js +1 -1
  14. package/components/switch/Switch.js +1 -1
  15. package/components/text/LegacyText.js +1 -1
  16. package/components/text/Text.js +1 -1
  17. package/components/text-avatar/TextAvatar.js +1 -1
  18. package/components/toast/Toast.js +1 -1
  19. package/package.json +1 -1
  20. package/styles/constants/theme.d.ts +114 -106
  21. package/styles/constants/theme.js +1 -1
  22. package/theme.css +249 -232
  23. package/theme.scss +14 -10
  24. package/types/Color.d.ts +2 -2
  25. package/utils/getAminoColor.d.ts +1 -1
package/theme.css CHANGED
@@ -14,33 +14,33 @@
14
14
  --amino-glass-700: #101116ad;
15
15
  --amino-glass-800: #101116bc;
16
16
  --amino-glass-900: #101116c6;
17
- --amino-glass-1000: #101116dd;
18
- --amino-glass-1100: #101116ef;
19
- --amino-glass-1200: #101116f5;
17
+ --amino-glass-950: #101116dd;
18
+ --amino-glass-1000: #101116ef;
20
19
  --amino-gray-0: #ffffff;
21
- --amino-gray-50: #f6f6f8;
22
- --amino-gray-100: #ebebf0;
23
- --amino-gray-200: #d9dae3;
24
- --amino-gray-300: #bfc0ce;
25
- --amino-gray-400: #a7a9b9;
26
- --amino-gray-500: #888d9f;
27
- --amino-gray-600: #676c7e;
28
- --amino-gray-700: #575c6b;
29
- --amino-gray-800: #484c5b;
30
- --amino-gray-900: #383a48;
31
- --amino-gray-1000: #2a2c37;
32
- --amino-gray-1100: #1a1c23;
33
- --amino-gray-1200: #101116;
34
- --amino-blue-100: #e7f6fe;
35
- --amino-blue-200: #c9e6fd;
36
- --amino-blue-300: #a3cbfa;
37
- --amino-blue-400: #7fa9f5;
38
- --amino-blue-500: #5a80f1;
39
- --amino-blue-600: #445eee;
40
- --amino-blue-700: #3843c2;
41
- --amino-blue-800: #2e3d94;
42
- --amino-blue-900: #212f68;
43
- --amino-blue-1000: #152141;
20
+ --amino-gray-50: #f4f5f6;
21
+ --amino-gray-100: #e8eaee;
22
+ --amino-gray-200: #dfe2e7;
23
+ --amino-gray-300: #bcc3cd;
24
+ --amino-gray-400: #8a95a8;
25
+ --amino-gray-500: #68748d;
26
+ --amino-gray-600: #555d72;
27
+ --amino-gray-700: #454c5e;
28
+ --amino-gray-800: #343846;
29
+ --amino-gray-900: #272a35;
30
+ --amino-gray-950: #1e2029;
31
+ --amino-gray-1000: #0f1015;
32
+ --amino-blue-50: #e7f0fe;
33
+ --amino-blue-100: #dae7fc;
34
+ --amino-blue-200: #c2d6fb;
35
+ --amino-blue-300: #98b6f8;
36
+ --amino-blue-400: #678ff3;
37
+ --amino-blue-500: #446fee;
38
+ --amino-blue-600: #2e55e2;
39
+ --amino-blue-700: #2544d0;
40
+ --amino-blue-800: #2438a9;
41
+ --amino-blue-900: #232e85;
42
+ --amino-blue-950: #1a1f51;
43
+ --amino-cyan-50: #e6fefd;
44
44
  --amino-cyan-100: #d6fffe;
45
45
  --amino-cyan-200: #c0f2f2;
46
46
  --amino-cyan-300: #9be7e9;
@@ -50,47 +50,51 @@
50
50
  --amino-cyan-700: #29818e;
51
51
  --amino-cyan-800: #25646f;
52
52
  --amino-cyan-900: #1d464e;
53
- --amino-cyan-1000: #152d32;
54
- --amino-red-100: #ffeceb;
55
- --amino-red-200: #fdd0ce;
56
- --amino-red-300: #faa9a9;
57
- --amino-red-400: #f37c82;
58
- --amino-red-500: #eb5c6c;
59
- --amino-red-600: #de314f;
60
- --amino-red-700: #bc2442;
61
- --amino-red-800: #922033;
62
- --amino-red-900: #6c1b26;
63
- --amino-red-1000: #481419;
64
- --amino-orange-100: #fff1e0;
65
- --amino-orange-200: #fcdab8;
66
- --amino-orange-300: #f5c193;
67
- --amino-orange-400: #f7a464;
68
- --amino-orange-500: #f47a34;
69
- --amino-orange-600: #e5591a;
70
- --amino-orange-700: #bd3c1c;
71
- --amino-orange-800: #94301c;
72
- --amino-orange-900: #6b2a1a;
73
- --amino-orange-1000: #401d12;
74
- --amino-green-100: #defde8;
75
- --amino-green-200: #aff8c3;
76
- --amino-green-300: #81ef98;
77
- --amino-green-400: #57db6c;
78
- --amino-green-500: #39c049;
79
- --amino-green-600: #2ca03f;
80
- --amino-green-700: #288129;
81
- --amino-green-800: #246627;
82
- --amino-green-900: #1d4920;
83
- --amino-green-1000: #153219;
84
- --amino-purple-100: #edebff;
85
- --amino-purple-200: #dcd2fe;
86
- --amino-purple-300: #ceb5fd;
87
- --amino-purple-400: #c699fa;
88
- --amino-purple-500: #b25cf5;
89
- --amino-purple-600: #ab26ed;
90
- --amino-purple-700: #901cca;
91
- --amino-purple-800: #6e1e99;
92
- --amino-purple-900: #471d68;
93
- --amino-purple-1000: #2c1844;
53
+ --amino-cyan-950: #152d32;
54
+ --amino-red-50: #ffeceb;
55
+ --amino-red-100: #fee5e5;
56
+ --amino-red-200: #fccfd0;
57
+ --amino-red-300: #faa7ab;
58
+ --amino-red-400: #f67681;
59
+ --amino-red-500: #ee4559;
60
+ --amino-red-600: #dd314b;
61
+ --amino-red-700: #b81835;
62
+ --amino-red-800: #9a1734;
63
+ --amino-red-900: #75142d;
64
+ --amino-red-950: #49081a;
65
+ --amino-orange-50: #fef4e7;
66
+ --amino-orange-100: #fdebd7;
67
+ --amino-orange-200: #f9d3af;
68
+ --amino-orange-300: #f5b27c;
69
+ --amino-orange-400: #f08e47;
70
+ --amino-orange-500: #ec6f23;
71
+ --amino-orange-600: #e5611a;
72
+ --amino-orange-700: #b74a17;
73
+ --amino-orange-800: #923c1a;
74
+ --amino-orange-900: #763018;
75
+ --amino-orange-950: #3f160b;
76
+ --amino-green-50: #f0faef;
77
+ --amino-green-100: #e0f8e0;
78
+ --amino-green-200: #c3efc5;
79
+ --amino-green-300: #93e29a;
80
+ --amino-green-400: #5dcb6a;
81
+ --amino-green-500: #37b04a;
82
+ --amino-green-600: #2ca041;
83
+ --amino-green-700: #237234;
84
+ --amino-green-800: #205b2f;
85
+ --amino-green-900: #1c4b29;
86
+ --amino-green-950: #0a2914;
87
+ --amino-purple-50: #fcf0ff;
88
+ --amino-purple-100: #fae8ff;
89
+ --amino-purple-200: #f4d4ff;
90
+ --amino-purple-300: #e9b2ff;
91
+ --amino-purple-400: #d782fe;
92
+ --amino-purple-500: #c052fa;
93
+ --amino-purple-600: #a126ed;
94
+ --amino-purple-700: #871ed2;
95
+ --amino-purple-800: #6c1eab;
96
+ --amino-purple-900: #4e1881;
97
+ --amino-purple-950: #2f055c;
94
98
  --amino-transparent-white: #ffffffbb;
95
99
  --amino-transparent-black: #101116bb;
96
100
  --amino-transparent-gray-600: #6a6d771f;
@@ -111,18 +115,22 @@
111
115
  inset 0px 0px 8px rgba(0, 0, 0, 0.02),
112
116
  inset 0px 0px 0px 0.5px rgba(0, 0, 0, 0.06),
113
117
  inset 0px 2px 4px rgba(0, 0, 0, 0.04), inset 0px 1px 1px rgba(0, 0, 0, 0.04);
114
- --amino-shadow-button-primary: 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
115
- 0px 1px 3px 0px rgba(68, 94, 238, 0.4);
116
- --amino-shadow-button-success: 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
117
- 0px 1px 3px 0px rgba(43, 156, 77, 0.4);
118
- --amino-shadow-button-danger: 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
119
- 0px 1px 3px 0px rgba(217, 33, 65, 0.4);
120
- --amino-shadow-button-warning: 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
121
- 0px 1px 3px 0px rgba(229, 89, 26, 0.4);
122
- --amino-button-focus-ring: 0 0 0 2px var(--amino-blue-600);
123
- --amino-shadow-button-standard: 0px 1px 3px 0px rgba(110, 110, 120, 0.12),
124
- 0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset,
125
- 0px 0px 0px 1px rgba(106, 109, 119, 0.12) inset;
118
+ --amino-shadow-button-primary: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
119
+ 0px 1px 3px 0px rgba(68, 111, 238, 0.4),
120
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset;
121
+ --amino-shadow-button-success: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
122
+ 0px 1px 3px 0px rgba(55, 176, 74, 0.4),
123
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset;
124
+ --amino-shadow-button-danger: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
125
+ 0px 1px 3px 0px rgba(238, 69, 89, 0.4),
126
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset;
127
+ --amino-shadow-button-warning: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
128
+ 0px 1px 3px 0px rgba(236, 111, 35, 0.4),
129
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset;
130
+ --amino-button-focus-ring: 0 0 0 2px var(--amino-blue-500);
131
+ --amino-shadow-button-standard: 0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset,
132
+ 0px 0px 0px 1px rgba(106, 109, 119, 0.12) inset,
133
+ 0px 1px 3px 0px rgba(110, 110, 120, 0.12);
126
134
  --amino-shadow-button-disabled: 0px 1px 3px 0px rgba(16, 17, 22, 0.2),
127
135
  0px -1px 1px 1px rgba(0, 0, 0, 0.08) inset;
128
136
  --amino-shadow-select-base: 0px 1px 3px 0px rgba(110, 110, 120, 0.12),
@@ -178,38 +186,38 @@
178
186
  --amino-space-80: 5rem;
179
187
  --amino-border: 1px solid var(--amino-border-color);
180
188
  --amino-border-blue: 1px solid var(--amino-blue-500);
181
- --amino-border-red: 1px solid var(--amino-red-400);
182
- --amino-border-cyan: 1px solid var(--amino-cyan-400);
183
- --amino-border-orange: 1px solid var(--amino-orange-400);
184
- --amino-border-green: 1px solid var(--amino-green-400);
185
- --amino-border-purple: 1px solid var(--amino-purple-400);
186
- --amino-border-amber: 1px solid var(--amino-amber-400);
189
+ --amino-border-red: 1px solid var(--amino-red-500);
190
+ --amino-border-cyan: 1px solid var(--amino-cyan-500);
191
+ --amino-border-orange: 1px solid var(--amino-orange-500);
192
+ --amino-border-green: 1px solid var(--amino-green-500);
193
+ --amino-border-purple: 1px solid var(--amino-purple-500);
194
+ --amino-border-amber: 1px solid var(--amino-amber-500);
187
195
  --amino-border-transparent: 1px solid transparent;
188
196
  --amino-border-subtle: 1px solid var(--amino-gray-100);
189
197
  --amino-sidebar-color: var(--amino-gray-0);
190
198
  --amino-header-color: var(--amino-gray-0);
191
- --amino-danger: var(--amino-red-600);
199
+ --amino-danger: var(--amino-red-500);
192
200
  --amino-danger-dark: var(--amino-red-700);
193
- --amino-error: var(--amino-red-600);
194
- --amino-primary: var(--amino-blue-600);
195
- --amino-primary-light: var(--amino-blue-500);
201
+ --amino-error: var(--amino-red-500);
202
+ --amino-primary: var(--amino-blue-500);
203
+ --amino-primary-light: var(--amino-blue-400);
196
204
  --amino-primary-dark: var(--amino-blue-800);
197
- --amino-success: var(--amino-green-600);
205
+ --amino-success: var(--amino-green-500);
198
206
  --amino-success-dark: var(--amino-green-700);
199
- --amino-warning: var(--amino-orange-600);
207
+ --amino-warning: var(--amino-orange-500);
200
208
  --amino-warning-dark: var(--amino-orange-600);
201
- --amino-glow-error: 0 0 0 1px var(--amino-red-600);
209
+ --amino-glow-error: 0 0 0 1px var(--amino-red-500);
202
210
  --amino-glow-blue: 0 0 0 1px var(--amino-primary);
203
- --amino-glow-cyan: 0 0 0 1px var(--amino-cyan-600);
204
- --amino-glow-red: 0 0 0 1px var(--amino-red-600);
205
- --amino-glow-orange: 0 0 0 1px var(--amino-orange-600);
206
- --amino-glow-green: 0 0 0 1px var(--amino-green-600);
207
- --amino-glow-purple: 0 0 0 1px var(--amino-purple-600);
211
+ --amino-glow-cyan: 0 0 0 1px var(--amino-cyan-500);
212
+ --amino-glow-red: 0 0 0 1px var(--amino-red-500);
213
+ --amino-glow-orange: 0 0 0 1px var(--amino-orange-500);
214
+ --amino-glow-green: 0 0 0 1px var(--amino-green-500);
215
+ --amino-glow-purple: 0 0 0 1px var(--amino-purple-500);
208
216
  --amino-page-background: var(--amino-gray-0);
209
217
  --amino-border-color: var(--amino-gray-200);
210
218
  --amino-hover-color: var(--amino-gray-50);
211
- --amino-text-color: var(--amino-gray-1200);
212
- --amino-text-color-secondary: var(--amino-gray-800);
219
+ --amino-text-color: var(--amino-gray-1000);
220
+ --amino-text-color-secondary: var(--amino-gray-700);
213
221
  --amino-focus-button-standard: 0px 0px 0px 1px
214
222
  var(--amino-transparent-gray-600) inset,
215
223
  var(--amino-button-focus-ring);
@@ -222,25 +230,29 @@
222
230
  --amino-raised-color-secondary: var(--amino-gray-50);
223
231
  --amino-button-primary-hover: linear-gradient(
224
232
  180deg,
225
- #445eee 0%,
226
- #364bd4 100%
233
+ #446fee 0%,
234
+ #2e55e2 100%
227
235
  );
228
236
  --amino-button-success-hover: linear-gradient(
229
237
  180deg,
230
- #2b9c4d 0%,
231
- #298549 100%
238
+ #37b04a 0%,
239
+ #2ca041 100%
232
240
  );
233
241
  --amino-button-danger-hover: linear-gradient(
234
242
  180deg,
235
- #d92141 0%,
236
- #b4223d 100%
243
+ #ee4559 0%,
244
+ #dd314b 100%
237
245
  );
238
246
  --amino-button-warning-hover: linear-gradient(
239
247
  180deg,
240
- #e5591a 0%,
241
- #b6471b 100%
248
+ #ec6f23 0%,
249
+ #e5611a 100%
250
+ );
251
+ --amino-button-standard-hover: linear-gradient(
252
+ 180deg,
253
+ #ffffff 0%,
254
+ #e8eaee 100%
242
255
  );
243
- --amino-button-standard-hover: linear-gradient(180deg, #fff 0%, #eaebed 100%);
244
256
  --amino-spinner-track-black: rgba(0, 0, 0, 0.3);
245
257
  --amino-spinner-stroke-black: #0c0c0c;
246
258
  --amino-spinner-track-white: rgba(255, 255, 255, 0.3);
@@ -304,83 +316,87 @@
304
316
  --amino-glass-700: #ffffffa8;
305
317
  --amino-glass-800: #ffffffc1;
306
318
  --amino-glass-900: #ffffffd8;
307
- --amino-glass-1000: #ffffffea;
308
- --amino-glass-1100: #fffffff4;
309
- --amino-glass-1200: #fffffffa;
310
- --amino-gray-0: #101116;
311
- --amino-gray-50: #1a1c23;
312
- --amino-gray-100: #2a2c37;
313
- --amino-gray-200: #383a48;
314
- --amino-gray-300: #484c5b;
315
- --amino-gray-400: #575c6b;
316
- --amino-gray-500: #676c7e;
317
- --amino-gray-600: #888d9f;
318
- --amino-gray-700: #a7a9b9;
319
- --amino-gray-800: #bfc0ce;
320
- --amino-gray-900: #d9dae3;
321
- --amino-gray-1000: #ebebf0;
322
- --amino-gray-1100: #f6f6f8;
323
- --amino-gray-1200: #ffffff;
324
- --amino-blue-100: #152141;
325
- --amino-blue-200: #212f68;
326
- --amino-blue-300: #2e3d94;
327
- --amino-blue-400: #3843c2;
328
- --amino-blue-500: #445eee;
329
- --amino-blue-600: #5a80f1;
330
- --amino-blue-700: #7fa9f5;
331
- --amino-blue-800: #a8cefa;
332
- --amino-blue-900: #c9e6fd;
333
- --amino-blue-1000: #e7f6fe;
334
- --amino-cyan-100: #152d32;
335
- --amino-cyan-200: #1d464e;
336
- --amino-cyan-300: #25646f;
337
- --amino-cyan-400: #29818e;
338
- --amino-cyan-500: #2ca0af;
339
- --amino-cyan-600: #3ec4d0;
340
- --amino-cyan-700: #66d5db;
341
- --amino-cyan-800: #9be7e9;
342
- --amino-cyan-900: #c0f2f2;
343
- --amino-cyan-1000: #d6fffe;
344
- --amino-red-100: #481419;
345
- --amino-red-200: #6c1b26;
346
- --amino-red-300: #922033;
347
- --amino-red-400: #bc2442;
348
- --amino-red-500: #de314f;
349
- --amino-red-600: #eb5c6c;
350
- --amino-red-700: #f37c82;
351
- --amino-red-800: #faa9a9;
352
- --amino-red-900: #fdd0ce;
353
- --amino-red-1000: #ffeceb;
354
- --amino-orange-100: #401d12;
355
- --amino-orange-200: #6b2a1a;
356
- --amino-orange-300: #94301c;
357
- --amino-orange-400: #bd3c1c;
358
- --amino-orange-500: #e5591a;
359
- --amino-orange-600: #f47a34;
360
- --amino-orange-700: #f7a464;
361
- --amino-orange-800: #f5c193;
362
- --amino-orange-900: #fcdab8;
363
- --amino-orange-1000: #fff1e0;
364
- --amino-green-100: #153219;
365
- --amino-green-200: #1d4920;
366
- --amino-green-300: #246627;
367
- --amino-green-400: #288129;
368
- --amino-green-500: #2ca03f;
369
- --amino-green-600: #39c049;
370
- --amino-green-700: #57db6c;
371
- --amino-green-800: #81ef98;
372
- --amino-green-900: #aff8c3;
373
- --amino-green-1000: #defde8;
374
- --amino-purple-100: #2c1844;
375
- --amino-purple-200: #471d68;
376
- --amino-purple-300: #6e1e99;
377
- --amino-purple-400: #901cca;
378
- --amino-purple-500: #ab26ed;
379
- --amino-purple-600: #b25cf5;
380
- --amino-purple-700: #c699fa;
381
- --amino-purple-800: #ceb5fd;
382
- --amino-purple-900: #dcd2fe;
383
- --amino-purple-1000: #edebff;
319
+ --amino-glass-950: #ffffffea;
320
+ --amino-glass-1000: #fffffff4;
321
+ --amino-gray-0: #0f1015;
322
+ --amino-gray-50: #1e2029;
323
+ --amino-gray-100: #272a35;
324
+ --amino-gray-200: #343846;
325
+ --amino-gray-300: #454c5e;
326
+ --amino-gray-400: #555d72;
327
+ --amino-gray-500: #68748d;
328
+ --amino-gray-600: #8a95a8;
329
+ --amino-gray-700: #bcc3cd;
330
+ --amino-gray-800: #dfe2e7;
331
+ --amino-gray-900: #e8eaee;
332
+ --amino-gray-950: #f4f5f6;
333
+ --amino-gray-1000: #ffffff;
334
+ --amino-blue-50: #1a1f51;
335
+ --amino-blue-100: #232e85;
336
+ --amino-blue-200: #2438a9;
337
+ --amino-blue-300: #2544d0;
338
+ --amino-blue-400: #2e55e2;
339
+ --amino-blue-500: #446fee;
340
+ --amino-blue-600: #678ff3;
341
+ --amino-blue-700: #98b6f8;
342
+ --amino-blue-800: #c2d6fb;
343
+ --amino-blue-900: #dae7fc;
344
+ --amino-blue-950: #e7f0fe;
345
+ --amino-cyan-50: #152d32;
346
+ --amino-cyan-100: #1d464e;
347
+ --amino-cyan-200: #25646f;
348
+ --amino-cyan-300: #29818e;
349
+ --amino-cyan-400: #2ca0af;
350
+ --amino-cyan-500: #3ec4d0;
351
+ --amino-cyan-600: #66d5db;
352
+ --amino-cyan-700: #9be7e9;
353
+ --amino-cyan-800: #c0f2f2;
354
+ --amino-cyan-900: #d6fffe;
355
+ --amino-cyan-950: #e6fefd;
356
+ --amino-red-50: #49081a;
357
+ --amino-red-100: #75142d;
358
+ --amino-red-200: #9a1734;
359
+ --amino-red-300: #b81835;
360
+ --amino-red-400: #dd314b;
361
+ --amino-red-500: #ee4559;
362
+ --amino-red-600: #f67681;
363
+ --amino-red-700: #faa7ab;
364
+ --amino-red-800: #fccfd0;
365
+ --amino-red-900: #fee5e5;
366
+ --amino-red-950: #ffeceb;
367
+ --amino-orange-50: #3f160b;
368
+ --amino-orange-100: #763018;
369
+ --amino-orange-200: #923c1a;
370
+ --amino-orange-300: #b74a17;
371
+ --amino-orange-400: #e5611a;
372
+ --amino-orange-500: #ec6f23;
373
+ --amino-orange-600: #f08e47;
374
+ --amino-orange-700: #f5b27c;
375
+ --amino-orange-800: #f9d3af;
376
+ --amino-orange-900: #fdebd7;
377
+ --amino-orange-950: #fef4e7;
378
+ --amino-green-50: #0a2914;
379
+ --amino-green-100: #1c4b29;
380
+ --amino-green-200: #205b2f;
381
+ --amino-green-300: #237234;
382
+ --amino-green-400: #2ca041;
383
+ --amino-green-500: #37b04a;
384
+ --amino-green-600: #5dcb6a;
385
+ --amino-green-700: #93e29a;
386
+ --amino-green-800: #c3efc5;
387
+ --amino-green-900: #e0f8e0;
388
+ --amino-green-950: #f0faef;
389
+ --amino-purple-50: #2f055c;
390
+ --amino-purple-100: #4e1881;
391
+ --amino-purple-200: #6c1eab;
392
+ --amino-purple-300: #871ed2;
393
+ --amino-purple-400: #a126ed;
394
+ --amino-purple-500: #c052fa;
395
+ --amino-purple-600: #d782fe;
396
+ --amino-purple-700: #e9b2ff;
397
+ --amino-purple-800: #f4d4ff;
398
+ --amino-purple-900: #fae8ff;
399
+ --amino-purple-950: #fcf0ff;
384
400
  --amino-transparent-white: #101116bb;
385
401
  --amino-transparent-black: #ffffffbb;
386
402
  --amino-transparent-gray-600: #94969e1f;
@@ -400,28 +416,25 @@
400
416
  inset 0px 2px 4px rgba(0, 0, 0, 0.24), inset 0px 1px 1px rgba(0, 0, 0, 0.24),
401
417
  0px 0px 6px rgba(255, 255, 255, 0.08),
402
418
  0px 0px 0px 1px rgba(255, 255, 255, 0.12);
403
- --amino-shadow-button-primary: 0px 0px 0px 1px #000,
404
- 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
419
+ --amino-shadow-button-primary: 0px 1px 3px 0px rgba(68, 111, 238, 0.4),
405
420
  0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,
406
- 0px 1px 3px 0px rgba(95, 146, 246, 0.4);
407
- --amino-shadow-button-success: 0px 0px 0px 1px #000,
408
- 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
421
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px 0px 0.5px #000;
422
+ --amino-shadow-button-success: 0px 1px 3px 0px rgba(55, 176, 74, 0.4),
409
423
  0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,
410
- 0px 1px 3px 0px rgba(86, 199, 111, 0.6);
411
- --amino-shadow-button-danger: 0px 0px 0px 1px #000,
412
- 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
424
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px 0px 0.5px #000;
425
+ --amino-shadow-button-danger: 0px 1px 3px 0px rgba(238, 69, 89, 0.4),
413
426
  0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,
414
- 0px 1px 3px 0px rgba(249, 92, 103, 0.6);
415
- --amino-shadow-button-warning: 0px 0px 0px 1px #000,
416
- 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
427
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px 0px 0.5px #000;
428
+ --amino-shadow-button-warning: 0px 1px 3px 0px rgba(236, 111, 35, 0.4),
417
429
  0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,
418
- 0px 1px 3px 0px rgba(248, 140, 83, 0.6);
419
- --amino-button-focus-ring: 0 0 0 2px var(--amino-blue-600);
420
- --amino-shadow-button-standard: 0px 0px 0px 1px #000,
421
- 0px -1px 1px 0px rgba(0, 0, 0, 0.4) inset,
422
- 0px 0px 2px 1px rgba(255, 255, 255, 0.08) inset,
430
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset, 0px 0px 0px 0.5px #000;
431
+ --amino-button-focus-ring: 0 0 0 2px var(--amino-blue-500);
432
+ --amino-shadow-button-standard: 0px 0px 0px 1px rgba(255, 255, 255, 0.08)
433
+ inset,
423
434
  0px 1px 3px 0px rgba(0, 0, 0, 0.8),
424
- 0px 0px 0px 1px rgba(148, 150, 158, 0.12) inset;
435
+ 0px 0px 2px 1px rgba(255, 255, 255, 0.08) inset,
436
+ 0px -1px 1px 0px rgba(0, 0, 0, 0.4) inset,
437
+ 0px 0px 0px 0.5px rgba(0, 0, 0, 0.5);
425
438
  --amino-shadow-button-disabled: 0px 0px 0px 1px #000,
426
439
  0px -1px 1px 0px rgba(0, 0, 0, 0.2) inset,
427
440
  0px 0px 0px 1px rgba(255, 255, 255, 0.08) inset,
@@ -439,38 +452,38 @@
439
452
  0px 0px 0px 1px #eb5c6c inset, 0px 1px 3px 0px rgba(235, 92, 108, 0.6);
440
453
  --amino-border: 1px solid var(--amino-border-color);
441
454
  --amino-border-blue: 1px solid var(--amino-blue-500);
442
- --amino-border-red: 1px solid var(--amino-red-400);
443
- --amino-border-cyan: 1px solid var(--amino-cyan-400);
444
- --amino-border-orange: 1px solid var(--amino-orange-400);
445
- --amino-border-green: 1px solid var(--amino-green-400);
446
- --amino-border-purple: 1px solid var(--amino-purple-400);
447
- --amino-border-amber: 1px solid var(--amino-amber-400);
455
+ --amino-border-red: 1px solid var(--amino-red-500);
456
+ --amino-border-cyan: 1px solid var(--amino-cyan-500);
457
+ --amino-border-orange: 1px solid var(--amino-orange-500);
458
+ --amino-border-green: 1px solid var(--amino-green-500);
459
+ --amino-border-purple: 1px solid var(--amino-purple-500);
460
+ --amino-border-amber: 1px solid var(--amino-amber-500);
448
461
  --amino-border-transparent: 1px solid transparent;
449
462
  --amino-border-subtle: 1px solid var(--amino-gray-100);
450
463
  --amino-sidebar-color: var(--amino-gray-0);
451
464
  --amino-header-color: var(--amino-gray-0);
452
- --amino-danger: var(--amino-red-600);
465
+ --amino-danger: var(--amino-red-500);
453
466
  --amino-danger-dark: var(--amino-red-700);
454
- --amino-error: var(--amino-red-600);
455
- --amino-primary: var(--amino-blue-600);
456
- --amino-primary-light: var(--amino-blue-500);
467
+ --amino-error: var(--amino-red-500);
468
+ --amino-primary: var(--amino-blue-500);
469
+ --amino-primary-light: var(--amino-blue-400);
457
470
  --amino-primary-dark: var(--amino-blue-800);
458
- --amino-success: var(--amino-green-600);
471
+ --amino-success: var(--amino-green-500);
459
472
  --amino-success-dark: var(--amino-green-700);
460
- --amino-warning: var(--amino-orange-600);
473
+ --amino-warning: var(--amino-orange-500);
461
474
  --amino-warning-dark: var(--amino-orange-600);
462
- --amino-glow-error: 0 0 0 1px var(--amino-red-600);
475
+ --amino-glow-error: 0 0 0 1px var(--amino-red-500);
463
476
  --amino-glow-blue: 0 0 0 1px var(--amino-primary);
464
- --amino-glow-cyan: 0 0 0 1px var(--amino-cyan-600);
465
- --amino-glow-red: 0 0 0 1px var(--amino-red-600);
466
- --amino-glow-orange: 0 0 0 1px var(--amino-orange-600);
467
- --amino-glow-green: 0 0 0 1px var(--amino-green-600);
468
- --amino-glow-purple: 0 0 0 1px var(--amino-purple-600);
477
+ --amino-glow-cyan: 0 0 0 1px var(--amino-cyan-500);
478
+ --amino-glow-red: 0 0 0 1px var(--amino-red-500);
479
+ --amino-glow-orange: 0 0 0 1px var(--amino-orange-500);
480
+ --amino-glow-green: 0 0 0 1px var(--amino-green-500);
481
+ --amino-glow-purple: 0 0 0 1px var(--amino-purple-500);
469
482
  --amino-page-background: var(--amino-gray-0);
470
483
  --amino-border-color: var(--amino-gray-200);
471
484
  --amino-hover-color: var(--amino-gray-50);
472
- --amino-text-color: var(--amino-gray-1200);
473
- --amino-text-color-secondary: var(--amino-gray-800);
485
+ --amino-text-color: var(--amino-gray-1000);
486
+ --amino-text-color-secondary: var(--amino-gray-700);
474
487
  --amino-focus-button-standard: 0px 0px 0px 1px
475
488
  var(--amino-transparent-gray-600) inset,
476
489
  var(--amino-button-focus-ring);
@@ -479,29 +492,33 @@
479
492
  --amino-surface-color: var(--amino-gray-50);
480
493
  --amino-surface-color-secondary: var(--amino-gray-100);
481
494
  --amino-backdrop-color: #000000;
482
- --amino-raised-surface-color: #2c2e3899;
495
+ --amino-raised-surface-color: #272a3599;
483
496
  --amino-raised-color-secondary: var(--amino-gray-0);
484
497
  --amino-button-primary-hover: linear-gradient(
485
498
  180deg,
486
- #5a80f1 0%,
487
- #7fa9f5 100%
499
+ #446fee 0%,
500
+ #2e55e2 100%
488
501
  );
489
502
  --amino-button-success-hover: linear-gradient(
490
503
  180deg,
491
- #39c049 0%,
492
- #57db6c 100%
504
+ #37b04a 0%,
505
+ #2ca041 100%
493
506
  );
494
507
  --amino-button-danger-hover: linear-gradient(
495
508
  180deg,
496
- #e9495c 0%,
497
- #f37c82 100%
509
+ #ee4559 0%,
510
+ #dd314b 100%
498
511
  );
499
512
  --amino-button-warning-hover: linear-gradient(
500
513
  180deg,
501
- #f47a34 0%,
502
- #f7a464 100%
514
+ #ec6f23 0%,
515
+ #e5611a 100%
516
+ );
517
+ --amino-button-standard-hover: linear-gradient(
518
+ 180deg,
519
+ #272a3599 0%,
520
+ #494c5780 100%
503
521
  );
504
- --amino-button-standard-hover: linear-gradient(180deg, #2c2e3800, #2c2e38e5);
505
522
  --amino-spinner-track-black: rgba(255, 255, 255, 0.3);
506
523
  --amino-spinner-stroke-black: #ffffff;
507
524
  --amino-spinner-track-white: rgba(0, 0, 0, 0.3);