@squadbase/vantage 0.6.2-dev1.d7c0911 → 0.6.2-dev1.e30f2cc

package/theme.css

@@ -1,6 +1,6 @@
 /* GENERATED by scripts/gen-theme.mjs — do not edit. Sources:
  *   packages/squadkit/registry/theme/theme.css (UI part tokens)
- *   packages/vantage/src/theme/framework.css   (slide / document styles) */
+ *   packages/squadkit/theme/slide-doc.css         (slide / document styles) */
 
 /**
  * Vantage design tokens. Imported after `@import "tailwindcss"` by the
@@ -38,7 +38,7 @@
   --accent-foreground: oklch(0.25 0.02 260);
   --destructive: oklch(0.53 0.21 27.325);
   --destructive-foreground: oklch(0.985 0 0);
-  --border: oklch(0.915 0.008 255);
+  --border: oklch(0.93 0.006 255);
   --input: oklch(0.9 0.01 255);
   --ring: oklch(0.7 0.12 262);
   --radius: 0.5rem;
@@ -52,16 +52,20 @@
      Latin system faces carry no kana/kanji, so without Japanese families here the
      browser picks a per-locale fallback (lang="en" -> e.g. thin "Yu Gothic" Regular
      on Windows, or a face without a 500 weight on macOS) and kana render thin.
-     List the Japanese system faces explicitly, after the Latin ones. */
+     List the Japanese system faces explicitly, after the Latin ones, and keep
+     `ui-sans-serif` / `system-ui` behind them: on Japanese Windows both resolve to
+     the menu font, Yu Gothic UI, which is condensed (made to avoid UI resizing)
+     and has kana, so it would take the kana before Meiryo is ever reached.
+     `-apple-system` is Safari/Firefox; Chrome on macOS needs `BlinkMacSystemFont`. */
   --font-sans:
-    ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", Meiryo,
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, ui-sans-serif, system-ui,
     sans-serif;
 
   --chart-1: oklch(0.55 0.2 262);
-  --chart-2: oklch(0.7 0.14 215);
-  --chart-3: oklch(0.6 0.23 295);
-  --chart-4: oklch(0.63 0.24 330);
-  --chart-5: oklch(0.78 0.19 125);
+  --chart-2: oklch(0.62 0.17 118);
+  --chart-3: oklch(0.5 0.19 352);
+  --chart-4: oklch(0.62 0.1 195);
+  --chart-5: oklch(0.44 0.18 300);
 
   /* Semantic status tokens — see the contract above the `@theme inline` block. */
   --positive: oklch(0.52 0.14 150);
@@ -111,16 +115,16 @@
   --accent: oklch(0.3 0.02 262);
   --accent-foreground: oklch(0.96 0.005 255);
   --destructive: oklch(0.704 0.191 22.216);
-  --destructive-foreground: oklch(0.985 0 0);
+  --destructive-foreground: oklch(0.145 0.02 262);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
   --ring: oklch(0.6 0.15 262);
 
-  --chart-1: oklch(0.55 0.2 262);
-  --chart-2: oklch(0.76 0.14 215);
-  --chart-3: oklch(0.68 0.2 295);
-  --chart-4: oklch(0.7 0.22 330);
-  --chart-5: oklch(0.82 0.18 125);
+  --chart-1: oklch(0.56 0.19 262);
+  --chart-2: oklch(0.75 0.17 118);
+  --chart-3: oklch(0.64 0.19 352);
+  --chart-4: oklch(0.78 0.105 195);
+  --chart-5: oklch(0.71 0.17 300);
 
   --positive: oklch(0.76 0.15 150);
   --positive-subtle: oklch(0.27 0.05 150);
@@ -141,7 +145,7 @@
   --sidebar: oklch(0.2 0.014 262);
   --sidebar-foreground: oklch(0.96 0.005 255);
   --sidebar-primary: oklch(0.68 0.19 262);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-primary-foreground: oklch(0.145 0.02 262);
   --sidebar-accent: oklch(0.3 0.02 262);
   --sidebar-accent-foreground: oklch(0.96 0.005 255);
   --sidebar-border: oklch(1 0 0 / 10%);
@@ -158,7 +162,8 @@
                       text or icons — use --<tone>. Same lightness step from the page in both
                       modes (light 0.62 / dark 0.56: ~0.36-0.40 OKLCH L away from --background,
                       >= 3:1 against --background and --card), so a fill is never strong in one
-                      mode and faint in the other. Presets do not override it.
+                      mode and faint in the other. Presets may tune hue and chroma within the
+                      status bands while preserving contrast and fill strength (tests/theme-presets.test.ts).
                       --warning-fill is the exception: amber (light 0.79 / dark 0.73, ~#f5b324 / ~#d99a1e) is
                       a light colour by nature, so it is ~2:1 on the light page (still >= 0.18 L away)
                       and ~7-8:1 on the dark one; dark text (--foreground in light, --background in dark) sits on it at >= 4.5:1.
@@ -355,17 +360,20 @@
 /**
  * Vantage framework styles: the slide / document tokens and the document
  * typesetting. The UI parts' tokens live in SquadKit
- * (packages/squadkit/registry/theme/theme.css); scripts/gen-theme.mjs appends
- * this file to them to produce packages/vantage/theme.css.
+ * (packages/squadkit/registry/theme/theme.css); packages/vantage/scripts/gen-theme.mjs
+ * appends this file to them to produce packages/vantage/theme.css.
  */
 
 :root {
   /* Slides (@squadbase/vantage/slide).
-     These are aliases, not values. Custom properties resolve lazily, so
+     These are aliases, not values. A var() in a custom property is resolved
+     on the element that declares it and inherited as that result, so
      pointing them at the tokens above is enough for a deck to follow `.dark`
-     and `[data-theme="dark"]` on its own — restating them in the dark block
-     below would create two places to keep in step for no gain. A deck
-     overrides any of them inline through `<SlideDeck theme>`. */
+     and `[data-theme="dark"]` set on :root — restating them in the dark block
+     below would create two places to keep in step for no gain. Tokens
+     overridden on a descendant (a scoped theme) do not reach them: re-declare
+     the aliases there. A deck overrides any of them inline through
+     `<SlideDeck theme>`. */
   --slide-bg: var(--background);
   --slide-fg: var(--foreground);
   --slide-accent: var(--primary);
@@ -376,8 +384,8 @@
      but webfonts must be inlined — so a system default is what makes the
      common path export correctly with nothing embedded. */
   --slide-font-display:
-    system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo,
-    sans-serif;
+    -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo,
+    system-ui, sans-serif;
   --slide-font-body: var(--slide-font-display);
   /* Canvas pixels, on the 1920x1080 canvas — not rem: a slide is scaled as a
      whole, so its type must not also follow the browser's root font size. */