@appartmint/mint 2.6.20 → 2.7.0

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 (17) hide show
  1. package/dist/css/mint.css +55 -43
  2. package/dist/css/mint.css.map +1 -1
  3. package/dist/css/mint.min.css +1 -1
  4. package/dist/css/mint.min.css.map +1 -1
  5. package/dist/js/imports/models/color.d.ts +0 -16
  6. package/dist/js/imports/models/color.d.ts.map +1 -1
  7. package/dist/js/imports/models/index.d.ts +1 -3
  8. package/dist/js/imports/models/index.d.ts.map +1 -1
  9. package/dist/js/imports/models/primitive.d.ts +3 -0
  10. package/dist/js/imports/models/primitive.d.ts.map +1 -0
  11. package/dist/js/index.js +15 -21
  12. package/dist/js/index.js.map +1 -1
  13. package/dist/js/index.min.js.map +1 -1
  14. package/package.json +1 -1
  15. package/src/scss/imports/components/widget/_card.scss +1 -0
  16. package/src/scss/imports/global/_grid.scss +34 -33
  17. package/src/scss/imports/global/_inputs.scss +14 -2
package/dist/css/mint.css CHANGED
@@ -1307,6 +1307,7 @@ p .mint-pill, p .mint-btn, :root:root p [amplify-button], p .mint-select {
1307
1307
  .mint-card-grid .mint-image img {
1308
1308
  height: 100%;
1309
1309
  object-fit: contain;
1310
+ object-position: top;
1310
1311
  }
1311
1312
  .mint-card-grid .mint-content, :root:root .mint-card-grid [data-amplify-authenticator] [data-amplify-container] [data-amplify-router], :root:root [data-amplify-authenticator] [data-amplify-container] .mint-card-grid [data-amplify-router] {
1312
1313
  justify-content: flex-end;
@@ -1860,10 +1861,13 @@ iframe {
1860
1861
  }
1861
1862
  @media (min-width: 768px) {
1862
1863
  .mint-grid.mint-2 {
1863
- grid-template-columns: repeat(2, 1fr);
1864
+ grid-template-columns: repeat(12, 1fr);
1865
+ }
1866
+ .mint-grid.mint-2 > * .mint-card {
1867
+ grid-column: span 6;
1864
1868
  }
1865
1869
  .mint-grid.mint-2 > :last-child:nth-child(odd) .mint-card {
1866
- grid-column: span 2;
1870
+ grid-column: span 12;
1867
1871
  width: 50%;
1868
1872
  margin-left: auto;
1869
1873
  margin-right: auto;
@@ -1871,10 +1875,13 @@ iframe {
1871
1875
  }
1872
1876
  @media (min-width: 768px) {
1873
1877
  .mint-grid.mint-3 {
1874
- grid-template-columns: repeat(2, 1fr);
1878
+ grid-template-columns: repeat(12, 1fr);
1879
+ }
1880
+ .mint-grid.mint-3 > * .mint-card {
1881
+ grid-column: span 6;
1875
1882
  }
1876
1883
  .mint-grid.mint-3 > :last-child:nth-child(odd) .mint-card {
1877
- grid-column: span 2;
1884
+ grid-column: span 12;
1878
1885
  width: 50%;
1879
1886
  margin-left: auto;
1880
1887
  margin-right: auto;
@@ -1882,28 +1889,34 @@ iframe {
1882
1889
  }
1883
1890
  @media (min-width: 1200px) {
1884
1891
  .mint-grid.mint-3 {
1885
- grid-template-columns: repeat(3, 1fr);
1892
+ grid-template-columns: repeat(12, 1fr);
1893
+ }
1894
+ .mint-grid.mint-3 > * .mint-card {
1895
+ grid-column: span 4;
1886
1896
  }
1887
1897
  .mint-grid.mint-3 > :last-child:nth-child(odd) .mint-card {
1888
- grid-column: span 1;
1898
+ grid-column: span 4;
1889
1899
  width: 100%;
1890
1900
  }
1891
1901
  .mint-grid.mint-3 > :last-child:nth-child(3n+1) .mint-card {
1892
- grid-column: 2;
1902
+ grid-column: 4/span 6;
1893
1903
  }
1894
1904
  .mint-grid.mint-3 > :last-child:nth-child(3n+2) .mint-card {
1895
- grid-column: 3;
1905
+ grid-column: 7/span 6;
1896
1906
  }
1897
1907
  .mint-grid.mint-3 > :nth-last-child(2):nth-child(3n+1) .mint-card {
1898
- grid-column: 1;
1908
+ grid-column: 1/span 6;
1899
1909
  }
1900
1910
  }
1901
1911
  @media (min-width: 768px) {
1902
1912
  .mint-grid.mint-4 {
1903
- grid-template-columns: repeat(2, 1fr);
1913
+ grid-template-columns: repeat(12, 1fr);
1914
+ }
1915
+ .mint-grid.mint-4 > * .mint-card {
1916
+ grid-column: span 6;
1904
1917
  }
1905
1918
  .mint-grid.mint-4 > :last-child:nth-child(odd) .mint-card {
1906
- grid-column: span 2;
1919
+ grid-column: span 12;
1907
1920
  width: 50%;
1908
1921
  margin-left: auto;
1909
1922
  margin-right: auto;
@@ -1911,59 +1924,53 @@ iframe {
1911
1924
  }
1912
1925
  @media (min-width: 1200px) {
1913
1926
  .mint-grid.mint-4 {
1914
- grid-template-columns: repeat(3, 1fr);
1927
+ grid-template-columns: repeat(12, 1fr);
1928
+ }
1929
+ .mint-grid.mint-4 > * .mint-card {
1930
+ grid-column: span 4;
1915
1931
  }
1916
1932
  .mint-grid.mint-4 > :last-child:nth-child(odd) .mint-card {
1917
- grid-column: span 1;
1933
+ grid-column: span 4;
1918
1934
  width: 100%;
1919
1935
  }
1920
1936
  .mint-grid.mint-4 > :last-child:nth-child(3n+1) .mint-card {
1921
- grid-column: 2;
1937
+ grid-column: 4/span 6;
1922
1938
  }
1923
1939
  .mint-grid.mint-4 > :last-child:nth-child(3n+2) .mint-card {
1924
- grid-column: 3;
1940
+ grid-column: 7/span 6;
1925
1941
  }
1926
1942
  .mint-grid.mint-4 > :nth-last-child(2):nth-child(3n+1) .mint-card {
1927
- grid-column: 1;
1943
+ grid-column: 1/span 6;
1928
1944
  }
1929
1945
  }
1930
1946
  @media (min-width: 1440px) {
1931
1947
  .mint-grid.mint-4 {
1932
- grid-template-columns: repeat(4, 1fr);
1948
+ grid-template-columns: repeat(12, 1fr);
1949
+ }
1950
+ .mint-grid.mint-4 > * .mint-card {
1951
+ grid-column: span 3;
1933
1952
  }
1934
1953
  .mint-grid.mint-4 > :last-child:nth-child(odd) .mint-card, .mint-grid.mint-4 > :last-child:nth-child(3n+1) .mint-card, .mint-grid.mint-4 > :last-child:nth-child(3n+2) .mint-card, .mint-grid.mint-4 > :nth-last-child(2):nth-child(3n+1) .mint-card {
1935
- grid-column: span 1;
1954
+ grid-column: span 3;
1936
1955
  width: 100%;
1937
1956
  }
1938
1957
  .mint-grid.mint-4 > :last-child:nth-child(4n+1) .mint-card {
1939
- grid-column: 2/span 2;
1940
- width: 50%;
1941
- margin-left: auto;
1942
- margin-right: auto;
1958
+ grid-column: 4/span 6;
1943
1959
  }
1944
1960
  .mint-grid.mint-4 > :last-child:nth-child(4n+2) .mint-card {
1945
- grid-column: 3/span 2;
1946
- width: 50%;
1947
- margin-left: auto;
1948
- margin-right: auto;
1961
+ grid-column: 7/span 6;
1949
1962
  }
1950
1963
  .mint-grid.mint-4 > :nth-last-child(2):nth-child(4n+1) .mint-card {
1951
- grid-column: 1/span 2;
1952
- width: 50%;
1953
- margin-left: auto;
1954
- margin-right: auto;
1964
+ grid-column: 1/span 6;
1955
1965
  }
1956
1966
  .mint-grid.mint-4 > :last-child:nth-child(4n+3) .mint-card {
1957
- grid-column: 4;
1967
+ grid-column: 9/span 4;
1958
1968
  }
1959
1969
  .mint-grid.mint-4 > :nth-last-child(2):nth-child(4n+2) .mint-card {
1960
- grid-column: 2/span 2;
1961
- width: 50%;
1962
- margin-left: auto;
1963
- margin-right: auto;
1970
+ grid-column: 5/span 4;
1964
1971
  }
1965
1972
  .mint-grid.mint-4 > :nth-last-child(3):nth-child(4n+1) .mint-card {
1966
- grid-column: 1;
1973
+ grid-column: 1/span 4;
1967
1974
  }
1968
1975
  }
1969
1976
  .mint-grid .mint-portrait {
@@ -1971,12 +1978,7 @@ iframe {
1971
1978
  }
1972
1979
  @media (min-width: 768px) {
1973
1980
  .mint-grid .mint-landscape {
1974
- grid-column: span 2;
1975
- }
1976
- }
1977
- @media (min-width: 1200px) {
1978
- .mint-grid .mint-landscape {
1979
- grid-column: span 3;
1981
+ grid-column: span 12;
1980
1982
  }
1981
1983
  }
1982
1984
 
@@ -2042,9 +2044,13 @@ textarea {
2042
2044
  filter: grayscale(0);
2043
2045
  }
2044
2046
  .mint-check [type=checkbox]:checked + span i {
2047
+ opacity: 0;
2048
+ }
2049
+ .mint-check [type=checkbox]:checked + span i:first-child {
2045
2050
  opacity: 1;
2046
2051
  }
2047
2052
  .mint-check [type=checkbox] + span {
2053
+ position: relative;
2048
2054
  display: flex;
2049
2055
  align-items: center;
2050
2056
  justify-content: center;
@@ -2060,10 +2066,16 @@ textarea {
2060
2066
  transition: filter 300ms, background-color 300ms, left 300ms;
2061
2067
  }
2062
2068
  .mint-check [type=checkbox] + span i {
2069
+ position: absolute;
2070
+ top: 50%;
2071
+ left: 50%;
2072
+ transform: translate(-50%, -50%);
2063
2073
  color: var(--mint-back);
2064
- opacity: 0;
2065
2074
  transition: opacity 300ms;
2066
2075
  }
2076
+ .mint-check [type=checkbox] + span i:first-child {
2077
+ opacity: 0;
2078
+ }
2067
2079
  .mint-check + span {
2068
2080
  width: 1.5rem;
2069
2081
  text-align: center;