9dc202053c
- Added category 'Audio/Video' to module.json to fix 'Non répertorié' issue - Created styles/tokens/_spacing.less with spacing tokens (xxs, xs, sm, md, lg, xl, 2xl) - Added legacy aliases (--sp-space-xs, --sp-space-sm, --sp-space-m, etc.) for preset-import-export.less - Added --sp-bg and --sp-surface-elevated tokens to _base.less - Fixed _player-privacy-panel.less to use CSS custom properties instead of LESS variables - Added background: var(--sp-surface) to all dialog root elements: - PlayerPrivacyPanel - PresetSaveDialog - PresetLoadDialog - DirectorsBoard - PresetImport/Export dialogs - Added _spacing.less import to scrying-pool.less - Rebuilt CSS (dist/styles/scrying-pool.css) This fixes: 1. Transparent dialogs (now have proper background colors) 2. Missing spacing tokens (caused build errors) 3. Module category (now shows as 'Audio/Video' instead of 'Uncategorized') All 900 unit tests passing. Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
64 lines
2.6 KiB
Plaintext
64 lines
2.6 KiB
Plaintext
/**
|
|
* styles/tokens/_base.less
|
|
*
|
|
* Layer 1 — SP Semantic Alias Tokens
|
|
*
|
|
* Thin alias layer mapping to Foundry CSS tokens in one place.
|
|
* If Foundry renames or shifts token semantics between versions,
|
|
* only this layer needs updating.
|
|
*
|
|
* RULE: All Foundry --color-* / --font-* / --border-* tokens are FORBIDDEN
|
|
* inside .scrying-pool CSS. Always use --sp-* aliases. This is the sole
|
|
* enforcement point for the semantic layer.
|
|
*
|
|
* Every token includes a hardcoded fallback for environments where the
|
|
* upstream Foundry token is absent.
|
|
*/
|
|
|
|
:root {
|
|
/* Surface & structure */
|
|
--sp-bg: var(--sp-theme-bg, var(--color-bg, hsl(220, 15%, 12%)));
|
|
--sp-surface: var(--sp-theme-surface, var(--color-bg-option, #141618));
|
|
--sp-surface-raised: var(--sp-theme-surface-raised, #1c1f22);
|
|
--sp-surface-elevated: var(--sp-theme-surface-elevated, var(--sp-surface-raised, #1c1f22));
|
|
--sp-border: var(--sp-theme-border, var(--color-border, #282c30));
|
|
|
|
/* Typography */
|
|
--sp-text-primary: var(--sp-theme-text-primary, var(--color-text-primary, #dde2e8));
|
|
--sp-text-secondary: var(--sp-theme-text-secondary,var(--color-text-secondary, #7a8390));
|
|
--sp-text-muted: var(--sp-theme-text-muted, #555d66);
|
|
|
|
/* Accent & interaction */
|
|
--sp-accent: var(--sp-theme-accent, var(--color-warm-2, #4a9e6b));
|
|
--sp-surface-interactive: var(--sp-theme-interactive, #242830);
|
|
--sp-control-bg: var(--sp-theme-control, #1a1d20);
|
|
|
|
/* Focus ring — module-wide keyboard navigation anchor */
|
|
--sp-focus: var(--sp-theme-focus, var(--color-focus-outline, #63c287));
|
|
--sp-focus-ring: 0 0 0 2px var(--sp-focus);
|
|
|
|
/* Badge */
|
|
--sp-badge-bg: rgba(0, 0, 0, 0.72);
|
|
--sp-badge-text: var(--sp-text-primary);
|
|
|
|
/* Background operations = no toast ever (silent by design) */
|
|
}
|
|
|
|
/* Theme overrides — dark theme defaults */
|
|
.scrying-pool,
|
|
:root[data-color-scheme="dark"] {
|
|
--sp-theme-bg: hsl(220, 15%, 12%);
|
|
--sp-theme-surface: #141618;
|
|
--sp-theme-surface-raised: #1c1f22;
|
|
--sp-theme-surface-elevated: #1c1f22;
|
|
--sp-theme-border: #282c30;
|
|
--sp-theme-text-primary: #dde2e8;
|
|
--sp-theme-text-secondary: #7a8390;
|
|
--sp-theme-text-muted: #555d66;
|
|
--sp-theme-accent: #4a9e6b;
|
|
--sp-theme-interactive: #242830;
|
|
--sp-theme-control: #1a1d20;
|
|
--sp-theme-focus: #63c287;
|
|
--sp-theme-urgency: #c8982a;
|
|
}
|