Implement M1.5 visual design foundation: tokens, IBM Plex, theme toggle, chart themes

This commit is contained in:
2026-06-05 01:29:10 +03:00
parent 547edb85e4
commit 22f0556ef8
31 changed files with 713 additions and 136 deletions
+6 -10
View File
@@ -1,18 +1,14 @@
import { createRoot } from 'react-dom/client';
import { App } from './app/App';
import { initApp } from './app/orchestration/startup';
import { useAppStore } from './app/stores/AppStore';
import { initTheme, wireTheme } from './app/orchestration/theme';
import '../styles/base.css';
// Mirror the UI theme onto <html data-theme>: apply the initial value before
// first paint, then keep it in sync. (Store stays DOM-free; the adapter is here.)
const applyTheme = (theme: string) => {
document.documentElement.dataset.theme = theme;
};
applyTheme(useAppStore.getState().uiTheme);
useAppStore.subscribe((state, prev) => {
if (state.uiTheme !== prev.uiTheme) applyTheme(state.uiTheme);
});
// Hydrate the persisted theme onto <html data-theme> before first paint (no
// FOUC), then keep store ↔ DOM ↔ localStorage in sync. Store stays DOM-free;
// all browser access funnels through the orchestration + adapter.
initTheme();
wireTheme();
// Load the library from IndexedDB (seeding a sample on first run) and wire
// persistence. Fire-and-forget: the UI renders immediately and fills in when