[feature] Derive markdown code block colors from custom theme #3172

Problem

Fenced code blocks in the rendered markdown view use hardcoded oneLight / oneDark themes from react-syntax-highlighter (prism). These themes have their own fixed background and token colors that are completely independent of the user's custom theme.

This means custom themes have no control over how syntax-highlighted code blocks look in markdown. For light themes with a tinted background (e.g. Iceberg Light with #e8e9ec), the oneLight theme's pastel token colors appear washed out because they were designed for a pure white (#fafafa) background. The only workaround is setting ui.muted to near-white, which constrains the overall theme design.

Current behavior

In CodeBlock.tsx, the syntax highlighter theme is selected purely by light/dark mode:

const isDark = theme?.type !== "light";
const syntaxStyle = isDark ? oneDark : oneLight;

The custom theme's terminal ANSI colors and UI colors have no effect on fenced code block rendering, even though they already drive:

• The CodeMirror file editor (via getEditorTheme())
• The diff viewer's syntax highlighting (via Shiki + terminal colors)
• Inline code styling (via bg-muted)

Suggested approach

Derive fenced code block colors from the custom theme, consistent with how the diff viewer and editor already work. A few options:

1. Build a prism-compatible style object from the theme's terminal colors — map terminal ANSI slots to prism token categories using the same mapping that getEditorTheme() uses (e.g. terminal.green → strings, terminal.blue → functions, etc.), with ui.muted as the background.

2. Use Shiki instead of react-syntax-highlighter — the diff viewer already uses Shiki with theme-derived colors via getEditorTheme(). Switching the markdown code blocks to the same Shiki pipeline would give consistent styling across all code views.

3. Allow an editor.codeBlock theme override — similar to how editor.syntax.comment exists, allow themes to specify code block background/foreground overrides.

Related

• [bug] Diff context text invisible on custom light themes #2684 — similar issue where custom light themes cause invisible text in the diff viewer due to hardcoded color assumptions