@lemonppt/themes 0.1.3 → 0.1.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.
Files changed (4) hide show
  1. package/package.json +2 -2
  2. package/src/base/styles.css +178 -0
  3. package/src/dark-tech/styles.css +178 -0
  4. package/src/warm-business/styles.css +178 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lemonppt/themes",
3
- "version": "0.1.3",
3
+ "version": "0.1.5",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -27,7 +27,7 @@
27
27
  },
28
28
  "homepage": "https://github.com/lemonforme/lemonPPT#readme",
29
29
  "dependencies": {
30
- "@lemonppt/core": "0.1.3"
30
+ "@lemonppt/core": "0.1.5"
31
31
  },
32
32
  "devDependencies": {
33
33
  "typescript": "^5.5.0"
package/src/base/styles.css CHANGED
@@ -1761,3 +1761,181 @@ body {
1761
1761
  break-after: auto;
1762
1762
  }
1763
1763
  }
1764
+ .lp-testimonial-v2 {
1765
+ width: 100%;
1766
+ height: 100%;
1767
+ padding: 80px;
1768
+ background: var(--lp-surface);
1769
+ display: flex;
1770
+ align-items: center;
1771
+ justify-content: center;
1772
+ }
1773
+
1774
+ .lp-testimonial-v2-card {
1775
+ width: 100%;
1776
+ max-width: 900px;
1777
+ background: var(--lp-bg);
1778
+ border: 1px solid var(--lp-border);
1779
+ border-radius: var(--lp-radius-large);
1780
+ padding: 48px;
1781
+ position: relative;
1782
+ }
1783
+
1784
+ .lp-testimonial-v2-logo {
1785
+ position: absolute;
1786
+ top: 32px;
1787
+ right: 40px;
1788
+ height: 32px;
1789
+ max-width: 120px;
1790
+ object-fit: contain;
1791
+ }
1792
+
1793
+ .lp-testimonial-v2-company {
1794
+ position: absolute;
1795
+ top: 32px;
1796
+ right: 40px;
1797
+ font-size: 14px;
1798
+ font-weight: 600;
1799
+ color: var(--lp-secondary);
1800
+ text-transform: uppercase;
1801
+ letter-spacing: 0.05em;
1802
+ }
1803
+
1804
+ .lp-testimonial-v2-quote {
1805
+ margin: 32px 0 40px;
1806
+ }
1807
+
1808
+ .lp-testimonial-v2-quote blockquote {
1809
+ font-size: 32px;
1810
+ font-weight: 500;
1811
+ line-height: 1.4;
1812
+ color: var(--lp-text);
1813
+ margin: 0;
1814
+ padding: 0;
1815
+ }
1816
+
1817
+ .lp-testimonial-v2-footer {
1818
+ display: flex;
1819
+ align-items: flex-end;
1820
+ justify-content: space-between;
1821
+ gap: 24px;
1822
+ }
1823
+
1824
+ .lp-testimonial-v2-name {
1825
+ font-size: 18px;
1826
+ font-weight: 600;
1827
+ color: var(--lp-text);
1828
+ }
1829
+
1830
+ .lp-testimonial-v2-role {
1831
+ font-size: 14px;
1832
+ color: var(--lp-secondary);
1833
+ margin-top: 4px;
1834
+ }
1835
+
1836
+ .lp-testimonial-v2-metric {
1837
+ text-align: right;
1838
+ flex-shrink: 0;
1839
+ }
1840
+
1841
+ .lp-testimonial-v2-metric-value {
1842
+ font-size: 36px;
1843
+ font-weight: 700;
1844
+ color: var(--lp-accent);
1845
+ line-height: 1;
1846
+ }
1847
+
1848
+ .lp-testimonial-v2-metric-label {
1849
+ font-size: 13px;
1850
+ color: var(--lp-secondary);
1851
+ margin-top: 4px;
1852
+ }
1853
+ .lp-chart-v2 {
1854
+ width: 100%;
1855
+ height: 100%;
1856
+ padding: 80px;
1857
+ background: var(--lp-surface);
1858
+ display: flex;
1859
+ flex-direction: column;
1860
+ }
1861
+
1862
+ .lp-chart-v2-header {
1863
+ margin-bottom: 40px;
1864
+ }
1865
+
1866
+ .lp-chart-v2-body {
1867
+ flex: 1;
1868
+ display: flex;
1869
+ align-items: center;
1870
+ justify-content: center;
1871
+ }
1872
+
1873
+ .lp-chart-v2-svg {
1874
+ width: 100%;
1875
+ max-width: 900px;
1876
+ height: auto;
1877
+ }
1878
+
1879
+ .lp-chart-v2-grid {
1880
+ stroke: var(--lp-border);
1881
+ stroke-width: 1;
1882
+ }
1883
+
1884
+ .lp-chart-v2-axis-text {
1885
+ fill: var(--lp-secondary);
1886
+ font-size: 12px;
1887
+ font-family: var(--lp-font-mono);
1888
+ }
1889
+
1890
+ .lp-chart-v2-bar {
1891
+ opacity: 0.9;
1892
+ }
1893
+
1894
+ .lp-chart-v2-legend-text {
1895
+ fill: var(--lp-secondary);
1896
+ font-size: 12px;
1897
+ font-family: var(--lp-font-body);
1898
+ }
1899
+ .lp-gallery-v2 {
1900
+ width: 100%;
1901
+ height: 100%;
1902
+ padding: 80px;
1903
+ background: var(--lp-surface);
1904
+ display: flex;
1905
+ flex-direction: column;
1906
+ }
1907
+
1908
+ .lp-gallery-v2-header {
1909
+ margin-bottom: 40px;
1910
+ }
1911
+
1912
+ .lp-gallery-v2-grid {
1913
+ display: grid;
1914
+ grid-template-columns: repeat(3, 1fr);
1915
+ gap: 24px;
1916
+ flex: 1;
1917
+ align-content: start;
1918
+ }
1919
+
1920
+ .lp-gallery-v2-item {
1921
+ display: flex;
1922
+ flex-direction: column;
1923
+ gap: 10px;
1924
+ }
1925
+
1926
+ .lp-gallery-v2-item img,
1927
+ .lp-gallery-v2-placeholder {
1928
+ width: 100%;
1929
+ aspect-ratio: 16 / 10;
1930
+ object-fit: cover;
1931
+ border-radius: var(--lp-radius-medium);
1932
+ background: var(--lp-bg);
1933
+ border: 1px solid var(--lp-border);
1934
+ }
1935
+
1936
+ .lp-gallery-v2-caption {
1937
+ font-size: 14px;
1938
+ color: var(--lp-secondary);
1939
+ text-align: center;
1940
+ line-height: 1.4;
1941
+ }
package/src/dark-tech/styles.css CHANGED
@@ -1780,3 +1780,181 @@ body {
1780
1780
  break-after: auto;
1781
1781
  }
1782
1782
  }
1783
+ .lp-testimonial-v2 {
1784
+ width: 100%;
1785
+ height: 100%;
1786
+ padding: 80px;
1787
+ background: var(--lp-surface);
1788
+ display: flex;
1789
+ align-items: center;
1790
+ justify-content: center;
1791
+ }
1792
+
1793
+ .lp-testimonial-v2-card {
1794
+ width: 100%;
1795
+ max-width: 900px;
1796
+ background: var(--lp-bg);
1797
+ border: 1px solid var(--lp-border);
1798
+ border-radius: var(--lp-radius-large);
1799
+ padding: 48px;
1800
+ position: relative;
1801
+ }
1802
+
1803
+ .lp-testimonial-v2-logo {
1804
+ position: absolute;
1805
+ top: 32px;
1806
+ right: 40px;
1807
+ height: 32px;
1808
+ max-width: 120px;
1809
+ object-fit: contain;
1810
+ }
1811
+
1812
+ .lp-testimonial-v2-company {
1813
+ position: absolute;
1814
+ top: 32px;
1815
+ right: 40px;
1816
+ font-size: 14px;
1817
+ font-weight: 600;
1818
+ color: var(--lp-secondary);
1819
+ text-transform: uppercase;
1820
+ letter-spacing: 0.05em;
1821
+ }
1822
+
1823
+ .lp-testimonial-v2-quote {
1824
+ margin: 32px 0 40px;
1825
+ }
1826
+
1827
+ .lp-testimonial-v2-quote blockquote {
1828
+ font-size: 32px;
1829
+ font-weight: 500;
1830
+ line-height: 1.4;
1831
+ color: var(--lp-text);
1832
+ margin: 0;
1833
+ padding: 0;
1834
+ }
1835
+
1836
+ .lp-testimonial-v2-footer {
1837
+ display: flex;
1838
+ align-items: flex-end;
1839
+ justify-content: space-between;
1840
+ gap: 24px;
1841
+ }
1842
+
1843
+ .lp-testimonial-v2-name {
1844
+ font-size: 18px;
1845
+ font-weight: 600;
1846
+ color: var(--lp-text);
1847
+ }
1848
+
1849
+ .lp-testimonial-v2-role {
1850
+ font-size: 14px;
1851
+ color: var(--lp-secondary);
1852
+ margin-top: 4px;
1853
+ }
1854
+
1855
+ .lp-testimonial-v2-metric {
1856
+ text-align: right;
1857
+ flex-shrink: 0;
1858
+ }
1859
+
1860
+ .lp-testimonial-v2-metric-value {
1861
+ font-size: 36px;
1862
+ font-weight: 700;
1863
+ color: var(--lp-accent);
1864
+ line-height: 1;
1865
+ }
1866
+
1867
+ .lp-testimonial-v2-metric-label {
1868
+ font-size: 13px;
1869
+ color: var(--lp-secondary);
1870
+ margin-top: 4px;
1871
+ }
1872
+ .lp-chart-v2 {
1873
+ width: 100%;
1874
+ height: 100%;
1875
+ padding: 80px;
1876
+ background: var(--lp-surface);
1877
+ display: flex;
1878
+ flex-direction: column;
1879
+ }
1880
+
1881
+ .lp-chart-v2-header {
1882
+ margin-bottom: 40px;
1883
+ }
1884
+
1885
+ .lp-chart-v2-body {
1886
+ flex: 1;
1887
+ display: flex;
1888
+ align-items: center;
1889
+ justify-content: center;
1890
+ }
1891
+
1892
+ .lp-chart-v2-svg {
1893
+ width: 100%;
1894
+ max-width: 900px;
1895
+ height: auto;
1896
+ }
1897
+
1898
+ .lp-chart-v2-grid {
1899
+ stroke: var(--lp-border);
1900
+ stroke-width: 1;
1901
+ }
1902
+
1903
+ .lp-chart-v2-axis-text {
1904
+ fill: var(--lp-secondary);
1905
+ font-size: 12px;
1906
+ font-family: var(--lp-font-mono);
1907
+ }
1908
+
1909
+ .lp-chart-v2-bar {
1910
+ opacity: 0.9;
1911
+ }
1912
+
1913
+ .lp-chart-v2-legend-text {
1914
+ fill: var(--lp-secondary);
1915
+ font-size: 12px;
1916
+ font-family: var(--lp-font-body);
1917
+ }
1918
+ .lp-gallery-v2 {
1919
+ width: 100%;
1920
+ height: 100%;
1921
+ padding: 80px;
1922
+ background: var(--lp-surface);
1923
+ display: flex;
1924
+ flex-direction: column;
1925
+ }
1926
+
1927
+ .lp-gallery-v2-header {
1928
+ margin-bottom: 40px;
1929
+ }
1930
+
1931
+ .lp-gallery-v2-grid {
1932
+ display: grid;
1933
+ grid-template-columns: repeat(3, 1fr);
1934
+ gap: 24px;
1935
+ flex: 1;
1936
+ align-content: start;
1937
+ }
1938
+
1939
+ .lp-gallery-v2-item {
1940
+ display: flex;
1941
+ flex-direction: column;
1942
+ gap: 10px;
1943
+ }
1944
+
1945
+ .lp-gallery-v2-item img,
1946
+ .lp-gallery-v2-placeholder {
1947
+ width: 100%;
1948
+ aspect-ratio: 16 / 10;
1949
+ object-fit: cover;
1950
+ border-radius: var(--lp-radius-medium);
1951
+ background: var(--lp-bg);
1952
+ border: 1px solid var(--lp-border);
1953
+ }
1954
+
1955
+ .lp-gallery-v2-caption {
1956
+ font-size: 14px;
1957
+ color: var(--lp-secondary);
1958
+ text-align: center;
1959
+ line-height: 1.4;
1960
+ }
package/src/warm-business/styles.css CHANGED
@@ -1772,3 +1772,181 @@ body {
1772
1772
  break-after: auto;
1773
1773
  }
1774
1774
  }
1775
+ .lp-testimonial-v2 {
1776
+ width: 100%;
1777
+ height: 100%;
1778
+ padding: 80px;
1779
+ background: var(--lp-surface);
1780
+ display: flex;
1781
+ align-items: center;
1782
+ justify-content: center;
1783
+ }
1784
+
1785
+ .lp-testimonial-v2-card {
1786
+ width: 100%;
1787
+ max-width: 900px;
1788
+ background: var(--lp-bg);
1789
+ border: 1px solid var(--lp-border);
1790
+ border-radius: var(--lp-radius-large);
1791
+ padding: 48px;
1792
+ position: relative;
1793
+ }
1794
+
1795
+ .lp-testimonial-v2-logo {
1796
+ position: absolute;
1797
+ top: 32px;
1798
+ right: 40px;
1799
+ height: 32px;
1800
+ max-width: 120px;
1801
+ object-fit: contain;
1802
+ }
1803
+
1804
+ .lp-testimonial-v2-company {
1805
+ position: absolute;
1806
+ top: 32px;
1807
+ right: 40px;
1808
+ font-size: 14px;
1809
+ font-weight: 600;
1810
+ color: var(--lp-secondary);
1811
+ text-transform: uppercase;
1812
+ letter-spacing: 0.05em;
1813
+ }
1814
+
1815
+ .lp-testimonial-v2-quote {
1816
+ margin: 32px 0 40px;
1817
+ }
1818
+
1819
+ .lp-testimonial-v2-quote blockquote {
1820
+ font-size: 32px;
1821
+ font-weight: 500;
1822
+ line-height: 1.4;
1823
+ color: var(--lp-text);
1824
+ margin: 0;
1825
+ padding: 0;
1826
+ }
1827
+
1828
+ .lp-testimonial-v2-footer {
1829
+ display: flex;
1830
+ align-items: flex-end;
1831
+ justify-content: space-between;
1832
+ gap: 24px;
1833
+ }
1834
+
1835
+ .lp-testimonial-v2-name {
1836
+ font-size: 18px;
1837
+ font-weight: 600;
1838
+ color: var(--lp-text);
1839
+ }
1840
+
1841
+ .lp-testimonial-v2-role {
1842
+ font-size: 14px;
1843
+ color: var(--lp-secondary);
1844
+ margin-top: 4px;
1845
+ }
1846
+
1847
+ .lp-testimonial-v2-metric {
1848
+ text-align: right;
1849
+ flex-shrink: 0;
1850
+ }
1851
+
1852
+ .lp-testimonial-v2-metric-value {
1853
+ font-size: 36px;
1854
+ font-weight: 700;
1855
+ color: var(--lp-accent);
1856
+ line-height: 1;
1857
+ }
1858
+
1859
+ .lp-testimonial-v2-metric-label {
1860
+ font-size: 13px;
1861
+ color: var(--lp-secondary);
1862
+ margin-top: 4px;
1863
+ }
1864
+ .lp-chart-v2 {
1865
+ width: 100%;
1866
+ height: 100%;
1867
+ padding: 80px;
1868
+ background: var(--lp-surface);
1869
+ display: flex;
1870
+ flex-direction: column;
1871
+ }
1872
+
1873
+ .lp-chart-v2-header {
1874
+ margin-bottom: 40px;
1875
+ }
1876
+
1877
+ .lp-chart-v2-body {
1878
+ flex: 1;
1879
+ display: flex;
1880
+ align-items: center;
1881
+ justify-content: center;
1882
+ }
1883
+
1884
+ .lp-chart-v2-svg {
1885
+ width: 100%;
1886
+ max-width: 900px;
1887
+ height: auto;
1888
+ }
1889
+
1890
+ .lp-chart-v2-grid {
1891
+ stroke: var(--lp-border);
1892
+ stroke-width: 1;
1893
+ }
1894
+
1895
+ .lp-chart-v2-axis-text {
1896
+ fill: var(--lp-secondary);
1897
+ font-size: 12px;
1898
+ font-family: var(--lp-font-mono);
1899
+ }
1900
+
1901
+ .lp-chart-v2-bar {
1902
+ opacity: 0.9;
1903
+ }
1904
+
1905
+ .lp-chart-v2-legend-text {
1906
+ fill: var(--lp-secondary);
1907
+ font-size: 12px;
1908
+ font-family: var(--lp-font-body);
1909
+ }
1910
+ .lp-gallery-v2 {
1911
+ width: 100%;
1912
+ height: 100%;
1913
+ padding: 80px;
1914
+ background: var(--lp-surface);
1915
+ display: flex;
1916
+ flex-direction: column;
1917
+ }
1918
+
1919
+ .lp-gallery-v2-header {
1920
+ margin-bottom: 40px;
1921
+ }
1922
+
1923
+ .lp-gallery-v2-grid {
1924
+ display: grid;
1925
+ grid-template-columns: repeat(3, 1fr);
1926
+ gap: 24px;
1927
+ flex: 1;
1928
+ align-content: start;
1929
+ }
1930
+
1931
+ .lp-gallery-v2-item {
1932
+ display: flex;
1933
+ flex-direction: column;
1934
+ gap: 10px;
1935
+ }
1936
+
1937
+ .lp-gallery-v2-item img,
1938
+ .lp-gallery-v2-placeholder {
1939
+ width: 100%;
1940
+ aspect-ratio: 16 / 10;
1941
+ object-fit: cover;
1942
+ border-radius: var(--lp-radius-medium);
1943
+ background: var(--lp-bg);
1944
+ border: 1px solid var(--lp-border);
1945
+ }
1946
+
1947
+ .lp-gallery-v2-caption {
1948
+ font-size: 14px;
1949
+ color: var(--lp-secondary);
1950
+ text-align: center;
1951
+ line-height: 1.4;
1952
+ }