Self-host VictorMono Nerd Font icons for the terminal + editor
- Add Symbols-Only Nerd Font Mono (woff2) under public/fonts; @font-face scoped by unicode-range to the Nerd Font glyph ranges, so the ~1.1MB file only loads when an icon actually renders (latin text stays on Victor Mono) - Terminal + editor font stacks fall back to it for icons; terminal prewarms it and repaints so powerline/oh-my-posh/eza/nvim icons show - No server/env changes; ships in the spoon-next image (public/)
This commit is contained in:
@@ -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 *));
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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(
|
||||
|
||||
Reference in New Issue
Block a user