@epam/assets 5.4.2 → 5.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 (27) hide show
  1. package/css/theme/theme_electric.css +46 -49
  2. package/css/theme/theme_electric.css.map +1 -1
  3. package/css/theme/theme_loveship.css +51 -53
  4. package/css/theme/theme_loveship.css.map +1 -1
  5. package/css/theme/theme_loveship_dark.css +131 -111
  6. package/css/theme/theme_loveship_dark.css.map +1 -1
  7. package/css/theme/theme_promo.css +29 -31
  8. package/css/theme/theme_promo.css.map +1 -1
  9. package/css/theme/theme_vanilla_thunder.css +11 -0
  10. package/css/theme/theme_vanilla_thunder.css.map +1 -1
  11. package/icons/loaders/dots_loader_30.svg +37 -20
  12. package/package.json +3 -3
  13. package/scss/loveship/colors.scss +4 -25
  14. package/scss/promo/colors.scss +10 -26
  15. package/theme/theme_electric.scss +73 -68
  16. package/theme/theme_loveship.scss +85 -79
  17. package/theme/theme_loveship_dark.scss +172 -132
  18. package/theme/theme_promo.scss +52 -47
  19. package/theme/theme_vanilla_thunder.scss +16 -0
  20. package/icons/common/content-link-opt-12.2 +0 -1
  21. package/icons/common/content-link-opt-18.2 +0 -1
  22. package/icons/common/content-link-opt-24.2 +0 -1
  23. package/icons/common/content-link-opt-36.2 +0 -1
  24. package/icons/common/content-link_off-opt-12.2 +0 -1
  25. package/icons/common/content-link_off-opt-18.2 +0 -1
  26. package/icons/common/content-link_off-opt-24.2 +0 -1
  27. package/icons/common/content-link_off-opt-36.2 +0 -1
package/css/theme/theme_loveship_dark.css CHANGED
@@ -11,30 +11,30 @@
11
11
  --night700:#303240;
12
12
  --night800:#272833;
13
13
  --night900:#1D1E26;
14
- --blue-5:#2C394B;
15
- --blue-10:#334052;
16
- --blue-20:#3E586F;
17
- --blue-50:#008ACE;
18
- --blue-60:#48A4D0;
19
- --blue-70:#7DBCDB;
20
- --green-5:#343A3B;
21
- --green-10:#39443D;
22
- --green-20:#505F49;
23
- --green-50:#669900;
24
- --green-60:#83B918;
25
- --green-70:#A6D151;
26
- --amber-5:#3F3B3B;
27
- --amber-10:#47433D;
28
- --amber-20:#625747;
29
- --amber-50:#F1A105;
30
- --amber-60:#F4B83A;
31
- --amber-70:#FFD06D;
32
- --red-5:#3C343E;
33
- --red-10:#473943;
34
- --red-20:#6B4447;
35
- --red-50:#CC482D;
36
- --red-60:#E56248;
37
- --red-70:#F78C77;
14
+ --sky-5:#2C394B;
15
+ --sky-10:#334052;
16
+ --sky-20:#3E586F;
17
+ --sky-50:#008ACE;
18
+ --sky-60:#48A4D0;
19
+ --sky-70:#7DBCDB;
20
+ --grass-5:#343A3B;
21
+ --grass-10:#39443D;
22
+ --grass-20:#505F49;
23
+ --grass-50:#669900;
24
+ --grass-60:#83B918;
25
+ --grass-70:#A6D151;
26
+ --sun-5:#3F3B3B;
27
+ --sun-10:#47433D;
28
+ --sun-20:#625747;
29
+ --sun-50:#F1A105;
30
+ --sun-60:#F4B83A;
31
+ --sun-70:#FFD06D;
32
+ --fire-5:#3C343E;
33
+ --fire-10:#473943;
34
+ --fire-20:#6B4447;
35
+ --fire-50:#CC482D;
36
+ --fire-60:#E56248;
37
+ --fire-70:#F78C77;
38
38
  --white:#FFFFFF;
39
39
  --yellow-5:#403F40;
40
40
  --yellow-10:#4F4B3F;
@@ -84,20 +84,20 @@
84
84
  --mint-50:#4CC38A;
85
85
  --mint-60:#79D2A7;
86
86
  --mint-70:#A6E1C5;
87
- --uui-accent-5:var(--green-5);
88
- --uui-accent-10:var(--green-10);
89
- --uui-accent-20:var(--green-20);
90
- --uui-accent-50:var(--green-50);
91
- --uui-accent-60:var(--green-60);
92
- --uui-accent-70:var(--green-70);
93
- --uui-accent-contrast:var(--white);
94
- --uui-primary-5:var(--blue-5);
95
- --uui-primary-10:var(--blue-10);
96
- --uui-primary-20:var(--blue-20);
97
- --uui-primary-50:var(--blue-50);
98
- --uui-primary-60:var(--blue-60);
99
- --uui-primary-70:var(--blue-70);
87
+ --uui-primary-5:var(--sky-5);
88
+ --uui-primary-10:var(--sky-10);
89
+ --uui-primary-20:var(--sky-20);
90
+ --uui-primary-50:var(--sky-50);
91
+ --uui-primary-60:var(--sky-60);
92
+ --uui-primary-70:var(--sky-70);
100
93
  --uui-primary-contrast:var(--white);
94
+ --uui-accent-5:var(--grass-5);
95
+ --uui-accent-10:var(--grass-10);
96
+ --uui-accent-20:var(--grass-20);
97
+ --uui-accent-50:var(--grass-50);
98
+ --uui-accent-60:var(--grass-60);
99
+ --uui-accent-70:var(--grass-70);
100
+ --uui-accent-contrast:var(--white);
101
101
  --uui-secondary-5:var(--night800);
102
102
  --uui-secondary-10:var(--night700);
103
103
  --uui-secondary-20:var(--night600);
@@ -105,40 +105,40 @@
105
105
  --uui-secondary-60:var(--night400);
106
106
  --uui-secondary-70:var(--night300);
107
107
  --uui-secondary-contrast:var(--white);
108
- --uui-critical-5:var(--red-5);
109
- --uui-critical-10:var(--red-10);
110
- --uui-critical-20:var(--red-20);
111
- --uui-critical-50:var(--red-50);
112
- --uui-critical-60:var(--red-60);
113
- --uui-critical-70:var(--red-70);
108
+ --uui-critical-5:var(--fire-5);
109
+ --uui-critical-10:var(--fire-10);
110
+ --uui-critical-20:var(--fire-20);
111
+ --uui-critical-50:var(--fire-50);
112
+ --uui-critical-60:var(--fire-60);
113
+ --uui-critical-70:var(--fire-70);
114
114
  --uui-critical-contrast:var(--white);
115
- --uui-info-5:var(--blue-5);
116
- --uui-info-10:var(--blue-10);
117
- --uui-info-20:var(--blue-20);
118
- --uui-info-50:var(--blue-50);
119
- --uui-info-60:var(--blue-60);
120
- --uui-info-70:var(--blue-70);
115
+ --uui-info-5:var(--sky-5);
116
+ --uui-info-10:var(--sky-10);
117
+ --uui-info-20:var(--sky-20);
118
+ --uui-info-50:var(--sky-50);
119
+ --uui-info-60:var(--sky-60);
120
+ --uui-info-70:var(--sky-70);
121
121
  --uui-info-contrast:var(--white);
122
- --uui-success-5:var(--green-5);
123
- --uui-success-10:var(--green-10);
124
- --uui-success-20:var(--green-20);
125
- --uui-success-50:var(--green-50);
126
- --uui-success-60:var(--green-60);
127
- --uui-success-70:var(--green-70);
122
+ --uui-success-5:var(--grass-5);
123
+ --uui-success-10:var(--grass-10);
124
+ --uui-success-20:var(--grass-20);
125
+ --uui-success-50:var(--grass-50);
126
+ --uui-success-60:var(--grass-60);
127
+ --uui-success-70:var(--grass-70);
128
128
  --uui-success-contrast:var(--white);
129
- --uui-warning-5:var(--amber-5);
130
- --uui-warning-10:var(--amber-10);
131
- --uui-warning-20:var(--amber-20);
132
- --uui-warning-50:var(--amber-50);
133
- --uui-warning-60:var(--amber-60);
134
- --uui-warning-70:var(--amber-70);
129
+ --uui-warning-5:var(--sun-5);
130
+ --uui-warning-10:var(--sun-10);
131
+ --uui-warning-20:var(--sun-20);
132
+ --uui-warning-50:var(--sun-50);
133
+ --uui-warning-60:var(--sun-60);
134
+ --uui-warning-70:var(--sun-70);
135
135
  --uui-warning-contrast:var(--night700);
136
- --uui-error-5:var(--red-5);
137
- --uui-error-10:var(--red-10);
138
- --uui-error-20:var(--red-20);
139
- --uui-error-50:var(--red-50);
140
- --uui-error-60:var(--red-60);
141
- --uui-error-70:var(--red-70);
136
+ --uui-error-5:var(--fire-5);
137
+ --uui-error-10:var(--fire-10);
138
+ --uui-error-20:var(--fire-20);
139
+ --uui-error-50:var(--fire-50);
140
+ --uui-error-60:var(--fire-60);
141
+ --uui-error-70:var(--fire-70);
142
142
  --uui-error-contrast:var(--white);
143
143
  --uui-neutral-0:#FFFFFF;
144
144
  --uui-neutral-5:var(--night50);
@@ -169,8 +169,8 @@
169
169
  --uui-text-warning:var(--uui-warning-70);
170
170
  --uui-text-critical:var(--uui-critical-70);
171
171
  --uui-text-success:var(--uui-success-70);
172
- --uui-link:var(--blue-60);
173
- --uui-link-hover:var(--blue-70);
172
+ --uui-link:var(--sky-60);
173
+ --uui-link-hover:var(--sky-70);
174
174
  --uui-link-visited:#9062EC;
175
175
  --uui-link-visited-hover:#A884F0;
176
176
  --uui-link-disabled:var(--uui-neutral-60);
@@ -211,12 +211,12 @@
211
211
  }
212
212
  .uui-theme-loveship_dark .uui-color-accent,
213
213
  .uui-theme-loveship_dark .uui-color-grass{
214
- --uui-color-5:var(--green-5);
215
- --uui-color-10:var(--green-10);
216
- --uui-color-20:var(--green-20);
217
- --uui-color-50:var(--green-50);
218
- --uui-color-60:var(--green-60);
219
- --uui-color-70:var(--green-70);
214
+ --uui-color-5:var(--grass-5);
215
+ --uui-color-10:var(--grass-10);
216
+ --uui-color-20:var(--grass-20);
217
+ --uui-color-50:var(--grass-50);
218
+ --uui-color-60:var(--grass-60);
219
+ --uui-color-70:var(--grass-70);
220
220
  --uui-color-contrast:var(--white);
221
221
  }
222
222
  .uui-theme-loveship_dark .uui-color-success{
@@ -230,21 +230,21 @@
230
230
  }
231
231
  .uui-theme-loveship_dark .uui-color-primary,
232
232
  .uui-theme-loveship_dark .uui-color-sky{
233
- --uui-color-5:var(--blue-5);
234
- --uui-color-10:var(--blue-10);
235
- --uui-color-20:var(--blue-20);
236
- --uui-color-50:var(--blue-50);
237
- --uui-color-60:var(--blue-60);
238
- --uui-color-70:var(--blue-70);
233
+ --uui-color-5:var(--sky-5);
234
+ --uui-color-10:var(--sky-10);
235
+ --uui-color-20:var(--sky-20);
236
+ --uui-color-50:var(--sky-50);
237
+ --uui-color-60:var(--sky-60);
238
+ --uui-color-70:var(--sky-70);
239
239
  --uui-color-contrast:var(--white);
240
240
  }
241
241
  .uui-theme-loveship_dark .uui-color-fire{
242
- --uui-color-5:var(--red-5);
243
- --uui-color-10:var(--red-10);
244
- --uui-color-20:var(--red-20);
245
- --uui-color-50:var(--red-50);
246
- --uui-color-60:var(--red-60);
247
- --uui-color-70:var(--red-70);
242
+ --uui-color-5:var(--fire-5);
243
+ --uui-color-10:var(--fire-10);
244
+ --uui-color-20:var(--fire-20);
245
+ --uui-color-50:var(--fire-50);
246
+ --uui-color-60:var(--fire-60);
247
+ --uui-color-70:var(--fire-70);
248
248
  --uui-color-contrast:var(--white);
249
249
  }
250
250
  .uui-theme-loveship_dark .uui-color-info{
@@ -267,12 +267,12 @@
267
267
  }
268
268
  .uui-theme-loveship_dark .uui-color-sun,
269
269
  .uui-theme-loveship_dark .uui-color-warning{
270
- --uui-color-5:var(--amber-5);
271
- --uui-color-10:var(--amber-10);
272
- --uui-color-20:var(--amber-20);
273
- --uui-color-50:var(--amber-50);
274
- --uui-color-60:var(--amber-60);
275
- --uui-color-70:var(--amber-70);
270
+ --uui-color-5:var(--sun-5);
271
+ --uui-color-10:var(--sun-10);
272
+ --uui-color-20:var(--sun-20);
273
+ --uui-color-50:var(--sun-50);
274
+ --uui-color-60:var(--sun-60);
275
+ --uui-color-70:var(--sun-70);
276
276
  --uui-color-contrast:var(--night700);
277
277
  }
278
278
  .uui-theme-loveship_dark .uui-color-error{
@@ -374,6 +374,9 @@
374
374
  --uui-color-70:var(--uui-neutral-20);
375
375
  --uui-color-contrast:var(--night700);
376
376
  }
377
+ .uui-theme-loveship_dark .uui-invalid:is(.uui-input-box, .uui-radio-input-container, .uui-checkbox-container){
378
+ --uui-error-50:var(--uui-error-60);
379
+ }
377
380
  .uui-theme-loveship_dark .uui-accordion-container{
378
381
  --uui-accordion-border-radius:6px;
379
382
  }
@@ -422,17 +425,30 @@
422
425
  --uui-btn-border-active:var(--uui-neutral-50);
423
426
  --uui-btn-caption:var(--uui-neutral-10);
424
427
  }
428
+ .uui-theme-loveship_dark .uui-button.uui-color-white.uui-fill-none, .uui-theme-loveship_dark .uui-button.uui-color-white.uui-fill-ghost{
429
+ --uui-btn-bg-hover:color-mix(in srgb, var(--uui-neutral-0) 20%, transparent);
430
+ --uui-btn-bg-active:color-mix(in srgb, var(--uui-neutral-0) 30%, transparent);
431
+ }
432
+ .uui-theme-loveship_dark .uui-button.uui-color-white.uui-fill-ghost{
433
+ --uui-btn-border:var(--uui-btn-bg);
434
+ --uui-btn-border-hover:var(--uui-btn-bg);
435
+ --uui-btn-border-active:var(--uui-btn-bg);
436
+ }
437
+ .uui-theme-loveship_dark .uui-button.uui-color-white.uui-fill-outline{
438
+ --uui-btn-bg-hover:color-mix(in srgb, var(--uui-neutral-0) 20%, transparent);
439
+ --uui-btn-bg-active:color-mix(in srgb, var(--uui-neutral-0) 30%, transparent);
440
+ }
425
441
  .uui-theme-loveship_dark .uui-blocker-container{
426
442
  --uui-blocker-bg:var(--uui-surface-main);
427
443
  --uui-blocker-bg-with-opacity:#303240CC;
428
444
  }
429
445
  .uui-theme-loveship_dark .uui-badge.uui-fill-outline .uui-count_indicator{
430
- --uui-count_indicator-bg:var(--uui-neutral-20);
431
- --uui-count_indicator-border:var(--uui-neutral-50);
432
- --uui-count_indicator-caption:var(--uui-neutral-80);
446
+ --uui-count_indicator-bg:var(--uui-neutral-70);
447
+ --uui-count_indicator-border:var(--uui-neutral-40);
448
+ --uui-count_indicator-caption:var(--uui-neutral-10);
433
449
  }
434
- .uui-theme-loveship_dark .uui-badge.uui-color-neutral,
435
- .uui-theme-loveship_dark .uui-badge.uui-color-night300{
450
+ .uui-theme-loveship_dark .uui-badge.uui-color-neutral.uui-fill-solid,
451
+ .uui-theme-loveship_dark .uui-badge.uui-color-night300.uui-fill-solid{
436
452
  --uui-badge-bg:var(--uui-neutral-40);
437
453
  --uui-badge-bg-hover:var(--uui-neutral-30);
438
454
  --uui-badge-border:var(--uui-neutral-40);
@@ -454,7 +470,12 @@
454
470
  --uui-badge-caption:var(--white);
455
471
  --uui-badge-caption-hover:var(--white);
456
472
  }
457
- .uui-theme-loveship_dark .uui-badge.uui-color-night100{
473
+ .uui-theme-loveship_dark .uui-badge.uui-color-white.uui-fill-outline .uui-count_indicator{
474
+ --uui-count_indicator-bg:color-mix(in srgb, var(--uui-neutral-0) 8%, transparent);
475
+ --uui-count_indicator-border:color-mix(in srgb, var(--uui-neutral-0) 40%, transparent);
476
+ --uui-count_indicator-caption:var(--uui-neutral-0);
477
+ }
478
+ .uui-theme-loveship_dark .uui-badge.uui-color-night100.uui-fill-solid{
458
479
  --uui-badge-bg:var(--uui-neutral-40);
459
480
  --uui-badge-bg-hover:var(--uui-neutral-30);
460
481
  --uui-badge-border:var(--uui-neutral-40);
@@ -462,6 +483,11 @@
462
483
  --uui-badge-caption:var(--white);
463
484
  --uui-badge-caption-hover:var(--white);
464
485
  }
486
+ .uui-theme-loveship_dark .uui-badge.uui-color-night100.uui-fill-solid .uui-count_indicator{
487
+ --uui-count_indicator-bg:var(--uui-neutral-50);
488
+ --uui-count_indicator-border:var(--uui-neutral-50);
489
+ --uui-count_indicator-caption:var(--uui-neutral-10);
490
+ }
465
491
  .uui-theme-loveship_dark .uui-badge.uui-color-night100.uui-fill-outline{
466
492
  --uui-badge-bg:color-mix(in srgb, var(--white) 20%, transparent);
467
493
  --uui-badge-bg-hover:color-mix(in srgb, var(--white) 25%, transparent);
@@ -470,7 +496,7 @@
470
496
  --uui-badge-caption:var(--uui-neutral-5);
471
497
  --uui-badge-caption-hover:var(--uui-neutral-5);
472
498
  }
473
- .uui-theme-loveship_dark .uui-badge.uui-color-night600{
499
+ .uui-theme-loveship_dark .uui-badge.uui-color-night600.uui-fill-solid{
474
500
  --uui-badge-bg:var(--uui-neutral-80);
475
501
  --uui-badge-bg-hover:var(--uui-neutral-70);
476
502
  --uui-badge-border:var(--uui-neutral-80);
@@ -484,13 +510,6 @@
484
510
  --uui-badge-caption:var(--uui-neutral-5);
485
511
  --uui-badge-caption-hover:var(--uui-neutral-5);
486
512
  }
487
- .uui-theme-loveship_dark .uui-badge.uui-color-info.uui-fill-outline{
488
- --uui-badge-bg:var(--blue-5);
489
- --uui-badge-bg-hover:var(--blue-10);
490
- --uui-badge-border:var(--blue-20);
491
- --uui-badge-caption:var(--blue-70);
492
- --uui-badge-caption-hover:var(--blue-70);
493
- }
494
513
  .uui-theme-loveship_dark .uui-icon_button:is(.uui-color-info, .uui-color-success, .uui-color-warning, .uui-color-error){
495
514
  --uui-icon_btn:var(--uui-color-60);
496
515
  --uui-icon_btn-hover:var(--uui-color-70);
@@ -553,19 +572,20 @@
553
572
  --uui-burger_search-placeholder:var(--uui-text-tertiary);
554
573
  }
555
574
  .uui-theme-loveship_dark .uui-tooltip-container.uui-color-neutral{
556
- --uui-tooltip-bg:var(--uui-surface-main);
557
575
  --uui-tooltip-border:var(--uui-neutral-50);
558
- --uui-color-contrast:var(--uui-text-primary);
576
+ }
577
+ .uui-theme-loveship_dark .uui-tooltip-container.uui-color-critical{
578
+ --uui-tooltip-border:var(--uui-critical-50);
559
579
  }
560
580
  .uui-theme-loveship_dark .uui-tooltip-container.uui-color-inverted{
561
581
  --uui-tooltip-bg:var(--uui-neutral-10);
562
582
  --uui-tooltip-text:var(--uui-neutral-70);
563
583
  }
564
- .uui-theme-loveship_dark .uui-count_indicator:is(.uui-color-neutral, .uui-color-info, .uui-color-blue, .uui-color-grass, .uui-color-success, .uui-color-critical, .uui-color-red, .uui-color-warning, .uui-color-amber){
584
+ .uui-theme-loveship_dark .uui-count_indicator:is(.uui-color-neutral, .uui-color-gray, .uui-color-info, .uui-color-sky, .uui-color-grass, .uui-color-success, .uui-color-critical, .uui-color-fire, .uui-color-warning, .uui-color-sun){
565
585
  --uui-count_indicator-bg:var(--uui-color-60);
566
586
  --uui-count_indicator-border:var(--uui-color-60);
567
587
  }
568
- .uui-theme-loveship_dark .uui-count_indicator.uui-color-neutral{
588
+ .uui-theme-loveship_dark .uui-count_indicator.uui-color-neutral, .uui-theme-loveship_dark .uui-count_indicator.uui-color-gray{
569
589
  --uui-count_indicator-caption:var(--uui-neutral-10);
570
590
  }
571
591
  .uui-theme-loveship_dark .uui-status_indicator.uui-color-white.uui-fill-outline .uui-status_indicator_dot{