@hanzo/design 0.5.18 → 0.5.20

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 +1 -1
  2. package/styles.css +19 -3
  3. package/tokens/base.css +7 -0
  4. package/tokens/fonts.css +12 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hanzo/design",
3
- "version": "0.5.18",
3
+ "version": "0.5.20",
4
4
  "packageManager": "pnpm@11.17.0",
5
5
  "description": "Hanzo Design System \u2014 monochrome, dark-default tokens + components + brand assets, the single source of truth for every Hanzo surface. CSS + typed programmatic tokens.",
6
6
  "license": "MIT OR Apache-2.0",
package/styles.css CHANGED
@@ -866,21 +866,30 @@
866
866
  bytes than the CSS-then-woff2 round trip.
867
867
 
868
868
  The url()s are relative to THIS file, so they resolve wherever the package is
869
- mounted — node_modules, a CDN, a copied dist — with no configuration. */
869
+ mounted — node_modules, a CDN, a copied dist — with no configuration.
870
+
871
+ `font-display: block`, NOT swap, and the difference is the whole brand. `swap`
872
+ paints the fallback IMMEDIATELY and repaints when the face lands, so every first
873
+ visit shows the platform's own sans for as long as the download takes — on Ubuntu
874
+ that is DejaVu, which looks nothing like us and is the single most common way a
875
+ Hanzo surface renders wrong. `block` holds the text invisible for a short period
876
+ (~3s) and then paints Zen, so the fallback is only ever reached when the face
877
+ genuinely fails to arrive. A held word is a moment; the wrong typeface is the
878
+ brand. The generic tail below stays for exactly that real-failure case. */
870
879
 
871
880
  @font-face{
872
881
  font-family:"Zen";
873
882
  src:url("./assets/fonts/Zen-Variable.woff2") format("woff2");
874
883
  font-weight:100 900;
875
884
  font-style:normal;
876
- font-display:swap;
885
+ font-display:block;
877
886
  }
878
887
  @font-face{
879
888
  font-family:"Zen Mono";
880
889
  src:url("./assets/fonts/ZenMono-Variable.woff2") format("woff2");
881
890
  font-weight:100 900;
882
891
  font-style:normal;
883
- font-display:swap;
892
+ font-display:block;
884
893
  }
885
894
 
886
895
  :root{
@@ -1113,6 +1122,13 @@
1113
1122
  :where(*)::-webkit-scrollbar-thumb{background:var(--white-15);border-radius:var(--radius-full)}
1114
1123
  :where(*)::-webkit-scrollbar-thumb:hover{background:var(--white-30)}
1115
1124
  :where(*)::-webkit-scrollbar-corner{background:transparent}
1125
+ /* The stepper arrows, and they are a LINUX defect specifically. Chromium on
1126
+ macOS draws no buttons, so styling the track and thumb looks finished there
1127
+ and ships a classic GTK scrollbar — a boxed arrow at each end of every
1128
+ scroller, on both axes — to everyone on Ubuntu. Styling the other pseudos
1129
+ does not suppress them; only this does. Zero width AND height because the
1130
+ horizontal and vertical bars each read one of them. */
1131
+ :where(*)::-webkit-scrollbar-button{display:none;width:0;height:0}
1116
1132
  .light :where(*)::-webkit-scrollbar-thumb{background:rgb(0 0 0 / .18)}
1117
1133
  .light :where(*)::-webkit-scrollbar-thumb:hover{background:rgb(0 0 0 / .32)}
1118
1134
  }
package/tokens/base.css CHANGED
@@ -217,6 +217,13 @@
217
217
  :where(*)::-webkit-scrollbar-thumb{background:var(--white-15);border-radius:var(--radius-full)}
218
218
  :where(*)::-webkit-scrollbar-thumb:hover{background:var(--white-30)}
219
219
  :where(*)::-webkit-scrollbar-corner{background:transparent}
220
+ /* The stepper arrows, and they are a LINUX defect specifically. Chromium on
221
+ macOS draws no buttons, so styling the track and thumb looks finished there
222
+ and ships a classic GTK scrollbar — a boxed arrow at each end of every
223
+ scroller, on both axes — to everyone on Ubuntu. Styling the other pseudos
224
+ does not suppress them; only this does. Zero width AND height because the
225
+ horizontal and vertical bars each read one of them. */
226
+ :where(*)::-webkit-scrollbar-button{display:none;width:0;height:0}
220
227
  .light :where(*)::-webkit-scrollbar-thumb{background:rgb(0 0 0 / .18)}
221
228
  .light :where(*)::-webkit-scrollbar-thumb:hover{background:rgb(0 0 0 / .32)}
222
229
  }
package/tokens/fonts.css CHANGED
@@ -26,21 +26,30 @@
26
26
  bytes than the CSS-then-woff2 round trip.
27
27
 
28
28
  The url()s are relative to THIS file, so they resolve wherever the package is
29
- mounted — node_modules, a CDN, a copied dist — with no configuration. */
29
+ mounted — node_modules, a CDN, a copied dist — with no configuration.
30
+
31
+ `font-display: block`, NOT swap, and the difference is the whole brand. `swap`
32
+ paints the fallback IMMEDIATELY and repaints when the face lands, so every first
33
+ visit shows the platform's own sans for as long as the download takes — on Ubuntu
34
+ that is DejaVu, which looks nothing like us and is the single most common way a
35
+ Hanzo surface renders wrong. `block` holds the text invisible for a short period
36
+ (~3s) and then paints Zen, so the fallback is only ever reached when the face
37
+ genuinely fails to arrive. A held word is a moment; the wrong typeface is the
38
+ brand. The generic tail below stays for exactly that real-failure case. */
30
39
 
31
40
  @font-face{
32
41
  font-family:"Zen";
33
42
  src:url("../assets/fonts/Zen-Variable.woff2") format("woff2");
34
43
  font-weight:100 900;
35
44
  font-style:normal;
36
- font-display:swap;
45
+ font-display:block;
37
46
  }
38
47
  @font-face{
39
48
  font-family:"Zen Mono";
40
49
  src:url("../assets/fonts/ZenMono-Variable.woff2") format("woff2");
41
50
  font-weight:100 900;
42
51
  font-style:normal;
43
- font-display:swap;
52
+ font-display:block;
44
53
  }
45
54
 
46
55
  :root{