@appartmint/mint 2.7.4 → 2.7.5

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/dist/css/mint.css CHANGED
@@ -163,6 +163,12 @@
163
163
  --mint-header-fore: var(--mint-fore);
164
164
  }
165
165
 
166
+ body.mint-fixed #mint-header {
167
+ position: fixed;
168
+ top: 0;
169
+ left: 0;
170
+ }
171
+
166
172
  #mint-header {
167
173
  position: relative;
168
174
  width: 100%;
@@ -1511,6 +1517,54 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1511
1517
  gap: 1rem;
1512
1518
  }
1513
1519
 
1520
+ body.mint-ready app-root {
1521
+ opacity: 1;
1522
+ }
1523
+
1524
+ router-outlet {
1525
+ display: none;
1526
+ }
1527
+
1528
+ app-root {
1529
+ display: block;
1530
+ position: relative;
1531
+ opacity: 0;
1532
+ transition: opacity 750ms ease-in;
1533
+ }
1534
+
1535
+ :root main > router-outlet {
1536
+ flex-grow: 0;
1537
+ }
1538
+ :root main > router-outlet + * {
1539
+ display: flex;
1540
+ flex-direction: column;
1541
+ align-items: center;
1542
+ justify-content: center;
1543
+ flex-grow: 1;
1544
+ width: 100%;
1545
+ padding: 0.25rem;
1546
+ }
1547
+ :root main > router-outlet + * {
1548
+ padding: 4px;
1549
+ }
1550
+ @media (min-width: 480px) {
1551
+ :root main > router-outlet + * {
1552
+ padding: calc(4px + 12 * (100vw - 480px) / 288);
1553
+ }
1554
+ }
1555
+ @media (min-width: 768px) {
1556
+ :root main > router-outlet + * {
1557
+ padding: 16px;
1558
+ }
1559
+ }
1560
+ :root main > router-outlet + * + :not(mint-partial-footer) {
1561
+ height: 0;
1562
+ overflow: hidden;
1563
+ }
1564
+ :root main > router-outlet + mint-partial-footer {
1565
+ transform: translateY(100vh);
1566
+ }
1567
+
1514
1568
  @keyframes mint-stretch-in {
1515
1569
  0% {
1516
1570
  transform: scale(1);
@@ -1710,28 +1764,8 @@ body {
1710
1764
  scroll-behavior: smooth;
1711
1765
  }
1712
1766
 
1713
- body.mint-fixed #mint-header {
1714
- position: fixed;
1715
- top: 0;
1716
- left: 0;
1717
- }
1718
1767
  body.mint-fixed main {
1719
- min-height: 100vh;
1720
- padding-top: var(--mint-header-height);
1721
- }
1722
- body.mint-ready app-root {
1723
- opacity: 1;
1724
- }
1725
-
1726
- router-outlet {
1727
- display: none;
1728
- }
1729
-
1730
- app-root {
1731
- display: block;
1732
- position: relative;
1733
- opacity: 0;
1734
- transition: opacity 750ms ease-in;
1768
+ margin-top: var(--mint-header-height);
1735
1769
  }
1736
1770
 
1737
1771
  main {
@@ -1740,42 +1774,23 @@ main {
1740
1774
  position: relative;
1741
1775
  width: 100%;
1742
1776
  min-height: calc(100vh - var(--mint-header-height));
1777
+ min-height: calc(100dvh - var(--mint-header-height));
1743
1778
  overflow: hidden;
1744
1779
  z-index: 999;
1745
1780
  }
1746
- main > router-outlet {
1747
- flex-grow: 0;
1748
- }
1749
-
1750
- :root main > router-outlet + * {
1751
- display: flex;
1752
- flex-direction: column;
1753
- align-items: center;
1754
- justify-content: center;
1755
- flex-grow: 1;
1756
- width: 100%;
1757
- padding: 0.25rem;
1758
- }
1759
- :root main > router-outlet + * {
1781
+ main {
1760
1782
  padding: 4px;
1761
1783
  }
1762
1784
  @media (min-width: 480px) {
1763
- :root main > router-outlet + * {
1785
+ main {
1764
1786
  padding: calc(4px + 12 * (100vw - 480px) / 288);
1765
1787
  }
1766
1788
  }
1767
1789
  @media (min-width: 768px) {
1768
- :root main > router-outlet + * {
1790
+ main {
1769
1791
  padding: 16px;
1770
1792
  }
1771
1793
  }
1772
- :root main > router-outlet + * + :not(mint-partial-footer) {
1773
- height: 0;
1774
- overflow: hidden;
1775
- }
1776
- :root main > router-outlet + mint-partial-footer {
1777
- transform: translateY(100vh);
1778
- }
1779
1794
 
1780
1795
  nav a {
1781
1796
  display: block;