@sankhyalabs/ez-design 5.10.0-dev.5 → 5.10.0-dev.7

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.
@@ -1415,6 +1415,8 @@ body {
1415
1415
  .ez-box__container--size-auto {
1416
1416
  width: auto;
1417
1417
  height: auto; }
1418
+ .ez-box__container--nowrap {
1419
+ flex-wrap: nowrap; }
1418
1420
  .ez-box__footer {
1419
1421
  display: flex;
1420
1422
  flex-wrap: wrap;
@@ -1496,39 +1498,64 @@ body {
1496
1498
  .ez-breadcrumb__arrow {
1497
1499
  display: none; } }
1498
1500
 
1499
- .ez-button--secondary {
1500
- --ez-button--background-color: var(--background--medium);
1501
- --ez-button--hover--background-color: var(--background--medium);
1502
- --ez-button--hover-color: var(--color--primary-600);
1503
- --ez-button--color: var(--title--primary);
1504
- --ez-button--disabled--background-color: var(--color--disable-secondary);
1505
- --ez-button--active--background-color: var(--background--strong);
1506
- --ez-button--disabled--background-color: var(--background--medium);
1507
- --ez-button--active-color: var(--color--primary-700); }
1508
-
1509
1501
  .ez-button--primary {
1510
- --ez-button--font-weight: var(--text-weight--medium);
1502
+ /* default */
1503
+ --ez-button--color: var(--text--inverted);
1511
1504
  --ez-button--background-color: var(--color--primary);
1512
- --ez-button--hover--background-color: var(--color--primary-600);
1505
+ --ez-button--font-weight: var(--text-weight--medium);
1506
+ /* hover */
1513
1507
  --ez-button--hover-color: var(--text--inverted);
1514
- --ez-button--color: var(--text--inverted);
1508
+ --ez-button--hover--background-color: var(--color--primary-600);
1509
+ /* active */
1510
+ --ez-button--active-color: var(--text--inverted);
1515
1511
  --ez-button--active--background-color: var(--color--primary-700);
1512
+ /* disabled */
1513
+ --ez-button--disabled-color: var(--text--primary);
1514
+ --ez-button--disabled--background-color: var(--background--medium);
1515
+ --ez-button--disabled--border: 1px solid var(--color--strokes);
1516
+ --ez-button--disabled--border-radius: 24px;
1517
+ /* focus */
1518
+ --ez-button--focus--box-shadow: none;
1519
+ --ez-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
1520
+
1521
+ .ez-button--secondary {
1522
+ /* default */
1523
+ --ez-button--color: var(--title--primary);
1524
+ --ez-button--background-color: var(--background--light);
1525
+ /* hover */
1526
+ --ez-button--hover-color: var(--color--primary-600);
1527
+ --ez-button--hover--background-color: var(--background--light);
1528
+ /* active */
1529
+ --ez-button--active-color: var(--color--primary-700);
1530
+ --ez-button--active--background-color: var(--background--light);
1531
+ /* disabled */
1532
+ --ez-button--disabled-color: var(--text--primary);
1516
1533
  --ez-button--disabled--background-color: var(--background--medium);
1517
- --ez-button--active-color: var(--text--inverted); }
1534
+ --ez-button--disabled--border: 1px solid var(--color--strokes);
1535
+ --ez-button--disabled--border-radius: 24px;
1536
+ /* focus */
1537
+ --ez-button--focus--box-shadow: none;
1538
+ --ez-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
1518
1539
 
1519
1540
  .ez-button--tertiary {
1541
+ /* default */
1542
+ --ez-button--color: var(--title--primary);
1543
+ --ez-button--background-color: none;
1520
1544
  --ez-button--font-weight: var(--text-weight--medium);
1521
1545
  --ez-button--border: none;
1522
- --ez-button--background-color: none;
1546
+ /* hover */
1523
1547
  --ez-button--hover-color: var(--color--primary-600);
1524
- --ez-button--color: var(--title--primary);
1525
1548
  --ez-button--hover--background-color: none;
1549
+ /* active */
1550
+ --ez-button--active-color: var(--title--primary);
1526
1551
  --ez-button--active--background-color: var(--color--disable-secondary);
1527
- --ez-button--focus--border: var(--border--xlarge, 4px solid) var(--color--primary-300);
1552
+ /* disabled */
1553
+ --ez-button--disabled-color: var(--text--primary);
1554
+ --ez-button--disabled--background-color: var(--background--medium);
1555
+ --ez-button--disabled--border: none;
1556
+ /* focus */
1528
1557
  --ez-button--focus--box-shadow: none;
1529
- --ez-button--disabled--background-color: none;
1530
- --ez-button--disabled-color: var(--text--disable);
1531
- --ez-button--active-color: var(--title--primary); }
1558
+ --ez-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
1532
1559
 
1533
1560
  .ez-button--link--primary {
1534
1561
  color: #008561;
@@ -1944,6 +1971,8 @@ body {
1944
1971
  .ez-icon--logo {
1945
1972
  width: 49px;
1946
1973
  height: 53px; } }
1974
+ .ez-icon-cursor--pointer {
1975
+ cursor: pointer; }
1947
1976
 
1948
1977
  .ez-identifier {
1949
1978
  display: flex;
@@ -2595,39 +2624,63 @@ body {
2595
2624
  height: 576px; }
2596
2625
 
2597
2626
  .ez-split-button--primary {
2627
+ /* default */
2628
+ --ez-split-button--color: var(--text--inverted);
2598
2629
  --ez-split-button--background-color: var(--color--primary);
2599
2630
  --ez-split-button--font-weight: var(--text-weight--medium);
2600
- --ez-split-button--hover--background-color: var(--color--primary-600);
2631
+ --ez-split-button--border: none;
2632
+ /* hover */
2601
2633
  --ez-split-button--hover-color: var(--text--inverted);
2602
- --ez-split-button--color: var(--text--inverted);
2603
- --ez-split-button--active--background-color: var(--color--primary-700);
2634
+ --ez-split-button--hover--background-color: var(--color--primary-600);
2635
+ /* active */
2604
2636
  --ez-split-button--active-color: var(--text--inverted);
2605
- --ez-split-button--disabled-color: var(--text--disable);
2606
- --ez-split-button--disabled--background-color: var(--color--disable-primary); }
2637
+ --ez-split-button--active--background-color: var(--color--primary-700);
2638
+ /* disabled */
2639
+ --ez-split-button--disabled-color: var(--text--primary);
2640
+ --ez-split-button--disabled--background-color: var(--background--medium);
2641
+ --ez-split-button--disabled--border: 1px solid var(--color--strokes);
2642
+ --ez-split-button--disabled--border-radius: 24px;
2643
+ /* focus */
2644
+ --ez-split-button--focus--box-shadow: none;
2645
+ --ez-split-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
2607
2646
 
2608
2647
  .ez-split-button--secondary {
2609
- --ez-split-button--background-color:var(--background--medium);
2610
- --ez-split-button--hover--background-color: var(--background--medium);
2611
- --ez-split-button--hover-color: var(--color--primary-600);
2648
+ /* default */
2612
2649
  --ez-split-button--color: var(--title--primary);
2613
- --ez-split-button--active--background-color: var(--background--medium);
2650
+ --ez-split-button--background-color: var(--background--light);
2651
+ /* hover */
2652
+ --ez-split-button--hover-color: var(--color--primary-600);
2653
+ --ez-split-button--hover--background-color: var(--background--light);
2654
+ /* active */
2614
2655
  --ez-split-button--active-color: var(--color--primary-700);
2615
- --ez-split-button--disabled-color: var(--text--disable);
2616
- --ez-split-button--disabled--background-color: var(--color--disable-secondary); }
2656
+ --ez-split-button--active--background-color: var(--background--light);
2657
+ /* disabled */
2658
+ --ez-split-button--disabled-color: var(--text--primary);
2659
+ --ez-split-button--disabled--background-color: var(--background--medium);
2660
+ --ez-split-button--disabled--border: 1px solid var(--color--strokes);
2661
+ --ez-split-button--disabled--border-radius: 24px;
2662
+ /* focus */
2663
+ --ez-split-button--focus--box-shadow: none;
2664
+ --ez-split-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
2617
2665
 
2618
2666
  .ez-split-button--tertiary {
2667
+ --ez-split-button--color: var(--title--primary);
2619
2668
  --ez-split-button--background-color: none;
2620
2669
  --ez-split-button--font-weight: var(--text-weight--medium);
2621
- --ez-split-button--hover--background-color: none;
2670
+ --ez-split-button--border: none;
2671
+ /* hover */
2622
2672
  --ez-split-button--hover-color: var(--color--primary-600);
2623
- --ez-split-button--color: var(--title--primary);
2624
- --ez-split-button--active--background-color: var(--color--disable-secondary);
2673
+ --ez-split-button--hover--background-color: none;
2674
+ /* active */
2625
2675
  --ez-split-button--active-color: var(--title--primary);
2626
- --ez-split-button--disabled-color: var(--text--disable);
2627
- --ez-split-button--disabled--background-color: none;
2628
- --ez-split-button--focus--border: var(--border--xlarge, 4px solid) var(--color--primary-300);
2676
+ --ez-split-button--active--background-color: var(--color--disable-secondary);
2677
+ /* disabled */
2678
+ --ez-split-button--disabled-color: var(--text--primary);
2679
+ --ez-split-button--disabled--background-color: var(--background--medium);
2680
+ --ez-split-button--disabled--border: none;
2681
+ /* focus */
2629
2682
  --ez-split-button--focus--box-shadow: none;
2630
- --ez-split-button--border: none; }
2683
+ --ez-split-button--focus--border: var(--border--medium, 2px solid) var(--color--primary-300); }
2631
2684
 
2632
2685
  .ez-skeleton {
2633
2686
  background: linear-gradient(to right, #f1f5f8 0%, #fafafa 97%, #f0f0f0 100%);