strata-ui-react 0.3.0 → 0.3.1

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 (2) hide show
  1. package/dist/styles.css +158 -160
  2. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -1614,166 +1614,164 @@
1614
1614
  }
1615
1615
  }
1616
1616
  }
1617
- @layer base {
1618
- :root {
1619
- --strata-primary: var(--color-blue-500);
1620
- --strata-on-primary: var(--color-white-200);
1621
- --strata-primary-container: var(--color-blue-100);
1622
- --strata-on-primary-container: var(--color-blue-600);
1623
- --strata-on-primary-container-variant: var(--color-blue-900);
1624
- --strata-secondary: var(--color-slate-700);
1625
- --strata-on-secondary: var(--color-white-200);
1626
- --strata-secondary-container: var(--color-slate-100);
1627
- --strata-on-secondary-container: var(--color-slate-600);
1628
- --strata-on-secondary-container-variant: var(--color-slate-900);
1629
- --strata-accent: var(--color-lime-500);
1630
- --strata-on-accent: var(--color-white-200);
1631
- --strata-accent-container: var(--color-lime-100);
1632
- --strata-on-accent-container: var(--color-lime-600);
1633
- --strata-on-accent-container-variant: var(--color-lime-900);
1634
- --strata-error: var(--color-red-500);
1635
- --strata-on-error: var(--color-white-200);
1636
- --strata-error-container: var(--color-red-100);
1637
- --strata-on-error-container: var(--color-red-800);
1638
- --strata-on-error-container-variant: var(--color-red-700);
1639
- --strata-success: var(--color-green-500);
1640
- --strata-on-success: var(--color-white-200);
1641
- --strata-success-container: var(--color-green-100);
1642
- --strata-on-success-container: var(--color-green-800);
1643
- --strata-on-success-container-variant: var(--color-green-700);
1644
- --strata-warning: var(--color-orange-500);
1645
- --strata-on-warning: var(--color-white-200);
1646
- --strata-warning-container: var(--color-orange-100);
1647
- --strata-on-warning-container: var(--color-orange-800);
1648
- --strata-on-warning-container-variant: var(--color-orange-700);
1649
- --strata-surface-dim: var(--color-white-300);
1650
- --strata-surface: var(--color-white-200);
1651
- --strata-surface-bright: var(--color-white-150);
1652
- --strata-surface-container-lowest: var(--color-white-150);
1653
- --strata-surface-container-low: var(--color-white-100);
1654
- --strata-surface-container: var(--color-white-75);
1655
- --strata-surface-container-high: var(--color-white-50);
1656
- --strata-surface-container-highest: var(--color-white-25);
1657
- --strata-on-surface: var(--color-black-200);
1658
- --strata-on-surface-variant: var(--color-black-800);
1659
- --strata-outline: var(--color-white-900);
1660
- --strata-outline-variant: var(--color-white-600);
1661
- --strata-inverse-surface: var(--color-black-100);
1662
- --strata-inverse-on-surface: var(--color-white-200);
1663
- --strata-inverse-primary: var(--color-blue-300);
1664
- --strata-scrim: #00000059;
1665
- --strata-shadow: #00000040;
1666
- --strata-glass-fill-lowest: #ffffff14;
1667
- --strata-glass-fill-low: #ffffff1f;
1668
- --strata-glass-fill-medium: #ffffff29;
1669
- --strata-glass-fill-high: #ffffff33;
1670
- --strata-glass-fill-highest: #ffffff40;
1671
- --strata-on-glass: var(--color-black-400);
1672
- --strata-on-glass-variant: var(--color-black-700);
1673
- --strata-inverse-glass-fill: #1e1e1eff;
1674
- --strata-inverse-on-glass: var(--color-white-400);
1675
- --strata-glass-outline-lowest: #ffffff66;
1676
- --strata-glass-outline-low: #ffffff80;
1677
- --strata-glass-outline-medium: #ffffff99;
1678
- --strata-glass-outline-high: #ffffffb2;
1679
- --strata-glass-outline-highest: #ffffffcc;
1680
- --strata-spacing-3xs: clamp(0.1875rem, 0.1619rem + 0.1136vw, 0.25rem);
1681
- --strata-spacing-2xs: clamp(0.375rem, 0.3239rem + 0.2273vw, 0.5rem);
1682
- --strata-spacing-xs: clamp(0.5625rem, 0.4858rem + 0.3409vw, 0.75rem);
1683
- --strata-spacing-sm: clamp(0.75rem, 0.6477rem + 0.4545vw, 1rem);
1684
- --strata-spacing-md: clamp(1.125rem, 0.9716rem + 0.6818vw, 1.5rem);
1685
- --strata-spacing-lg: clamp(1.5rem, 1.2955rem + 0.9091vw, 2rem);
1686
- --strata-spacing-xl: clamp(2.25rem, 1.9432rem + 1.3636vw, 3rem);
1687
- --strata-spacing-2xl: clamp(3rem, 2.5909rem + 1.8182vw, 4rem);
1688
- --strata-spacing-3xl: clamp(4.5rem, 3.8864rem + 2.7273vw, 6rem);
1689
- --strata-spacing-3xs-2xs: clamp(0.1875rem, 0.0597rem + 0.5682vw, 0.5rem);
1690
- --strata-spacing-2xs-xs: clamp(0.375rem, 0.2216rem + 0.6818vw, 0.75rem);
1691
- --strata-spacing-xs-s: clamp(0.5625rem, 0.3835rem + 0.7955vw, 1rem);
1692
- --strata-spacing-s-m: clamp(0.75rem, 0.4432rem + 1.3636vw, 1.5rem);
1693
- --strata-spacing-m-l: clamp(1.125rem, 0.767rem + 1.5909vw, 2rem);
1694
- --strata-spacing-l-xl: clamp(1.5rem, 0.8864rem + 2.7273vw, 3rem);
1695
- --strata-spacing-xl-2xl: clamp(2.25rem, 1.5341rem + 3.1818vw, 4rem);
1696
- --strata-spacing-2xl-3xl: clamp(3rem, 1.7727rem + 5.4545vw, 6rem);
1697
- --strata-font-display: "Sora", sans-serif;
1698
- --strata-font-heading: "Space Grotesk", sans-serif;
1699
- --strata-font-body: "IBM Plex Sans", sans-serif;
1700
- --strata-text-xs: clamp(0.5926rem, 0.5509rem + 0.1852vw, 0.6944rem);
1701
- --strata-text-sm: clamp(0.6667rem, 0.5985rem + 0.303vw, 0.8333rem);
1702
- --strata-text-base: clamp(0.75rem, 0.6477rem + 0.4545vw, 1rem);
1703
- --strata-text-lg: clamp(0.8438rem, 0.698rem + 0.6477vw, 1.2rem);
1704
- --strata-text-xl: clamp(0.9492rem, 0.7484rem + 0.8923vw, 1.44rem);
1705
- --strata-text-2xl: clamp(1.0679rem, 0.7978rem + 1.2002vw, 1.728rem);
1706
- --strata-text-3xl: clamp(1.2014rem, 0.8445rem + 1.5859vw, 2.0736rem);
1707
- --strata-text-4xl: clamp(1.3515rem, 0.8865rem + 2.0669vw, 2.4883rem);
1708
- --strata-blur-1: blur(8px);
1709
- --strata-blur-2: blur(12px);
1710
- --strata-blur-3: blur(16px);
1711
- --strata-blur-4: blur(20px);
1712
- --strata-blur-5: blur(24px);
1713
- }
1714
- .dark {
1715
- --strata-primary: var(--color-blue-400);
1716
- --strata-on-primary: var(--color-black-100);
1717
- --strata-primary-container: var(--color-blue-900);
1718
- --strata-on-primary-container: var(--color-blue-400);
1719
- --strata-on-primary-container-variant: var(--color-blue-100);
1720
- --strata-secondary: var(--color-slate-500);
1721
- --strata-on-secondary: var(--color-black-100);
1722
- --strata-secondary-container: var(--color-slate-900);
1723
- --strata-on-secondary-container: var(--color-slate-400);
1724
- --strata-on-secondary-container-variant: var(--color-slate-100);
1725
- --strata-accent: var(--color-lime-200);
1726
- --strata-on-accent: var(--color-black-100);
1727
- --strata-accent-container: var(--color-lime-900);
1728
- --strata-on-accent-container: var(--color-lime-400);
1729
- --strata-on-accent-container-variant: var(--color-lime-100);
1730
- --strata-error: var(--color-red-500);
1731
- --strata-on-error: var(--color-black-100);
1732
- --strata-error-container: var(--color-red-900);
1733
- --strata-on-error-container: var(--color-red-400);
1734
- --strata-on-error-container-variant: var(--color-red-200);
1735
- --strata-success: var(--color-green-300);
1736
- --strata-on-success: var(--color-black-100);
1737
- --strata-success-container: var(--color-green-900);
1738
- --strata-on-success-container: var(--color-green-200);
1739
- --strata-on-success-container-variant: var(--color-green-300);
1740
- --strata-warning: var(--color-orange-300);
1741
- --strata-on-warning: var(--color-black-100);
1742
- --strata-warning-container: var(--color-orange-900);
1743
- --strata-on-warning-container: var(--color-orange-400);
1744
- --strata-on-warning-container-variant: var(--color-orange-200);
1745
- --strata-surface-dim: var(--color-black-75);
1746
- --strata-surface: var(--color-black-100);
1747
- --strata-surface-bright: var(--color-black-150);
1748
- --strata-surface-container-lowest: var(--color-black-200);
1749
- --strata-surface-container-low: var(--color-black-250);
1750
- --strata-surface-container: var(--color-black-300);
1751
- --strata-surface-container-high: var(--color-black-400);
1752
- --strata-surface-container-highest: var(--color-black-500);
1753
- --strata-on-surface: var(--color-white-200);
1754
- --strata-on-surface-variant: var(--color-white-900);
1755
- --strata-outline: var(--color-black-600);
1756
- --strata-outline-variant: var(--color-black-400);
1757
- --strata-inverse-surface: var(--color-white-200);
1758
- --strata-inverse-on-surface: var(--color-black-200);
1759
- --strata-inverse-primary: var(--color-blue-600);
1760
- --strata-scrim: #00000059;
1761
- --strata-shadow: #00000099;
1762
- --strata-glass-fill-lowest: #19191926;
1763
- --strata-glass-fill-low: #19191933;
1764
- --strata-glass-fill-medium: #19191940;
1765
- --strata-glass-fill-high: #1919194d;
1766
- --strata-glass-fill-highest: #19191959;
1767
- --strata-on-glass: var(--color-white-400);
1768
- --strata-on-glass-variant: var(--color-white-700);
1769
- --strata-inverse-glass-fill: #eceef0ff;
1770
- --strata-inverse-on-glass: var(--color-black-400);
1771
- --strata-glass-outline-lowest: #ffffff33;
1772
- --strata-glass-outline-low: #ffffff4d;
1773
- --strata-glass-outline-medium: #ffffff66;
1774
- --strata-glass-outline-high: #ffffff80;
1775
- --strata-glass-outline-highest: #ffffff99;
1776
- }
1617
+ :root {
1618
+ --strata-primary: var(--color-blue-500);
1619
+ --strata-on-primary: var(--color-white-200);
1620
+ --strata-primary-container: var(--color-blue-100);
1621
+ --strata-on-primary-container: var(--color-blue-600);
1622
+ --strata-on-primary-container-variant: var(--color-blue-900);
1623
+ --strata-secondary: var(--color-slate-700);
1624
+ --strata-on-secondary: var(--color-white-200);
1625
+ --strata-secondary-container: var(--color-slate-100);
1626
+ --strata-on-secondary-container: var(--color-slate-600);
1627
+ --strata-on-secondary-container-variant: var(--color-slate-900);
1628
+ --strata-accent: var(--color-lime-500);
1629
+ --strata-on-accent: var(--color-white-200);
1630
+ --strata-accent-container: var(--color-lime-100);
1631
+ --strata-on-accent-container: var(--color-lime-600);
1632
+ --strata-on-accent-container-variant: var(--color-lime-900);
1633
+ --strata-error: var(--color-red-500);
1634
+ --strata-on-error: var(--color-white-200);
1635
+ --strata-error-container: var(--color-red-100);
1636
+ --strata-on-error-container: var(--color-red-800);
1637
+ --strata-on-error-container-variant: var(--color-red-700);
1638
+ --strata-success: var(--color-green-500);
1639
+ --strata-on-success: var(--color-white-200);
1640
+ --strata-success-container: var(--color-green-100);
1641
+ --strata-on-success-container: var(--color-green-800);
1642
+ --strata-on-success-container-variant: var(--color-green-700);
1643
+ --strata-warning: var(--color-orange-500);
1644
+ --strata-on-warning: var(--color-white-200);
1645
+ --strata-warning-container: var(--color-orange-100);
1646
+ --strata-on-warning-container: var(--color-orange-800);
1647
+ --strata-on-warning-container-variant: var(--color-orange-700);
1648
+ --strata-surface-dim: var(--color-white-300);
1649
+ --strata-surface: var(--color-white-200);
1650
+ --strata-surface-bright: var(--color-white-150);
1651
+ --strata-surface-container-lowest: var(--color-white-150);
1652
+ --strata-surface-container-low: var(--color-white-100);
1653
+ --strata-surface-container: var(--color-white-75);
1654
+ --strata-surface-container-high: var(--color-white-50);
1655
+ --strata-surface-container-highest: var(--color-white-25);
1656
+ --strata-on-surface: var(--color-black-200);
1657
+ --strata-on-surface-variant: var(--color-black-800);
1658
+ --strata-outline: var(--color-white-900);
1659
+ --strata-outline-variant: var(--color-white-600);
1660
+ --strata-inverse-surface: var(--color-black-100);
1661
+ --strata-inverse-on-surface: var(--color-white-200);
1662
+ --strata-inverse-primary: var(--color-blue-300);
1663
+ --strata-scrim: #00000059;
1664
+ --strata-shadow: #00000040;
1665
+ --strata-glass-fill-lowest: #ffffff14;
1666
+ --strata-glass-fill-low: #ffffff1f;
1667
+ --strata-glass-fill-medium: #ffffff29;
1668
+ --strata-glass-fill-high: #ffffff33;
1669
+ --strata-glass-fill-highest: #ffffff40;
1670
+ --strata-on-glass: var(--color-black-400);
1671
+ --strata-on-glass-variant: var(--color-black-700);
1672
+ --strata-inverse-glass-fill: #1e1e1eff;
1673
+ --strata-inverse-on-glass: var(--color-white-400);
1674
+ --strata-glass-outline-lowest: #ffffff66;
1675
+ --strata-glass-outline-low: #ffffff80;
1676
+ --strata-glass-outline-medium: #ffffff99;
1677
+ --strata-glass-outline-high: #ffffffb2;
1678
+ --strata-glass-outline-highest: #ffffffcc;
1679
+ --strata-spacing-3xs: clamp(0.1875rem, 0.1619rem + 0.1136vw, 0.25rem);
1680
+ --strata-spacing-2xs: clamp(0.375rem, 0.3239rem + 0.2273vw, 0.5rem);
1681
+ --strata-spacing-xs: clamp(0.5625rem, 0.4858rem + 0.3409vw, 0.75rem);
1682
+ --strata-spacing-sm: clamp(0.75rem, 0.6477rem + 0.4545vw, 1rem);
1683
+ --strata-spacing-md: clamp(1.125rem, 0.9716rem + 0.6818vw, 1.5rem);
1684
+ --strata-spacing-lg: clamp(1.5rem, 1.2955rem + 0.9091vw, 2rem);
1685
+ --strata-spacing-xl: clamp(2.25rem, 1.9432rem + 1.3636vw, 3rem);
1686
+ --strata-spacing-2xl: clamp(3rem, 2.5909rem + 1.8182vw, 4rem);
1687
+ --strata-spacing-3xl: clamp(4.5rem, 3.8864rem + 2.7273vw, 6rem);
1688
+ --strata-spacing-3xs-2xs: clamp(0.1875rem, 0.0597rem + 0.5682vw, 0.5rem);
1689
+ --strata-spacing-2xs-xs: clamp(0.375rem, 0.2216rem + 0.6818vw, 0.75rem);
1690
+ --strata-spacing-xs-s: clamp(0.5625rem, 0.3835rem + 0.7955vw, 1rem);
1691
+ --strata-spacing-s-m: clamp(0.75rem, 0.4432rem + 1.3636vw, 1.5rem);
1692
+ --strata-spacing-m-l: clamp(1.125rem, 0.767rem + 1.5909vw, 2rem);
1693
+ --strata-spacing-l-xl: clamp(1.5rem, 0.8864rem + 2.7273vw, 3rem);
1694
+ --strata-spacing-xl-2xl: clamp(2.25rem, 1.5341rem + 3.1818vw, 4rem);
1695
+ --strata-spacing-2xl-3xl: clamp(3rem, 1.7727rem + 5.4545vw, 6rem);
1696
+ --strata-font-display: "Sora", sans-serif;
1697
+ --strata-font-heading: "Space Grotesk", sans-serif;
1698
+ --strata-font-body: "IBM Plex Sans", sans-serif;
1699
+ --strata-text-xs: clamp(0.5926rem, 0.5509rem + 0.1852vw, 0.6944rem);
1700
+ --strata-text-sm: clamp(0.6667rem, 0.5985rem + 0.303vw, 0.8333rem);
1701
+ --strata-text-base: clamp(0.75rem, 0.6477rem + 0.4545vw, 1rem);
1702
+ --strata-text-lg: clamp(0.8438rem, 0.698rem + 0.6477vw, 1.2rem);
1703
+ --strata-text-xl: clamp(0.9492rem, 0.7484rem + 0.8923vw, 1.44rem);
1704
+ --strata-text-2xl: clamp(1.0679rem, 0.7978rem + 1.2002vw, 1.728rem);
1705
+ --strata-text-3xl: clamp(1.2014rem, 0.8445rem + 1.5859vw, 2.0736rem);
1706
+ --strata-text-4xl: clamp(1.3515rem, 0.8865rem + 2.0669vw, 2.4883rem);
1707
+ --strata-blur-1: blur(8px);
1708
+ --strata-blur-2: blur(12px);
1709
+ --strata-blur-3: blur(16px);
1710
+ --strata-blur-4: blur(20px);
1711
+ --strata-blur-5: blur(24px);
1712
+ }
1713
+ .dark {
1714
+ --strata-primary: var(--color-blue-400);
1715
+ --strata-on-primary: var(--color-black-100);
1716
+ --strata-primary-container: var(--color-blue-900);
1717
+ --strata-on-primary-container: var(--color-blue-400);
1718
+ --strata-on-primary-container-variant: var(--color-blue-100);
1719
+ --strata-secondary: var(--color-slate-500);
1720
+ --strata-on-secondary: var(--color-black-100);
1721
+ --strata-secondary-container: var(--color-slate-900);
1722
+ --strata-on-secondary-container: var(--color-slate-400);
1723
+ --strata-on-secondary-container-variant: var(--color-slate-100);
1724
+ --strata-accent: var(--color-lime-200);
1725
+ --strata-on-accent: var(--color-black-100);
1726
+ --strata-accent-container: var(--color-lime-900);
1727
+ --strata-on-accent-container: var(--color-lime-400);
1728
+ --strata-on-accent-container-variant: var(--color-lime-100);
1729
+ --strata-error: var(--color-red-500);
1730
+ --strata-on-error: var(--color-black-100);
1731
+ --strata-error-container: var(--color-red-900);
1732
+ --strata-on-error-container: var(--color-red-400);
1733
+ --strata-on-error-container-variant: var(--color-red-200);
1734
+ --strata-success: var(--color-green-300);
1735
+ --strata-on-success: var(--color-black-100);
1736
+ --strata-success-container: var(--color-green-900);
1737
+ --strata-on-success-container: var(--color-green-200);
1738
+ --strata-on-success-container-variant: var(--color-green-300);
1739
+ --strata-warning: var(--color-orange-300);
1740
+ --strata-on-warning: var(--color-black-100);
1741
+ --strata-warning-container: var(--color-orange-900);
1742
+ --strata-on-warning-container: var(--color-orange-400);
1743
+ --strata-on-warning-container-variant: var(--color-orange-200);
1744
+ --strata-surface-dim: var(--color-black-75);
1745
+ --strata-surface: var(--color-black-100);
1746
+ --strata-surface-bright: var(--color-black-150);
1747
+ --strata-surface-container-lowest: var(--color-black-200);
1748
+ --strata-surface-container-low: var(--color-black-250);
1749
+ --strata-surface-container: var(--color-black-300);
1750
+ --strata-surface-container-high: var(--color-black-400);
1751
+ --strata-surface-container-highest: var(--color-black-500);
1752
+ --strata-on-surface: var(--color-white-200);
1753
+ --strata-on-surface-variant: var(--color-white-900);
1754
+ --strata-outline: var(--color-black-600);
1755
+ --strata-outline-variant: var(--color-black-400);
1756
+ --strata-inverse-surface: var(--color-white-200);
1757
+ --strata-inverse-on-surface: var(--color-black-200);
1758
+ --strata-inverse-primary: var(--color-blue-600);
1759
+ --strata-scrim: #00000059;
1760
+ --strata-shadow: #00000099;
1761
+ --strata-glass-fill-lowest: #19191926;
1762
+ --strata-glass-fill-low: #19191933;
1763
+ --strata-glass-fill-medium: #19191940;
1764
+ --strata-glass-fill-high: #1919194d;
1765
+ --strata-glass-fill-highest: #19191959;
1766
+ --strata-on-glass: var(--color-white-400);
1767
+ --strata-on-glass-variant: var(--color-white-700);
1768
+ --strata-inverse-glass-fill: #eceef0ff;
1769
+ --strata-inverse-on-glass: var(--color-black-400);
1770
+ --strata-glass-outline-lowest: #ffffff33;
1771
+ --strata-glass-outline-low: #ffffff4d;
1772
+ --strata-glass-outline-medium: #ffffff66;
1773
+ --strata-glass-outline-high: #ffffff80;
1774
+ --strata-glass-outline-highest: #ffffff99;
1777
1775
  }
1778
1776
  @property --tw-translate-x {
1779
1777
  syntax: "*";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "strata-ui-react",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "type": "module",
5
5
  "author": "PHNTMbandit",
6
6
  "repository": {