fix(app): default typography to Inter and IBM Plex Mono (#44876)

This commit is contained in:
Luke Parker 2026-08-25 14:30:21 +10:00 committed by GitHub
parent 895eff09b0
commit d6deb62379
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 41 additions and 11 deletions

View file

@ -59,12 +59,12 @@ test("transitions a streaming shell from writing through command execution", asy
await expect(tool.locator('[data-slot="collapsible-trigger"]')).toHaveCSS("height", "28px")
await expect(tool.locator('[data-component="tool-trigger"]')).toHaveCSS("gap", "6px")
await expect(title).toHaveCSS("font-size", "13px")
await expect(title).toHaveCSS("font-family", "Inter, sans-serif")
await expect(title).toHaveCSS("font-family", /^Inter,/)
await expect(title).toHaveCSS("font-weight", "530")
await expect(title).toHaveCSS("line-height", "16px")
await expect(title).toHaveCSS("color", "rgb(22, 22, 22)")
await expect(subtitle).toHaveCSS("font-size", "13px")
await expect(subtitle).toHaveCSS("font-family", "Inter, sans-serif")
await expect(subtitle).toHaveCSS("font-family", /^Inter,/)
await expect(subtitle).toHaveCSS("font-weight", "440")
await expect(subtitle).toHaveCSS("line-height", "16px")
await expect(subtitle).toHaveCSS("color", "rgb(92, 92, 92)")

View file

@ -0,0 +1,30 @@
import { describe, expect, test } from "bun:test"
import { monoDefault, monoFontFamily, sansDefault, sansFontFamily, terminalFontFamily } from "./model"
describe("settings font families", () => {
test("defaults normal text to Inter", () => {
expect(sansDefault).toBe("Inter")
expect(sansFontFamily(undefined)).toStartWith('"Inter", ')
expect(sansFontFamily("")).toStartWith('"Inter", ')
expect(sansFontFamily(" ")).toStartWith('"Inter", ')
})
test("keeps custom normal fonts ahead of the default", () => {
expect(sansFontFamily("Custom Sans")).toStartWith('"Custom Sans", "Inter", ')
})
test("defaults monospace text to IBM Plex Mono", () => {
expect(monoDefault).toBe("IBM Plex Mono")
expect(monoFontFamily(undefined)).toStartWith('"IBM Plex Mono", ')
expect(monoFontFamily("")).toStartWith('"IBM Plex Mono", ')
expect(monoFontFamily(" ")).toStartWith('"IBM Plex Mono", ')
})
test("keeps custom monospace fonts ahead of the default", () => {
expect(monoFontFamily("Custom Mono")).toStartWith('"Custom Mono", "IBM Plex Mono", ')
})
test("preserves the separate terminal font default", () => {
expect(terminalFontFamily(undefined)).toStartWith('"JetBrainsMono Nerd Font Mono", ')
})
})

View file

@ -60,12 +60,12 @@ export interface Settings {
sounds: SoundSettings
}
export const monoDefault = "System Mono"
export const sansDefault = "System Sans"
export const monoDefault = "IBM Plex Mono"
export const sansDefault = "Inter"
export const terminalDefault = "JetBrainsMono Nerd Font Mono"
const monoFallback =
'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'
const sansFallback = 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
'"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'
const sansFallback = '"Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
const terminalFallback =
'"JetBrainsMono Nerd Font Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'

View file

@ -1,8 +1,8 @@
:root {
--font-family-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--font-family-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--font-family-sans--font-feature-settings: normal;
--font-family-mono:
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--font-family-mono--font-feature-settings: normal;
--font-size-small: 13px;

View file

@ -129,9 +129,9 @@
--v2-illustration-illustration-layer-02: var(--v2-grey-400);
--v2-illustration-illustration-layer-03: var(--v2-grey-500);
--font-family-text: "Inter", sans-serif;
--v2-font-family-sans: "Inter", sans-serif;
--v2-font-family-code: "IBM Plex Mono", var(--font-family-mono);
--font-family-text: var(--font-family-sans);
--v2-font-family-sans: var(--font-family-sans);
--v2-font-family-code: var(--font-family-mono);
--line-height-tight: 12px;
--line-height-compact: 16px;
--line-height-base: 20px;