@epam/assets 5.7.1 → 5.8.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 (63) hide show
  1. package/css/theme/theme_electric.css +51 -20
  2. package/css/theme/theme_electric.css.map +1 -1
  3. package/css/theme/theme_loveship.css +48 -81
  4. package/css/theme/theme_loveship.css.map +1 -1
  5. package/css/theme/theme_loveship_dark.css +131 -104
  6. package/css/theme/theme_loveship_dark.css.map +1 -1
  7. package/css/theme/theme_promo.css +52 -45
  8. package/css/theme/theme_promo.css.map +1 -1
  9. package/css/theme/theme_vanilla_thunder.css.map +1 -1
  10. package/icons/common/radio-point-10.svg +13 -13
  11. package/icons/legacy/btn_cross.svg +22 -22
  12. package/icons/legacy/btn_tick.svg +22 -22
  13. package/icons/legacy/calendar-30.svg +12 -12
  14. package/icons/legacy/calendar-36.svg +14 -14
  15. package/icons/legacy/excel.svg +12 -12
  16. package/icons/legacy/filter-24.svg +11 -11
  17. package/icons/legacy/filter.svg +12 -12
  18. package/icons/legacy/folding-arrow.svg +14 -14
  19. package/icons/legacy/gear.svg +14 -14
  20. package/icons/legacy/help-24.svg +11 -11
  21. package/icons/legacy/help.svg +21 -21
  22. package/icons/legacy/label_info.svg +14 -14
  23. package/icons/legacy/lens.svg +17 -17
  24. package/icons/legacy/modal-close-cross.svg +22 -22
  25. package/icons/legacy/more.svg +20 -20
  26. package/icons/legacy/pencil.svg +12 -12
  27. package/icons/legacy/plus.svg +12 -12
  28. package/icons/legacy/sliders.svg +12 -12
  29. package/icons/legacy/sort-24.svg +15 -15
  30. package/icons/legacy/sort-desc-24.svg +15 -15
  31. package/icons/legacy/sort.svg +4 -4
  32. package/icons/legacy/trash.svg +12 -12
  33. package/icons/loaders/circle_loader_30.svg +69 -69
  34. package/icons/loaders/dots_loader_30.svg +39 -39
  35. package/icons/templates/generic-24.svg +40 -40
  36. package/icons/templates/generic-30.svg +43 -43
  37. package/icons/templates/generic.svg +40 -40
  38. package/icons/templates/tall.svg +69 -69
  39. package/package.json +3 -3
  40. package/readme.md +6 -6
  41. package/scss/electric/font-faces.scss +138 -138
  42. package/scss/font-faces.scss +3 -3
  43. package/scss/fonts.scss +2 -2
  44. package/scss/index.scss +4 -4
  45. package/scss/loveship/colors.scss +100 -100
  46. package/scss/loveship/font-faces.scss +186 -186
  47. package/scss/loveship/fonts.scss +23 -23
  48. package/scss/loveship/typography.scss +160 -160
  49. package/scss/loveship-colors.scss +2 -2
  50. package/scss/promo/colors.scss +100 -100
  51. package/scss/promo/font-faces.scss +168 -168
  52. package/scss/promo/fonts.scss +17 -17
  53. package/scss/promo/typography.scss +175 -175
  54. package/scss/typography.scss +2 -2
  55. package/theme/theme_electric.scss +576 -539
  56. package/theme/theme_loveship.scss +607 -644
  57. package/theme/theme_loveship_dark.scss +853 -817
  58. package/theme/theme_promo.scss +653 -636
  59. package/theme/theme_vanilla_thunder.scss +480 -480
  60. package/theme/tokens/_theme_electric.scss +265 -265
  61. package/theme/tokens/_theme_loveship_dark.scss +263 -263
  62. package/theme/tokens/{_theme_loveship.scss → _theme_loveship_light.scss} +263 -263
  63. package/theme/tokens/_theme_promo.scss +263 -263
package/css/theme/theme_loveship.css CHANGED
@@ -300,18 +300,10 @@
300
300
  --uui-text-warning:var(--uui-warning-70);
301
301
  --uui-font:"Source Sans Pro", sans-serif;
302
302
  --uui-font-mono:"Roboto Mono", monospace;
303
- --uui-color-night50-800:#DADAE9;
304
- --uui-color-night50-900:#BABAD6;
305
303
  --uui-color-night100-800:#D3D7E9;
306
304
  --uui-color-night100-900:#B1B9D8;
307
- --uui-color-night200-800:#C9CEE4;
308
- --uui-color-night200-900:#A7B0D3;
309
- --uui-color-night400-800:#B1B4C5;
310
- --uui-color-night400-900:#9398B0;
311
305
  --uui-color-night700-800:#30323D;
312
306
  --uui-color-night700-900:#1A1B20;
313
- --uui-color-night800-800:#1A1B23;
314
- --uui-color-night800-900:#040406;
315
307
  --uui-primary-contrast:var(--white);
316
308
  --uui-accent-contrast:var(--white);
317
309
  --uui-secondary-contrast:var(--white);
@@ -359,22 +351,13 @@
359
351
  --uui-color-contrast:var(--uui-critical-contrast);
360
352
  }
361
353
  .uui-theme-loveship .uui-color-white{
362
- --uui-color-5:var(--white);
363
- --uui-color-10:var(--white);
364
- --uui-color-20:var(--white);
365
- --uui-color-50:var(--white);
366
- --uui-color-60:var(--night100);
367
- --uui-color-70:var(--night200);
368
- --uui-color-contrast:var(--uui-neutral-80);
369
- }
370
- .uui-theme-loveship .uui-color-night50{
371
- --uui-color-5:var(--white);
372
- --uui-color-10:var(--white);
373
- --uui-color-20:var(--white);
374
- --uui-color-50:var(--night50);
375
- --uui-color-60:var(--uui-color-night50-800);
376
- --uui-color-70:var(--uui-color-night50-900);
377
- --uui-color-contrast:var(--uui-neutral-80);
354
+ --uui-color-5:color-mix(in srgb, #FFFFFF 15%, transparent);
355
+ --uui-color-10:color-mix(in srgb, #FFFFFF 22%, transparent);
356
+ --uui-color-20:color-mix(in srgb, #FFFFFF 29%, transparent);
357
+ --uui-color-50:var(--uui-neutral-0);
358
+ --uui-color-60:var(--uui-neutral-10);
359
+ --uui-color-70:var(--uui-neutral-20);
360
+ --uui-color-contrast:var(--uui-neutral-70);
378
361
  }
379
362
  .uui-theme-loveship .uui-color-night100{
380
363
  --uui-color-5:var(--white);
@@ -383,16 +366,7 @@
383
366
  --uui-color-50:var(--night100);
384
367
  --uui-color-60:var(--uui-color-night100-800);
385
368
  --uui-color-70:var(--uui-color-night100-900);
386
- --uui-color-contrast:var(--uui-neutral-80);
387
- }
388
- .uui-theme-loveship .uui-color-night200{
389
- --uui-color-5:var(--white);
390
- --uui-color-10:var(--night50);
391
- --uui-color-20:var(--night100);
392
- --uui-color-50:var(--night200);
393
- --uui-color-60:var(--uui-color-night200-800);
394
- --uui-color-70:var(--uui-color-night200-900);
395
- --uui-color-contrast:var(--uui-neutral-80);
369
+ --uui-color-contrast:var(--uui-neutral-70);
396
370
  }
397
371
  .uui-theme-loveship .uui-color-night300{
398
372
  --uui-color-5:var(--night50);
@@ -403,15 +377,6 @@
403
377
  --uui-color-70:var(--night500);
404
378
  --uui-color-contrast:var(--uui-neutral-80);
405
379
  }
406
- .uui-theme-loveship .uui-color-night400{
407
- --uui-color-5:var(--night100);
408
- --uui-color-10:var(--night200);
409
- --uui-color-20:var(--night300);
410
- --uui-color-50:var(--night400);
411
- --uui-color-60:var(--uui-color-night400-800);
412
- --uui-color-70:var(--uui-color-night400-900);
413
- --uui-color-contrast:var(--uui-neutral-80);
414
- }
415
380
  .uui-theme-loveship .uui-color-night500{
416
381
  --uui-color-5:var(--night200);
417
382
  --uui-color-10:var(--night300);
@@ -442,15 +407,6 @@
442
407
  --uui-color-70:var(--uui-color-night700-900);
443
408
  --uui-color-contrast:var(--white);
444
409
  }
445
- .uui-theme-loveship .uui-color-night800{
446
- --uui-color-5:var(--night500);
447
- --uui-color-10:var(--night600);
448
- --uui-color-20:var(--night700);
449
- --uui-color-50:var(--night800);
450
- --uui-color-60:var(--uui-color-night800-800);
451
- --uui-color-70:var(--uui-color-night800-900);
452
- --uui-color-contrast:var(--white);
453
- }
454
410
  .uui-theme-loveship .uui-color-warning,
455
411
  .uui-theme-loveship .uui-color-sun{
456
412
  --uui-color-5:var(--uui-warning-5);
@@ -539,12 +495,16 @@
539
495
  .uui-theme-loveship .uui-file_card{
540
496
  --uui-file_card-border-radius:6px;
541
497
  }
498
+ .uui-theme-loveship .uui-badge.uui-color-white.uui-fill-solid{
499
+ --uui-badge-border-hover:var(--uui-neutral-30);
500
+ }
542
501
  .uui-theme-loveship .uui-badge.uui-color-white.uui-fill-outline{
543
- --uui-badge-bg-hover:var(--uui-neutral-10);
502
+ --uui-badge-bg:var(--uui-neutral-0);
503
+ --uui-badge-bg-hover:var(--uui-neutral-30);
544
504
  --uui-badge-border:var(--uui-neutral-30);
545
505
  --uui-badge-border-hover:var(--uui-neutral-30);
546
- --uui-badge-caption:var(--uui-neutral-80);
547
- --uui-badge-caption-hover:var(--uui-neutral-80);
506
+ --uui-badge-caption:var(--uui-neutral-70);
507
+ --uui-badge-caption-hover:var(--uui-neutral-70);
548
508
  }
549
509
  .uui-theme-loveship .uui-badge.uui-color-neutral.uui-fill-solid,
550
510
  .uui-theme-loveship .uui-badge.uui-color-night300.uui-fill-solid{
@@ -554,6 +514,11 @@
554
514
  --uui-badge-border-hover:var(--uui-neutral-40);
555
515
  --uui-color-contrast:var(--uui-neutral-80);
556
516
  }
517
+ .uui-theme-loveship .uui-badge.uui-color-neutral.uui-fill-solid .uui-count_indicator,
518
+ .uui-theme-loveship .uui-badge.uui-color-night300.uui-fill-solid .uui-count_indicator{
519
+ --uui-count_indicator-bg:var(--uui-neutral-0);
520
+ --uui-count_indicator-border:var(--uui-neutral-0);
521
+ }
557
522
  .uui-theme-loveship .uui-badge.uui-color-neutral.uui-fill-outline,
558
523
  .uui-theme-loveship .uui-badge.uui-color-night300.uui-fill-outline{
559
524
  --uui-badge-bg:var(--uui-neutral-20);
@@ -571,10 +536,15 @@
571
536
  --uui-badge-bg-hover:var(--uui-neutral-20);
572
537
  --uui-badge-border:var(--uui-neutral-30);
573
538
  --uui-badge-border-hover:var(--uui-neutral-30);
574
- --uui-badge-caption:var(--uui-neutral-80);
575
- --uui-badge-caption-hover:var(--uui-neutral-80);
539
+ --uui-badge-caption:var(--uui-neutral-70);
540
+ --uui-badge-caption-hover:var(--uui-neutral-70);
541
+ }
542
+ .uui-theme-loveship .uui-badge.uui-color-night100.uui-fill-outline .uui-count_indicator{
543
+ --uui-count_indicator-bg:color-mix(in srgb, var(--uui-badge-caption) 8%, transparent);
544
+ --uui-count_indicator-border:color-mix(in srgb, var(--uui-badge-caption) 40%, transparent);
576
545
  }
577
546
  .uui-theme-loveship .uui-badge.uui-color-night600.uui-fill-outline{
547
+ --uui-badge-bg:var(--uui-neutral-20);
578
548
  --uui-badge-border:var(--uui-neutral-60);
579
549
  --uui-badge-border-hover:var(--uui-neutral-60);
580
550
  --uui-badge-caption:var(--uui-neutral-80);
@@ -586,22 +556,6 @@
586
556
  .uui-theme-loveship .uui-button:is(.uui-color-secondary, .uui-color-neutral, .uui-color-gray, .uui-color-night600):is(.uui-fill-outline, .uui-fill-none, .uui-fill-ghost){
587
557
  --uui-btn-caption:var(--uui-neutral-70);
588
558
  }
589
- .uui-theme-loveship .uui-button.uui-color-white.uui-fill-none, .uui-theme-loveship .uui-button.uui-color-white.uui-fill-ghost{
590
- --uui-btn-bg-hover:color-mix(in srgb, var(--uui-neutral-0) 20%, transparent);
591
- --uui-btn-bg-active:color-mix(in srgb, var(--uui-neutral-0) 30%, transparent);
592
- }
593
- .uui-theme-loveship .uui-button.uui-color-white.uui-fill-ghost{
594
- --uui-btn-border:transparent;
595
- --uui-btn-border-hover:transparent;
596
- --uui-btn-border-active:transparent;
597
- }
598
- .uui-theme-loveship .uui-button.uui-color-white.uui-fill-outline, .uui-theme-loveship .uui-button.uui-color-white.uui-fill-solid{
599
- --uui-btn-caption:var(--uui-neutral-70);
600
- --uui-btn-bg-hover:var(--uui-neutral-20);
601
- --uui-btn-border-hover:var(--uui-neutral-20);
602
- --uui-btn-bg-active:var(--uui-neutral-30);
603
- --uui-btn-border-active:var(--uui-neutral-30);
604
- }
605
559
  .uui-theme-loveship .uui-icon_button.uui-color-secondary{
606
560
  --uui-icon_btn:var(--uui-neutral-50);
607
561
  --uui-icon_btn-hover:var(--uui-neutral-60);
@@ -616,6 +570,12 @@
616
570
  --uui-link_btn-text-hover:var(--uui-neutral-10);
617
571
  --uui-link_btn-text-active:var(--uui-neutral-20);
618
572
  }
573
+ .uui-theme-loveship .uui-link_button.uui-color-white{
574
+ --uui-link_btn-text:var(--uui-neutral-5);
575
+ --uui-link_btn-text-hover:var(--uui-neutral-30);
576
+ --uui-link_btn-text-active:var(--uui-neutral-40);
577
+ --uui-link_btn-text-disabled:color-mix(in srgb, var(--white) 40%, transparent);
578
+ }
619
579
  .uui-theme-loveship .uui-tooltip-container.uui-color-white{
620
580
  --uui-tooltip-bg:var(--uui-neutral-0);
621
581
  --uui-tooltip-text:var(--uui-neutral-80);
@@ -657,19 +617,27 @@
657
617
  .uui-theme-loveship .uui-panel.uui-color-night50{
658
618
  --uui-panel-bg:var(--night50);
659
619
  }
620
+ .uui-theme-loveship .uui-text.uui-color-night50{
621
+ --uui-text:var(--night50);
622
+ }
623
+ .uui-theme-loveship .uui-text.uui-color-night400{
624
+ --uui-text:var(--night400);
625
+ }
626
+ .uui-theme-loveship .uui-text.uui-color-night800{
627
+ --uui-text:var(--night800);
628
+ }
660
629
  .uui-theme-loveship .uui-tag.uui-color-white.uui-fill-solid{
661
630
  --uui-tag-bg-hover:var(--uui-neutral-10);
662
631
  --uui-tag-border-hover:var(--uui-neutral-10);
663
- --uui-tag-fill:var(--uui-neutral-60);
664
632
  }
665
633
  .uui-theme-loveship .uui-tag.uui-color-white.uui-fill-solid .uui-count_indicator{
666
634
  --uui-count_indicator-bg:var(--uui-neutral-30);
667
635
  --uui-count_indicator-border:var(--uui-neutral-30);
668
- --uui-count_indicator-caption:var(--uui-neutral-70);
669
636
  }
670
637
  .uui-theme-loveship .uui-tag.uui-color-white.uui-fill-outline{
671
- --uui-tag-bg-hover:var(--uui-neutral-10);
638
+ --uui-tag-bg:var(--uui-neutral-0);
672
639
  --uui-tag-border:var(--uui-neutral-30);
640
+ --uui-tag-bg-hover:var(--uui-neutral-10);
673
641
  --uui-tag-border-hover:var(--uui-neutral-30);
674
642
  }
675
643
  .uui-theme-loveship .uui-tag.uui-color-white.uui-fill-outline .uui-count_indicator{
@@ -677,13 +645,12 @@
677
645
  --uui-count_indicator-border:var(--uui-neutral-30);
678
646
  }
679
647
  .uui-theme-loveship .uui-tag.uui-color-night100.uui-fill-solid{
648
+ --uui-tag-bg-hover:var(--uui-neutral-20);
680
649
  --uui-tag-border-hover:var(--uui-neutral-20);
681
- --uui-tag-fill:var(--uui-neutral-60);
682
650
  }
683
651
  .uui-theme-loveship .uui-tag.uui-color-night100.uui-fill-solid .uui-count_indicator{
684
652
  --uui-count_indicator-bg:var(--uui-neutral-30);
685
653
  --uui-count_indicator-border:var(--uui-neutral-30);
686
- --uui-count_indicator-caption:var(--uui-neutral-70);
687
654
  }
688
655
  .uui-theme-loveship .uui-tag.uui-color-night100.uui-fill-outline{
689
656
  --uui-tag-bg:var(--uui-neutral-5);
@@ -700,12 +667,13 @@
700
667
  --uui-tag-bg-hover:var(--uui-neutral-40);
701
668
  --uui-tag-border:var(--uui-neutral-30);
702
669
  --uui-tag-border-hover:var(--uui-neutral-40);
703
- --uui-tag-caption:var(--uui-text-primary);
704
- --uui-tag-fill:var(--uui-neutral-60);
670
+ --uui-tag-caption:var(--uui-neutral-70);
671
+ --uui-tag-fill:var(--uui-neutral-70);
705
672
  }
706
673
  .uui-theme-loveship .uui-tag.uui-color-neutral.uui-fill-solid .uui-count_indicator, .uui-theme-loveship .uui-tag.uui-color-night300.uui-fill-solid .uui-count_indicator{
707
674
  --uui-count_indicator-bg:var(--uui-neutral-0);
708
675
  --uui-count_indicator-border:var(--uui-neutral-0);
676
+ --uui-count_indicator-caption:var(--uui-neutral-70);
709
677
  }
710
678
  .uui-theme-loveship .uui-tag.uui-color-neutral.uui-fill-outline, .uui-theme-loveship .uui-tag.uui-color-night300.uui-fill-outline{
711
679
  --uui-tag-bg:var(--uui-neutral-20);
@@ -728,7 +696,6 @@
728
696
  .uui-theme-loveship .uui-tag.uui-color-night700.uui-fill-solid .uui-count_indicator{
729
697
  --uui-count_indicator-border:color-mix(in srgb, var(--uui-neutral-0) 50%, transparent);
730
698
  --uui-count_indicator-bg:color-mix(in srgb, var(--uui-neutral-0) 10%, transparent);
731
- --uui-count_indicator-caption:var(--uui-neutral-0);
732
699
  }
733
700
  .uui-theme-loveship .uui-tag.uui-color-night700.uui-fill-outline{
734
701
  --uui-tag-bg:var(--uui-neutral-20);