feat: add selectable interface and code fonts (10 for each)

Adds separate UI and code font choices in settings
Applies font changes immediately
Lazy-loads selected remote fonts
This commit is contained in:
Bohdan Triapitsyn
2026-04-26 18:48:43 +03:00
parent a3b300f7a9
commit 799998c5f8
15 changed files with 356 additions and 4 deletions
+3
View File
@@ -43,6 +43,7 @@ import { useSync } from '@/sync/use-sync';
import { setOptimisticRefs } from '@/sync/session-actions';
import { useFontPreferences } from '@/hooks/useFontPreferences';
import { CODE_FONT_OPTION_MAP, DEFAULT_MONO_FONT, DEFAULT_UI_FONT, UI_FONT_OPTION_MAP } from '@/lib/fontOptions';
import { loadMonoFont, loadUiFont } from '@/lib/fontLoader';
import { ConfigUpdateOverlay } from '@/components/ui/ConfigUpdateOverlay';
import { AboutDialog } from '@/components/ui/AboutDialog';
import { RuntimeAPIProvider } from '@/contexts/RuntimeAPIProvider';
@@ -269,6 +270,8 @@ function App({ apis }: AppProps) {
const root = document.documentElement;
const uiStack = UI_FONT_OPTION_MAP[uiFont]?.stack ?? UI_FONT_OPTION_MAP[DEFAULT_UI_FONT].stack;
const monoStack = CODE_FONT_OPTION_MAP[monoFont]?.stack ?? CODE_FONT_OPTION_MAP[DEFAULT_MONO_FONT].stack;
void loadUiFont(uiFont);
void loadMonoFont(monoFont);
root.style.setProperty('--font-sans', uiStack);
root.style.setProperty('--font-heading', uiStack);