From 1c09530fe27c1f77fcd1b1fa4217199a3b574437 Mon Sep 17 00:00:00 2001 From: Logan Nguyen Date: Tue, 12 May 2026 19:14:41 -0500 Subject: [PATCH 1/3] feat(ui): replace Inter + Source Serif 4 with Nunito as sole typeface Signed-off-by: Logan Nguyen --- bun.lock | 3 +++ package.json | 1 + src/App.css | 24 ++++++++++++------------ src/components/ChatBubble.tsx | 2 +- 4 files changed, 17 insertions(+), 13 deletions(-) diff --git a/bun.lock b/bun.lock index d7f64b1..5616f10 100644 --- a/bun.lock +++ b/bun.lock @@ -5,6 +5,7 @@ "": { "name": "thuki", "dependencies": { + "@fontsource/nunito": "^5.2.7", "@fontsource/source-serif-4": "^5.2.9", "@tauri-apps/api": "^2.11.0", "framer-motion": "^12.38.0", @@ -134,6 +135,8 @@ "@exodus/bytes": ["@exodus/bytes@1.15.0", "", { "peerDependencies": { "@noble/hashes": "^1.8.0 || ^2.0.0" }, "optionalPeers": ["@noble/hashes"] }, "sha512-UY0nlA+feH81UGSHv92sLEPLCeZFjXOuHhrIo0HQydScuQc8s0A7kL/UdgwgDq8g8ilksmuoF35YVTNphV2aBQ=="], + "@fontsource/nunito": ["@fontsource/nunito@5.2.7", "", {}, "sha512-pmtBq0H9ex9nk+RtJYEJOD9pag393iHETnl/PVKleF4i06cd0ttngK5ZCTgYb5eOqR3Xdlrjtev8m7bmgYprew=="], + "@fontsource/source-serif-4": ["@fontsource/source-serif-4@5.2.9", "", {}, "sha512-er/Pym9emsEVJNf947umJ4kXarXfsiN6CN7kTYinefKRaHLwiquiiHOZvKvxWgkV8JMCf3pV3g0NcsPFpVCH9w=="], "@humanfs/core": ["@humanfs/core@0.19.1", "", {}, "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA=="], diff --git a/package.json b/package.json index a3b8a44..3a5dbca 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "validate-build": "bun run lint && bun run format:check && bun run typecheck && bun run build:all" }, "dependencies": { + "@fontsource/nunito": "^5.2.7", "@fontsource/source-serif-4": "^5.2.9", "@tauri-apps/api": "^2.11.0", "framer-motion": "^12.38.0", diff --git a/src/App.css b/src/App.css index e2dbf5d..b00d3de 100644 --- a/src/App.css +++ b/src/App.css @@ -3,13 +3,15 @@ @import 'streamdown/styles.css'; @import 'katex/dist/katex.min.css'; -/* Source Serif 4 reading face for AI prose. Chrome stays Inter. */ -@import '@fontsource/source-serif-4/400.css'; -@import '@fontsource/source-serif-4/400-italic.css'; +/* Nunito: single typeface for both UI chrome and AI prose. */ +@import '@fontsource/nunito/400.css'; +@import '@fontsource/nunito/500.css'; +@import '@fontsource/nunito/600.css'; +@import '@fontsource/nunito/700.css'; @theme { --font-sans: - 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, + 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; /* Brand palette - single source of truth for all color decisions */ @@ -190,16 +192,14 @@ body { display: none; } -/* AI prose reading face: serif body, warm cream, looser leading. Scoped to - * .markdown-body so UI chrome (labels, buttons, search trace) stays Inter. - * User bubble renders via renderUserContent, not MarkdownRenderer. - */ +/* AI prose: warm cream, looser leading. Scoped to .markdown-body so UI chrome stays separate. */ .markdown-body { - font-family: 'Source Serif 4', Charter, 'Iowan Old Style', Georgia, serif; - color: #efe3cc; - font-size: 15.5px; - line-height: 1.65; + font-family: var(--font-sans); + color: #fbe8c6; + font-size: 16.5px; + line-height: 1.6; letter-spacing: 0.3px; + font-weight: 600; } /* ─── Markdown Body: Prose Defaults ─── diff --git a/src/components/ChatBubble.tsx b/src/components/ChatBubble.tsx index dace946..f66fc82 100644 --- a/src/components/ChatBubble.tsx +++ b/src/components/ChatBubble.tsx @@ -430,7 +430,7 @@ export function ChatBubble({ )} {content && ( - + {renderUserContent(content)} )} From 5cd86de15cf06ab41500c67dec5f8d18fdfcf6fd Mon Sep 17 00:00:00 2001 From: Logan Nguyen Date: Tue, 12 May 2026 21:59:47 -0500 Subject: [PATCH 2/3] chore(ui): remove Inter and Source Serif 4 remnants Signed-off-by: Logan Nguyen --- bun.lock | 3 --- package.json | 1 - src/view/onboarding/IntroStep.tsx | 2 +- src/view/onboarding/ModelCheckStep.tsx | 2 +- src/view/onboarding/PermissionsStep.tsx | 4 ++-- 5 files changed, 4 insertions(+), 8 deletions(-) diff --git a/bun.lock b/bun.lock index 5616f10..7406989 100644 --- a/bun.lock +++ b/bun.lock @@ -6,7 +6,6 @@ "name": "thuki", "dependencies": { "@fontsource/nunito": "^5.2.7", - "@fontsource/source-serif-4": "^5.2.9", "@tauri-apps/api": "^2.11.0", "framer-motion": "^12.38.0", "katex": "^0.16.0", @@ -137,8 +136,6 @@ "@fontsource/nunito": ["@fontsource/nunito@5.2.7", "", {}, "sha512-pmtBq0H9ex9nk+RtJYEJOD9pag393iHETnl/PVKleF4i06cd0ttngK5ZCTgYb5eOqR3Xdlrjtev8m7bmgYprew=="], - "@fontsource/source-serif-4": ["@fontsource/source-serif-4@5.2.9", "", {}, "sha512-er/Pym9emsEVJNf947umJ4kXarXfsiN6CN7kTYinefKRaHLwiquiiHOZvKvxWgkV8JMCf3pV3g0NcsPFpVCH9w=="], - "@humanfs/core": ["@humanfs/core@0.19.1", "", {}, "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA=="], "@humanfs/node": ["@humanfs/node@0.16.7", "", { "dependencies": { "@humanfs/core": "^0.19.1", "@humanwhocodes/retry": "^0.4.0" } }, "sha512-/zUx+yOsIrG4Y43Eh2peDeKCxlRt/gET6aHfaKpuq267qXdYDFViVHfMaLyygZOnl0kGWxFIgsBy8QFuTLUXEQ=="], diff --git a/package.json b/package.json index 3a5dbca..1901e56 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,6 @@ }, "dependencies": { "@fontsource/nunito": "^5.2.7", - "@fontsource/source-serif-4": "^5.2.9", "@tauri-apps/api": "^2.11.0", "framer-motion": "^12.38.0", "katex": "^0.16.0", diff --git a/src/view/onboarding/IntroStep.tsx b/src/view/onboarding/IntroStep.tsx index 47673e2..de80628 100644 --- a/src/view/onboarding/IntroStep.tsx +++ b/src/view/onboarding/IntroStep.tsx @@ -20,7 +20,7 @@ export function IntroStep({ onComplete }: Props) { alignItems: 'center', justifyContent: 'center', background: 'transparent', - fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, sans-serif', + fontFamily: 'inherit', }} > ( color: 'rgba(255,255,255,0.75)', verticalAlign: 'middle', margin: '0 1px', - fontFamily: 'system-ui, -apple-system, sans-serif', + fontFamily: 'inherit', }} > {label} @@ -316,7 +316,7 @@ export function PermissionsStep() { alignItems: 'center', justifyContent: 'center', background: 'transparent', - fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, sans-serif', + fontFamily: 'inherit', }} > Date: Tue, 12 May 2026 22:03:04 -0500 Subject: [PATCH 3/3] docs(design-system): update typography to Nunito Signed-off-by: Logan Nguyen --- docs/design-system.md | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/docs/design-system.md b/docs/design-system.md index 2cb5563..eb19e5b 100644 --- a/docs/design-system.md +++ b/docs/design-system.md @@ -78,15 +78,16 @@ Use these exact values. No substitution. ## 3. Typography -**Primary font:** Inter (Google Fonts). Fall back to system-ui, -apple-system. - -| Use | Weight | Approx size | -| ------------------- | ------- | ----------- | -| Input text | 400 | 15px | -| Chat response body | 400 | 14px | -| UI labels, buttons | 500 | 13px | -| Section headers | 600-700 | 24-36px | -| Hero / display text | 700-800 | 48-72px | +**Sole typeface:** Nunito (loaded via `@fontsource/nunito`). Used for all UI chrome and AI prose. The `--font-sans` CSS variable in `@theme` is the single source of truth; every surface inherits from it. Weights 400, 500, 600, and 700 are loaded. Fall back to `-apple-system, BlinkMacSystemFont, sans-serif`. + +There is no secondary reading face. Nunito handles both the compact bar UI and the expanded chat bubbles. + +| Use | Weight | Approx size | +| ------------------- | ------ | ----------- | +| Input / chat body | 400 | 14-16px | +| UI labels, buttons | 500 | 13px | +| Section headers | 600 | 24-36px | +| Hero / display text | 700 | 48-72px | ---