@seed-design/css 1.1.24 → 1.1.25

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.
package/all.css CHANGED
@@ -1357,8 +1357,7 @@
1357
1357
  top: 0;
1358
1358
  }
1359
1359
 
1360
- .seed-app-bar__root:before {
1361
- content: "";
1360
+ .seed-app-bar__background {
1362
1361
  pointer-events: none;
1363
1362
  z-index: -1;
1364
1363
  position: absolute;
@@ -1447,180 +1446,8 @@
1447
1446
  padding-right: 16px;
1448
1447
  }
1449
1448
 
1450
- [data-global-transition-state="enter-active"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:before {
1451
- --seed-enter-translate-x: 100%;
1452
- --seed-enter-translate-y: 0;
1453
- --seed-enter-opacity: 1;
1454
- --seed-enter-scale: 1;
1455
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1456
- transform: translate3d(0, 0, 0);
1457
- }
1458
-
1459
- [data-global-transition-state="exit-active"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:before {
1460
- transform: translate3d(var(--swipe-back-displacement, 0), 0, 0);
1461
- --seed-exit-translate-x: 100%;
1462
- --seed-exit-translate-y: 0;
1463
- --seed-exit-opacity: 1;
1464
- --seed-exit-scale: 1;
1465
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1466
- }
1467
-
1468
- [data-global-transition-state="enter-done"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:before {
1469
- --seed-enter-translate-x: var(--swipe-back-displacement, 0);
1470
- --seed-enter-translate-y: 0;
1471
- --seed-enter-opacity: 1;
1472
- --seed-enter-scale: 1;
1473
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1474
- transform: translate3d(0, 0, 0);
1475
- }
1476
-
1477
- [data-swipe-back-state="swiping"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#):before {
1478
- transform: translate3d(var(--swipe-back-displacement, 0), 0, 0);
1479
- animation: none;
1480
- }
1481
-
1482
- [data-swipe-back-state="canceling"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#):before {
1483
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1484
- transform: translate3d(0, 0, 0);
1485
- animation: none !important;
1486
- }
1487
-
1488
- [data-swipe-back-state="completing"] .seed-app-bar__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#):before {
1489
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1490
- transform: translate3d(100%, 0, 0);
1491
- animation: none !important;
1492
- }
1493
-
1494
- [data-global-transition-state="enter-active"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1495
- --seed-enter-translate-x: 0;
1496
- --seed-enter-translate-y: 0;
1497
- --seed-enter-opacity: 0;
1498
- --seed-enter-scale: 1;
1499
- opacity: 1;
1500
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1501
- }
1502
-
1503
- [data-global-transition-state="exit-active"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1504
- transform: translate3d(calc(var(--swipe-back-displacement, 0) * .15), 0, 0);
1505
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1506
- --seed-exit-translate-x: 0;
1507
- --seed-exit-translate-y: 0;
1508
- --seed-exit-opacity: 0;
1509
- --seed-exit-scale: 1;
1510
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1511
- }
1512
-
1513
- [data-global-transition-state="enter-done"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1514
- --seed-enter-translate-x: calc(var(--swipe-back-displacement, 0) * .15);
1515
- --seed-enter-translate-y: 0;
1516
- --seed-enter-opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1517
- --seed-enter-scale: 1;
1518
- opacity: 1;
1519
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1520
- }
1521
-
1522
- [data-swipe-back-state="swiping"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1523
- transform: translate3d(calc(var(--swipe-back-displacement, 0) * .15), 0, 0);
1524
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1525
- animation: none;
1526
- }
1527
-
1528
- [data-swipe-back-state="canceling"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1529
- opacity: 1;
1530
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1531
- animation: none !important;
1532
- }
1533
-
1534
- [data-swipe-back-state="completing"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1535
- opacity: 0;
1536
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1537
- animation: none !important;
1538
- }
1539
-
1540
- [data-global-transition-state="enter-active"][data-top-activity-type="full-screen"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1541
- opacity: 1;
1542
- --seed-exit-translate-x: 0;
1543
- --seed-exit-translate-y: 0;
1544
- --seed-exit-opacity: 0;
1545
- --seed-exit-scale: 1;
1546
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1547
- }
1548
-
1549
- [data-global-transition-state="exit-active"][data-top-activity-type="full-screen"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1550
- --seed-enter-translate-x: 0;
1551
- --seed-enter-translate-y: 0;
1552
- --seed-enter-opacity: calc(var(--swipe-back-displacement-ratio, 0));
1553
- --seed-enter-scale: 1;
1554
- opacity: 1;
1555
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1556
- }
1557
-
1558
- [data-global-transition-state="enter-done"][data-top-activity-type="full-screen"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1559
- opacity: calc(var(--swipe-back-displacement-ratio, 0));
1560
- --seed-exit-translate-x: 0;
1561
- --seed-exit-translate-y: 0;
1562
- --seed-exit-opacity: 0;
1563
- --seed-exit-scale: 1;
1564
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1565
- }
1566
-
1567
- [data-swipe-back-state="swiping"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1568
- opacity: calc(var(--swipe-back-displacement-ratio, 0));
1569
- animation: none;
1570
- }
1571
-
1572
- [data-swipe-back-state="canceling"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1573
- opacity: 0;
1574
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1575
- animation: none !important;
1576
- }
1577
-
1578
- [data-swipe-back-state="completing"] .seed-app-bar__icon--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1579
- opacity: 1;
1580
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1581
- animation: none !important;
1582
- }
1583
-
1584
- [data-global-transition-state="enter-active"] .seed-app-bar__root--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
1585
- --seed-enter-translate-x: 0;
1586
- --seed-enter-translate-y: 8vh;
1587
- --seed-enter-opacity: 0;
1588
- --seed-enter-scale: 1;
1589
- opacity: 1;
1590
- animation: .3s cubic-bezier(.23, .1, .32, 1) seed-enter;
1591
- transform: translate3d(0, 0, 0);
1592
- }
1593
-
1594
- [data-global-transition-state="exit-active"] .seed-app-bar__root--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
1595
- opacity: 1;
1596
- --seed-exit-translate-x: 0;
1597
- --seed-exit-translate-y: 8vh;
1598
- --seed-exit-opacity: 0;
1599
- --seed-exit-scale: 1;
1600
- animation: .15s linear forwards seed-exit;
1601
- transform: translate3d(0, 0, 0);
1602
- }
1603
-
1604
- [data-global-transition-state="enter-active"] .seed-app-bar__root--transitionStyle_fadeIn[data-activity-is-top] {
1605
- --seed-enter-translate-x: 0;
1606
- --seed-enter-translate-y: 0;
1607
- --seed-enter-opacity: 0;
1608
- --seed-enter-scale: 1;
1609
- opacity: 1;
1610
- animation: .3s ease-out seed-enter;
1611
- }
1612
-
1613
- [data-global-transition-state="exit-active"] .seed-app-bar__root--transitionStyle_fadeIn[data-activity-is-top] {
1614
- opacity: 1;
1615
- --seed-exit-translate-x: 0;
1616
- --seed-exit-translate-y: 0;
1617
- --seed-exit-opacity: 0;
1618
- --seed-exit-scale: 1;
1619
- animation: .15s ease-in forwards seed-exit;
1620
- }
1621
-
1622
- .seed-app-bar__root--tone_layer:before {
1623
- background-color: var(--seed-color-bg-layer-default);
1449
+ .seed-app-bar__background--tone_layer {
1450
+ background: var(--seed-box-background, var(--seed-color-bg-layer-default));
1624
1451
  }
1625
1452
 
1626
1453
  .seed-app-bar__icon--tone_layer {
@@ -1635,7 +1462,7 @@
1635
1462
  color: var(--seed-icon-color, var(--seed-color-palette-static-white));
1636
1463
  }
1637
1464
 
1638
- .seed-app-bar__root--divider_true:before {
1465
+ .seed-app-bar__background--divider_true {
1639
1466
  box-shadow: inset 0px calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-subtle);
1640
1467
  }
1641
1468
 
@@ -1691,106 +1518,6 @@
1691
1518
  display: flex;
1692
1519
  }
1693
1520
 
1694
- [data-global-transition-state="enter-active"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1695
- --seed-enter-translate-x: 25%;
1696
- --seed-enter-translate-y: 0;
1697
- --seed-enter-opacity: 0;
1698
- --seed-enter-scale: 1;
1699
- opacity: 1;
1700
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1701
- transform: translate3d(0, 0, 0);
1702
- }
1703
-
1704
- [data-global-transition-state="exit-active"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1705
- transform: translate3d(calc(var(--swipe-back-displacement, 0) * .15), 0, 0);
1706
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1707
- --seed-exit-translate-x: 25%;
1708
- --seed-exit-translate-y: 0;
1709
- --seed-exit-opacity: 0;
1710
- --seed-exit-scale: 1;
1711
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1712
- }
1713
-
1714
- [data-global-transition-state="enter-done"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1715
- --seed-enter-translate-x: calc(var(--swipe-back-displacement, 0) * .15);
1716
- --seed-enter-translate-y: 0;
1717
- --seed-enter-opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1718
- --seed-enter-scale: 1;
1719
- opacity: 1;
1720
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1721
- transform: translate3d(0, 0, 0);
1722
- }
1723
-
1724
- [data-swipe-back-state="swiping"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1725
- transform: translate3d(calc(var(--swipe-back-displacement, 0) * .15), 0, 0);
1726
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0) * 3);
1727
- animation: none;
1728
- }
1729
-
1730
- [data-swipe-back-state="canceling"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1731
- opacity: 1;
1732
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1733
- transform: translate3d(0, 0, 0);
1734
- animation: none !important;
1735
- }
1736
-
1737
- [data-swipe-back-state="completing"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1738
- opacity: 0;
1739
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1740
- transform: translate3d(25%, 0, 0);
1741
- animation: none !important;
1742
- }
1743
-
1744
- [data-global-transition-state="enter-active"][data-top-activity-type="full-screen"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1745
- opacity: 1;
1746
- --seed-exit-translate-x: -25%;
1747
- --seed-exit-translate-y: 0;
1748
- --seed-exit-opacity: 0;
1749
- --seed-exit-scale: 1;
1750
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1751
- transform: translate3d(0, 0, 0);
1752
- }
1753
-
1754
- [data-global-transition-state="exit-active"][data-top-activity-type="full-screen"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1755
- --seed-enter-translate-x: calc(-25% + var(--swipe-back-displacement, 0) * .15);
1756
- --seed-enter-translate-y: 0;
1757
- --seed-enter-opacity: calc(var(--swipe-back-displacement-ratio, 0));
1758
- --seed-enter-scale: 1;
1759
- opacity: 1;
1760
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1761
- transform: translate3d(0, 0, 0);
1762
- }
1763
-
1764
- [data-global-transition-state="enter-done"][data-top-activity-type="full-screen"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1765
- transform: translate3d(calc(-25% + var(--swipe-back-displacement, 0) * .15), 0, 0);
1766
- opacity: calc(var(--swipe-back-displacement-ratio, 0));
1767
- --seed-exit-translate-x: -25%;
1768
- --seed-exit-translate-y: 0;
1769
- --seed-exit-opacity: 0;
1770
- --seed-exit-scale: 1;
1771
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1772
- }
1773
-
1774
- [data-swipe-back-state="swiping"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1775
- transform: translate3d(calc(-25% + var(--swipe-back-displacement, 0) * .15), 0, 0);
1776
- opacity: calc(var(--swipe-back-displacement-ratio, 0));
1777
- animation: none;
1778
- }
1779
-
1780
- [data-swipe-back-state="canceling"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1781
- opacity: 0;
1782
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1783
- transform: translate3d(-25%, 0, 0);
1784
- animation: none !important;
1785
- }
1786
-
1787
- [data-swipe-back-state="completing"] .seed-app-bar-main__root--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1788
- opacity: 1;
1789
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1790
- transform: translate3d(0, 0, 0);
1791
- animation: none !important;
1792
- }
1793
-
1794
1521
  .seed-app-bar-main__root--tone_layer, .seed-app-bar-main__title--tone_layer {
1795
1522
  color: var(--seed-color-fg-neutral);
1796
1523
  }
@@ -1874,143 +1601,11 @@
1874
1601
  transform: translate3d(0, 0, 0);
1875
1602
  }
1876
1603
 
1877
- [data-global-transition-state="enter-active"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1878
- --seed-enter-translate-x: 100%;
1879
- --seed-enter-translate-y: 0;
1880
- --seed-enter-opacity: 1;
1881
- --seed-enter-scale: 1;
1882
- transform: translate3d(var(--swipe-back-target, var(--swipe-back-displacement, 0)), 0, 0);
1883
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1884
- }
1885
-
1886
- [data-global-transition-state="exit-active"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1887
- transform: translate3d(var(--swipe-back-displacement, 0), 0, 0);
1888
- --seed-exit-translate-x: 100%;
1889
- --seed-exit-translate-y: 0;
1890
- --seed-exit-opacity: 1;
1891
- --seed-exit-scale: 1;
1892
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1893
- }
1894
-
1895
- [data-global-transition-state="enter-done"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1896
- --seed-enter-translate-x: var(--swipe-back-displacement, 0);
1897
- --seed-enter-translate-y: 0;
1898
- --seed-enter-opacity: 1;
1899
- --seed-enter-scale: 1;
1900
- transform: translate3d(var(--swipe-back-target, var(--swipe-back-displacement, 0)), 0, 0);
1901
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1902
- }
1903
-
1904
- [data-swipe-back-state="swiping"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1905
- transform: translate3d(var(--swipe-back-displacement, 0), 0, 0);
1906
- animation: none;
1907
- }
1908
-
1909
- [data-swipe-back-state="canceling"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1910
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1911
- transform: translate3d(0, 0, 0);
1912
- animation: none !important;
1913
- }
1914
-
1915
- [data-swipe-back-state="completing"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1916
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1917
- transform: translate3d(100%, 0, 0);
1918
- animation: none !important;
1919
- }
1920
-
1921
- [data-global-transition-state="enter-active"][data-top-activity-type="full-screen"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1922
- --seed-exit-translate-x: -30%;
1923
- --seed-exit-translate-y: 0;
1924
- --seed-exit-opacity: 1;
1925
- --seed-exit-scale: 1;
1926
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1927
- transform: translate3d(0, 0, 0);
1928
- }
1929
-
1930
- [data-global-transition-state="exit-active"][data-top-activity-type="full-screen"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1931
- --seed-enter-translate-x: calc(-30% + var(--swipe-back-displacement, 0) * .3);
1932
- --seed-enter-translate-y: 0;
1933
- --seed-enter-opacity: 1;
1934
- --seed-enter-scale: 1;
1935
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1936
- transform: translate3d(0, 0, 0);
1937
- }
1938
-
1939
- [data-global-transition-state="enter-done"][data-top-activity-type="full-screen"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]) {
1940
- transform: translate3d(calc(-30% + var(--swipe-back-displacement, 0) * .3), 0, 0);
1941
- --seed-exit-translate-x: -30%;
1942
- --seed-exit-translate-y: 0;
1943
- --seed-exit-opacity: 1;
1944
- --seed-exit-scale: 1;
1945
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1946
- }
1947
-
1948
- [data-swipe-back-state="swiping"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1949
- transform: translate3d(calc(-30% + var(--swipe-back-displacement, 0) * .3), 0, 0);
1950
- animation: none;
1951
- }
1952
-
1953
- [data-swipe-back-state="canceling"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1954
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1955
- transform: translate3d(-30%, 0, 0);
1956
- animation: none !important;
1957
- }
1958
-
1959
- [data-swipe-back-state="completing"] .seed-app-screen__layer--transitionStyle_slideFromRightIOS:not([data-activity-is-top]):not(#\#) {
1960
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
1961
- transform: translate3d(0, 0, 0);
1962
- animation: none !important;
1963
- }
1964
-
1965
1604
  .seed-app-screen__dim--transitionStyle_slideFromRightIOS {
1966
1605
  background: var(--seed-color-bg-overlay);
1967
1606
  height: 100%;
1968
1607
  }
1969
1608
 
1970
- [data-global-transition-state="enter-active"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1971
- --seed-enter-translate-x: 0;
1972
- --seed-enter-translate-y: 0;
1973
- --seed-enter-opacity: 0;
1974
- --seed-enter-scale: 1;
1975
- opacity: 1;
1976
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1977
- }
1978
-
1979
- [data-global-transition-state="exit-active"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1980
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0));
1981
- --seed-exit-translate-x: 0;
1982
- --seed-exit-translate-y: 0;
1983
- --seed-exit-opacity: 0;
1984
- --seed-exit-scale: 1;
1985
- animation: .35s cubic-bezier(.2, .1, .21, .99) forwards seed-exit;
1986
- }
1987
-
1988
- [data-global-transition-state="enter-done"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1989
- --seed-enter-translate-x: 0;
1990
- --seed-enter-translate-y: 0;
1991
- --seed-enter-opacity: calc(1 - var(--swipe-back-displacement-ratio, 0));
1992
- --seed-enter-scale: 1;
1993
- opacity: 1;
1994
- animation: .35s cubic-bezier(.2, .1, .21, .99) seed-enter;
1995
- }
1996
-
1997
- [data-swipe-back-state="swiping"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
1998
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0));
1999
- animation: none;
2000
- }
2001
-
2002
- [data-swipe-back-state="canceling"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
2003
- opacity: calc(1 - var(--swipe-back-displacement-ratio, 0));
2004
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
2005
- animation: none !important;
2006
- }
2007
-
2008
- [data-swipe-back-state="completing"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top]:not(#\#) {
2009
- opacity: 0;
2010
- transition: transform .35s cubic-bezier(.2, .1, .21, .99), opacity .35s cubic-bezier(.2, .1, .21, .99);
2011
- animation: none !important;
2012
- }
2013
-
2014
1609
  .seed-app-screen__root--transitionStyle_fadeFromBottomAndroid {
2015
1610
  --z-index-dim: calc(var(--z-index-base) + 0);
2016
1611
  --z-index-layer: calc(var(--z-index-base) + 3);
@@ -2023,50 +1618,10 @@
2023
1618
  height: 160px;
2024
1619
  }
2025
1620
 
2026
- [data-global-transition-state="enter-active"] .seed-app-screen__dim--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
2027
- --seed-enter-translate-x: 0;
2028
- --seed-enter-translate-y: 0;
2029
- --seed-enter-opacity: 0;
2030
- --seed-enter-scale: 1;
2031
- opacity: 1;
2032
- animation: .3s cubic-bezier(.23, .1, .32, 1) seed-enter;
2033
- transform: translate3d(0, -8vh, 0);
2034
- }
2035
-
2036
- [data-global-transition-state="exit-active"] .seed-app-screen__dim--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
2037
- opacity: 1;
2038
- --seed-exit-translate-x: 0;
2039
- --seed-exit-translate-y: 0;
2040
- --seed-exit-opacity: 0;
2041
- --seed-exit-scale: 1;
2042
- animation: .15s linear forwards seed-exit;
2043
- transform: translate3d(0, -8vh, 0);
2044
- }
2045
-
2046
1621
  .seed-app-screen__layer--transitionStyle_fadeFromBottomAndroid {
2047
1622
  transform: translate3d(0, 0, 0);
2048
1623
  }
2049
1624
 
2050
- [data-global-transition-state="enter-active"] .seed-app-screen__layer--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
2051
- --seed-enter-translate-x: 0;
2052
- --seed-enter-translate-y: 8vh;
2053
- --seed-enter-opacity: 0;
2054
- --seed-enter-scale: 1;
2055
- opacity: 1;
2056
- animation: .3s cubic-bezier(.23, .1, .32, 1) seed-enter;
2057
- transform: translate3d(0, 0, 0);
2058
- }
2059
-
2060
- [data-global-transition-state="exit-active"] .seed-app-screen__layer--transitionStyle_fadeFromBottomAndroid[data-activity-is-top] {
2061
- opacity: 1;
2062
- --seed-exit-translate-x: 0;
2063
- --seed-exit-translate-y: 8vh;
2064
- --seed-exit-opacity: 0;
2065
- --seed-exit-scale: 1;
2066
- animation: .15s linear forwards seed-exit;
2067
- transform: translate3d(0, 0, 0);
2068
- }
2069
-
2070
1625
  .seed-app-screen__root--transitionStyle_fadeIn {
2071
1626
  --z-index-dim: calc(var(--z-index-base) + 0);
2072
1627
  --z-index-layer: calc(var(--z-index-base) + 3);
@@ -2078,24 +1633,6 @@
2078
1633
  display: none;
2079
1634
  }
2080
1635
 
2081
- [data-global-transition-state="enter-active"] .seed-app-screen__layer--transitionStyle_fadeIn[data-activity-is-top] {
2082
- --seed-enter-translate-x: 0;
2083
- --seed-enter-translate-y: 0;
2084
- --seed-enter-opacity: 0;
2085
- --seed-enter-scale: 1;
2086
- opacity: 1;
2087
- animation: .3s ease-out seed-enter;
2088
- }
2089
-
2090
- [data-global-transition-state="exit-active"] .seed-app-screen__layer--transitionStyle_fadeIn[data-activity-is-top] {
2091
- opacity: 1;
2092
- --seed-exit-translate-x: 0;
2093
- --seed-exit-translate-y: 0;
2094
- --seed-exit-opacity: 0;
2095
- --seed-exit-scale: 1;
2096
- animation: .15s ease-in forwards seed-exit;
2097
- }
2098
-
2099
1636
  .seed-app-screen__layer--layerOffsetTop_safeArea {
2100
1637
  padding-top: var(--seed-safe-area-top);
2101
1638
  }