@seed-design/css 1.2.8 → 1.2.10

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 (26) hide show
  1. package/all.css +10 -9
  2. package/all.layered.css +10 -9
  3. package/all.layered.min.css +1 -1
  4. package/all.min.css +1 -1
  5. package/package.json +1 -1
  6. package/recipes/app-bar-main.css +6 -6
  7. package/recipes/app-bar-main.layered.css +6 -6
  8. package/recipes/content-placeholder.css +1 -1
  9. package/recipes/content-placeholder.layered.css +1 -1
  10. package/recipes/notification-badge.css +3 -2
  11. package/recipes/notification-badge.layered.css +3 -2
  12. package/vars/component/checkmark.d.ts +0 -2
  13. package/vars/component/content-placeholder.d.ts +1 -1
  14. package/vars/component/content-placeholder.mjs +1 -1
  15. package/vars/component/index.d.ts +2 -0
  16. package/vars/component/index.mjs +2 -0
  17. package/vars/component/notification-badge.d.ts +5 -4
  18. package/vars/component/notification-badge.mjs +3 -2
  19. package/vars/component/radiomark.d.ts +0 -3
  20. package/vars/component/switchmark.d.ts +0 -3
  21. package/vars/component/top-navigation-icon-button.d.ts +36 -0
  22. package/vars/component/top-navigation-icon-button.mjs +36 -0
  23. package/vars/component/top-navigation-text-button.d.ts +43 -0
  24. package/vars/component/top-navigation-text-button.mjs +43 -0
  25. package/vars/component/top-navigation.d.ts +23 -21
  26. package/vars/component/top-navigation.mjs +22 -21
package/all.css CHANGED
@@ -1860,21 +1860,21 @@
1860
1860
  }
1861
1861
 
1862
1862
  .seed-app-bar-main__title--layout_titleOnly {
1863
- font-size: var(--seed-font-size-t6-static);
1863
+ font-size: clamp(calc(var(--seed-font-size-t6-static) * 1), var(--seed-font-size-t6), calc(var(--seed-font-size-t6-static) * 1.2));
1864
1864
  font-weight: var(--seed-font-weight-bold);
1865
- line-height: var(--seed-line-height-t6-static);
1865
+ line-height: clamp(calc(var(--seed-line-height-t6-static) * 1), var(--seed-line-height-t6), calc(var(--seed-line-height-t6-static) * 1.2));
1866
1866
  }
1867
1867
 
1868
1868
  .seed-app-bar-main__title--layout_withSubtitle {
1869
- font-size: var(--seed-font-size-t5-static);
1869
+ font-size: clamp(calc(var(--seed-font-size-t5-static) * 1), var(--seed-font-size-t5), calc(var(--seed-font-size-t5-static) * 1.2));
1870
1870
  font-weight: var(--seed-font-weight-bold);
1871
- line-height: var(--seed-line-height-t5-static);
1871
+ line-height: clamp(calc(var(--seed-line-height-t5-static) * 1), var(--seed-line-height-t5), calc(var(--seed-line-height-t5-static) * 1.2));
1872
1872
  }
1873
1873
 
1874
1874
  .seed-app-bar-main__subtitle--layout_withSubtitle {
1875
- font-size: var(--seed-font-size-t2-static);
1875
+ font-size: clamp(calc(var(--seed-font-size-t2-static) * 1), var(--seed-font-size-t2), calc(var(--seed-font-size-t2-static) * 1.2));
1876
1876
  font-weight: var(--seed-font-weight-regular);
1877
- line-height: var(--seed-line-height-t2-static);
1877
+ line-height: clamp(calc(var(--seed-line-height-t2-static) * 1), var(--seed-line-height-t2), calc(var(--seed-line-height-t2-static) * 1.2));
1878
1878
  }
1879
1879
 
1880
1880
  .seed-app-bar-main__root--theme_cupertino {
@@ -4115,7 +4115,7 @@
4115
4115
  min-width: var(--seed-dimension-x4);
4116
4116
  aspect-ratio: 1;
4117
4117
  width: auto;
4118
- max-width: 64px;
4118
+ max-width: 160px;
4119
4119
  color: var(--seed-color-palette-gray-400);
4120
4120
  fill: currentColor;
4121
4121
  stroke: currentColor;
@@ -6204,11 +6204,12 @@
6204
6204
 
6205
6205
  .seed-notification-badge--size_large {
6206
6206
  border-radius: var(--seed-radius-full);
6207
+ min-width: 18px;
6207
6208
  min-height: 18px;
6208
6209
  padding-left: var(--seed-dimension-x1);
6209
6210
  padding-right: var(--seed-dimension-x1);
6210
- font-size: var(--seed-font-size-t1);
6211
- line-height: var(--seed-line-height-t1);
6211
+ font-size: var(--seed-font-size-t1-static);
6212
+ line-height: var(--seed-line-height-t1-static);
6212
6213
  font-weight: var(--seed-font-weight-bold);
6213
6214
  padding-top: 0;
6214
6215
  padding-bottom: 0;
package/all.layered.css CHANGED
@@ -1961,21 +1961,21 @@
1961
1961
  }
1962
1962
 
1963
1963
  .seed-app-bar-main__title--layout_titleOnly {
1964
- font-size: var(--seed-font-size-t6-static);
1964
+ font-size: clamp(calc(var(--seed-font-size-t6-static) * 1), var(--seed-font-size-t6), calc(var(--seed-font-size-t6-static) * 1.2));
1965
1965
  font-weight: var(--seed-font-weight-bold);
1966
- line-height: var(--seed-line-height-t6-static);
1966
+ line-height: clamp(calc(var(--seed-line-height-t6-static) * 1), var(--seed-line-height-t6), calc(var(--seed-line-height-t6-static) * 1.2));
1967
1967
  }
1968
1968
 
1969
1969
  .seed-app-bar-main__title--layout_withSubtitle {
1970
- font-size: var(--seed-font-size-t5-static);
1970
+ font-size: clamp(calc(var(--seed-font-size-t5-static) * 1), var(--seed-font-size-t5), calc(var(--seed-font-size-t5-static) * 1.2));
1971
1971
  font-weight: var(--seed-font-weight-bold);
1972
- line-height: var(--seed-line-height-t5-static);
1972
+ line-height: clamp(calc(var(--seed-line-height-t5-static) * 1), var(--seed-line-height-t5), calc(var(--seed-line-height-t5-static) * 1.2));
1973
1973
  }
1974
1974
 
1975
1975
  .seed-app-bar-main__subtitle--layout_withSubtitle {
1976
- font-size: var(--seed-font-size-t2-static);
1976
+ font-size: clamp(calc(var(--seed-font-size-t2-static) * 1), var(--seed-font-size-t2), calc(var(--seed-font-size-t2-static) * 1.2));
1977
1977
  font-weight: var(--seed-font-weight-regular);
1978
- line-height: var(--seed-line-height-t2-static);
1978
+ line-height: clamp(calc(var(--seed-line-height-t2-static) * 1), var(--seed-line-height-t2), calc(var(--seed-line-height-t2-static) * 1.2));
1979
1979
  }
1980
1980
 
1981
1981
  .seed-app-bar-main__root--theme_cupertino {
@@ -4216,7 +4216,7 @@
4216
4216
  min-width: var(--seed-dimension-x4);
4217
4217
  aspect-ratio: 1;
4218
4218
  width: auto;
4219
- max-width: 64px;
4219
+ max-width: 160px;
4220
4220
  color: var(--seed-color-palette-gray-400);
4221
4221
  fill: currentColor;
4222
4222
  stroke: currentColor;
@@ -6305,11 +6305,12 @@
6305
6305
 
6306
6306
  .seed-notification-badge--size_large {
6307
6307
  border-radius: var(--seed-radius-full);
6308
+ min-width: 18px;
6308
6309
  min-height: 18px;
6309
6310
  padding-left: var(--seed-dimension-x1);
6310
6311
  padding-right: var(--seed-dimension-x1);
6311
- font-size: var(--seed-font-size-t1);
6312
- line-height: var(--seed-line-height-t1);
6312
+ font-size: var(--seed-font-size-t1-static);
6313
+ line-height: var(--seed-line-height-t1-static);
6313
6314
  font-weight: var(--seed-font-weight-bold);
6314
6315
  padding-top: 0;
6315
6316
  padding-bottom: 0;