From 4b3a12b24d36bc43a6ccedd33e1ca64a9093e8b5 Mon Sep 17 00:00:00 2001 From: Chris Scott Date: Sat, 7 Mar 2026 15:18:47 -0500 Subject: [PATCH 1/2] MAESTRO: add Solarized Dark theme Add 'solarized-dark' to ThemeId union type, isValidThemeId guard, and THEMES registry using canonical Solarized Dark palette colors. Co-Authored-By: Claude Opus 4.6 --- src/shared/theme-types.ts | 2 ++ src/shared/themes.ts | 20 ++++++++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/src/shared/theme-types.ts b/src/shared/theme-types.ts index 027e09e48..aad204b1a 100644 --- a/src/shared/theme-types.ts +++ b/src/shared/theme-types.ts @@ -17,6 +17,7 @@ export type ThemeId = | 'monokai' | 'github-light' | 'solarized-light' + | 'solarized-dark' | 'nord' | 'tokyo-night' | 'one-light' @@ -92,6 +93,7 @@ export function isValidThemeId(id: string): id is ThemeId { 'monokai', 'github-light', 'solarized-light', + 'solarized-dark', 'nord', 'tokyo-night', 'one-light', diff --git a/src/shared/themes.ts b/src/shared/themes.ts index 8bd1455a0..6f2ce9e92 100644 --- a/src/shared/themes.ts +++ b/src/shared/themes.ts @@ -134,6 +134,26 @@ export const THEMES: Record = { error: '#fb4934', }, }, + 'solarized-dark': { + id: 'solarized-dark', + name: 'Solarized Dark', + mode: 'dark', + colors: { + bgMain: '#002b36', + bgSidebar: '#073642', + bgActivity: '#0a4050', + border: '#586e75', + textMain: '#839496', + textDim: '#657b83', + accent: '#268bd2', + accentDim: 'rgba(38, 139, 210, 0.2)', + accentText: '#2aa198', + accentForeground: '#002b36', + success: '#859900', + warning: '#b58900', + error: '#dc322f', + }, + }, // Light themes 'github-light': { id: 'github-light', From 7dcc59eb26c59b3b953c7e5e3621359f77f0ecdc Mon Sep 17 00:00:00 2001 From: Chris Scott Date: Sat, 7 Mar 2026 16:09:40 -0500 Subject: [PATCH 2/2] fix: improve Solarized Dark theme contrast for tags and code blocks MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Darken border color (#586e75 → #2f4f56) so pill backgrounds contrast better with text - Brighten textMain (#839496 → #93a1a1) and accentText (#2aa198 → #5fddd5) for readable tag labels - Override SyntaxHighlighter base text color with theme's textMain so code blocks match inline code across all themes - Update pill styles in SessionListItem for better contrast - Bump theme count assertion from 17 → 18 Co-Authored-By: Claude Opus 4.6 --- src/__tests__/renderer/constants/themes.test.ts | 4 ++-- src/renderer/components/SessionListItem.tsx | 8 ++++---- src/renderer/utils/markdownConfig.ts | 16 +++++++++++++++- src/shared/themes.ts | 6 +++--- 4 files changed, 24 insertions(+), 10 deletions(-) diff --git a/src/__tests__/renderer/constants/themes.test.ts b/src/__tests__/renderer/constants/themes.test.ts index 5c29884db..6772ee37a 100644 --- a/src/__tests__/renderer/constants/themes.test.ts +++ b/src/__tests__/renderer/constants/themes.test.ts @@ -51,12 +51,12 @@ describe('THEMES constant', () => { } }); - it('should have exactly 17 themes (sync check with ThemeId type)', () => { + it('should have exactly 18 themes (sync check with ThemeId type)', () => { // This count should match the number of IDs in ThemeId union type. // If a new theme is added to THEMES without updating ThemeId, TypeScript errors. // If ThemeId is updated without adding to isValidThemeId array, other tests fail. // This test serves as an explicit reminder when themes are added/removed. - expect(themeIds.length).toBe(17); + expect(themeIds.length).toBe(18); }); it('should have theme.id matching its key', () => { diff --git a/src/renderer/components/SessionListItem.tsx b/src/renderer/components/SessionListItem.tsx index e9084ecc1..ca5f96ec7 100644 --- a/src/renderer/components/SessionListItem.tsx +++ b/src/renderer/components/SessionListItem.tsx @@ -217,7 +217,7 @@ export function SessionListItem({ {session.origin === 'user' && ( MAESTRO @@ -226,7 +226,7 @@ export function SessionListItem({ {session.origin === 'auto' && ( AUTO @@ -235,7 +235,7 @@ export function SessionListItem({ {!session.origin && ( CLI @@ -245,7 +245,7 @@ export function SessionListItem({ {/* Session ID pill */} {session.sessionId.startsWith('agent-') ? `AGENT-${session.sessionId.split('-')[1]?.toUpperCase() || ''}` diff --git a/src/renderer/utils/markdownConfig.ts b/src/renderer/utils/markdownConfig.ts index 8823a109e..2fb1ce780 100644 --- a/src/renderer/utils/markdownConfig.ts +++ b/src/renderer/utils/markdownConfig.ts @@ -375,9 +375,23 @@ export function createMarkdownComponents(options: MarkdownComponentsOptions): Pa } // Standard syntax-highlighted code block + // Merge theme's text color into vscDarkPlus base so plain-text + // code blocks match inline code across all themes. + const themedStyle = { + ...vscDarkPlus, + 'pre[class*="language-"]': { + ...(vscDarkPlus as any)['pre[class*="language-"]'], + color: theme.colors.textMain, + background: theme.colors.bgActivity, + }, + 'code[class*="language-"]': { + ...(vscDarkPlus as any)['code[class*="language-"]'], + color: theme.colors.textMain, + }, + }; return React.createElement(SyntaxHighlighter, { language, - style: vscDarkPlus, + style: themedStyle, customStyle: { margin: '0.5em 0', padding: '1em', diff --git a/src/shared/themes.ts b/src/shared/themes.ts index 6f2ce9e92..6ee408a5f 100644 --- a/src/shared/themes.ts +++ b/src/shared/themes.ts @@ -142,12 +142,12 @@ export const THEMES: Record = { bgMain: '#002b36', bgSidebar: '#073642', bgActivity: '#0a4050', - border: '#586e75', - textMain: '#839496', + border: '#2f4f56', + textMain: '#93a1a1', textDim: '#657b83', accent: '#268bd2', accentDim: 'rgba(38, 139, 210, 0.2)', - accentText: '#2aa198', + accentText: '#5fddd5', accentForeground: '#002b36', success: '#859900', warning: '#b58900',