style(tui): align accents with nanobot brand

This commit is contained in:
Xubin Ren
2026-08-17 20:56:10 +08:00
parent 6eba62606c
commit f17d9eeff7
2 changed files with 17 additions and 10 deletions
+5 -1
View File
@@ -949,7 +949,7 @@ describe("NanobotTui layout", () => {
palette: Record<string, string> & { referenceBackground: string; faint: string } palette: Record<string, string> & { referenceBackground: string; faint: string }
} }
const assertContrast = () => { const assertContrast = () => {
for (const tone of ["text", "muted", "accent", "success", "error", "user", "warm", "cool"]) { for (const tone of ["text", "muted", "accent", "link", "success", "error", "user", "warm", "cool"]) {
expect(contrastRatio(internals.palette[tone] ?? "", internals.palette.referenceBackground)).toBeGreaterThanOrEqual(4.5) expect(contrastRatio(internals.palette[tone] ?? "", internals.palette.referenceBackground)).toBeGreaterThanOrEqual(4.5)
} }
expect(contrastRatio(internals.palette.faint, internals.palette.referenceBackground)).toBeGreaterThanOrEqual(3) expect(contrastRatio(internals.palette.faint, internals.palette.referenceBackground)).toBeGreaterThanOrEqual(3)
@@ -962,8 +962,12 @@ describe("NanobotTui layout", () => {
} }
assertContrast() assertContrast()
expect(internals.palette.accent).toBe("#EF8E30")
expect(internals.palette.user).toBe("#EF8E30")
setup.renderer.emit(CliRenderEvents.THEME_MODE, "light") setup.renderer.emit(CliRenderEvents.THEME_MODE, "light")
assertContrast() assertContrast()
expect(internals.palette.accent).toBe("#B94D0B")
expect(internals.palette.user).toBe("#B94D0B")
}) })
test("replaces streamed drafts with canonical stream-end text", async () => { test("replaces streamed drafts with canonical stream-end text", async () => {
+12 -9
View File
@@ -83,6 +83,7 @@ interface Palette {
faint: string faint: string
border: string border: string
accent: string accent: string
link: string
success: string success: string
error: string error: string
user: string user: string
@@ -97,10 +98,11 @@ const DARK: Palette = {
muted: "#A1A1AA", muted: "#A1A1AA",
faint: "#71717A", faint: "#71717A",
border: "#3F3F46", border: "#3F3F46",
accent: "#8B7CF6", accent: "#EF8E30",
link: "#60A5FA",
success: "#5CC489", success: "#5CC489",
error: "#F87171", error: "#F87171",
user: "#60A5FA", user: "#EF8E30",
// Codex-style turn anchor: 12% white over the reference dark background. // Codex-style turn anchor: 12% white over the reference dark background.
userBackground: "#2B2C2E", userBackground: "#2B2C2E",
warm: "#C26A25", warm: "#C26A25",
@@ -113,10 +115,11 @@ const LIGHT: Palette = {
muted: "#6F6F78", muted: "#6F6F78",
faint: "#8A8A94", faint: "#8A8A94",
border: "#D4D4D8", border: "#D4D4D8",
accent: "#5B4BC4", accent: "#B94D0B",
link: "#1D4ED8",
success: "#166534", success: "#166534",
error: "#B91C1C", error: "#B91C1C",
user: "#1D4ED8", user: "#B94D0B",
// Codex-style turn anchor: 4% black over the reference light background. // Codex-style turn anchor: 4% black over the reference light background.
userBackground: "#F0F0F0", userBackground: "#F0F0F0",
warm: "#C2410C", warm: "#C2410C",
@@ -164,17 +167,17 @@ function syntaxStyle(palette: Palette): SyntaxStyle {
keyword: { ...color(palette.accent), bold: true }, keyword: { ...color(palette.accent), bold: true },
string: color(palette.success), string: color(palette.success),
comment: { ...color(palette.muted), italic: true }, comment: { ...color(palette.muted), italic: true },
number: color(palette.user), number: color(palette.link),
function: color(palette.warm), function: color(palette.warm),
type: color(palette.cool), type: color(palette.cool),
variable: color(palette.text), variable: color(palette.text),
property: color(palette.user), property: color(palette.link),
"markup.heading": { ...color(palette.accent), bold: true }, "markup.heading": { ...color(palette.accent), bold: true },
"markup.strong": { ...color(palette.text), bold: true }, "markup.strong": { ...color(palette.text), bold: true },
"markup.italic": { ...color(palette.muted), italic: true }, "markup.italic": { ...color(palette.muted), italic: true },
"markup.link": { ...color(palette.user), underline: true }, "markup.link": { ...color(palette.link), underline: true },
"markup.link.label": { ...color(palette.user), underline: true }, "markup.link.label": { ...color(palette.link), underline: true },
"markup.link.url": { ...color(palette.user), underline: true }, "markup.link.url": { ...color(palette.link), underline: true },
"markup.raw": color(palette.warm), "markup.raw": color(palette.warm),
conceal: color(palette.faint), conceal: color(palette.faint),
}) })