diff --git a/apps/next/public/fonts/SymbolsNerdFontMono.woff2 b/apps/next/public/fonts/SymbolsNerdFontMono.woff2 new file mode 100644 index 0000000..1a0fbd3 Binary files /dev/null and b/apps/next/public/fonts/SymbolsNerdFontMono.woff2 differ diff --git a/apps/next/src/app/styles.css b/apps/next/src/app/styles.css index cb0964d..25220c3 100644 --- a/apps/next/src/app/styles.css +++ b/apps/next/src/app/styles.css @@ -2,6 +2,22 @@ @import 'tw-animate-css'; @import '@spoon/tailwind-config/theme'; +/* + * Nerd Font icons for the workspace terminal + editor. Scoped to the Nerd Font + * glyph ranges via unicode-range, so the ~1MB file is only fetched when an icon + * actually renders (latin text stays on Victor Mono). Used as a fallback in the + * terminal/editor font stacks. + */ +@font-face { + font-family: 'Symbols Nerd Font Mono'; + font-style: normal; + font-weight: 100 900; + font-display: swap; + src: url('/fonts/SymbolsNerdFontMono.woff2') format('woff2'); + unicode-range: + U+23fb-23fe, U+2665, U+26a1, U+2b58, U+e000-f8ff, U+f0000-fffff; +} + @source '../../../../packages/ui/src/**/*.{ts,tsx}'; @custom-variant dark (&:where(.dark, .dark *)); diff --git a/apps/next/src/components/agent-workspace/code-editor.tsx b/apps/next/src/components/agent-workspace/code-editor.tsx index f5f5384..0d08315 100644 --- a/apps/next/src/components/agent-workspace/code-editor.tsx +++ b/apps/next/src/components/agent-workspace/code-editor.tsx @@ -20,7 +20,7 @@ const MonacoEditor = dynamic(async () => await import('@monaco-editor/react'), { }); const EDITOR_FONT_FAMILY = - "var(--font-victor-mono), 'Geist Mono', ui-monospace, SFMono-Regular, monospace"; + "var(--font-victor-mono), 'Symbols Nerd Font Mono', 'Geist Mono', ui-monospace, SFMono-Regular, monospace"; type MonacoEditorInstance = { getModel?: () => unknown; diff --git a/apps/next/src/components/agent-workspace/workspace-terminal.tsx b/apps/next/src/components/agent-workspace/workspace-terminal.tsx index 8d5852a..aee45bf 100644 --- a/apps/next/src/components/agent-workspace/workspace-terminal.tsx +++ b/apps/next/src/components/agent-workspace/workspace-terminal.tsx @@ -9,7 +9,7 @@ import { Button } from '@spoon/ui'; import '@xterm/xterm/css/xterm.css'; const TERMINAL_FONT = - "var(--font-victor-mono), 'Geist Mono', ui-monospace, monospace"; + "var(--font-victor-mono), 'Symbols Nerd Font Mono', 'Geist Mono', ui-monospace, monospace"; type Status = 'connecting' | 'connected' | 'closed' | 'error' | 'unconfigured'; @@ -146,6 +146,15 @@ export const WorkspaceTerminal = ({ fit.fit(); termRef.current = term; + // Pull in the Nerd Font icon glyphs (loaded lazily by unicode-range) and + // repaint once ready so powerline/oh-my-posh/eza icons render. + void document.fonts + .load("16px 'Symbols Nerd Font Mono'", '\ue0b0') + .then(() => { + if (!isAborted()) term.refresh(0, term.rows - 1); + }) + .catch(() => undefined); + const sendResize = () => { if (ws?.readyState !== WebSocket.OPEN) return; ws.send(