feat(vscode): allow switching between built-in theme and inheriting VS Code theme#179
Open
Evoludo wants to merge 6 commits into
Open
feat(vscode): allow switching between built-in theme and inheriting VS Code theme#179Evoludo wants to merge 6 commits into
Evoludo wants to merge 6 commits into
Conversation
…heme mode intact Revert component-level className changes that leaked into the built-in theme: - ChatMessage bubbles: bg-muted -> bg-zinc-100 dark:bg-zinc-800 - ChatStatus: border-[var(--border)] -> border-border/40 - ThinkingBlock: bg-input -> original zinc colors/borders - ToolCallCard: bg-input -> border border-border - InputArea: bg-input -> border border-input - button.tsx: restore dark:hover variants for outline/ghost Instead, apply VSCode-specific styling via .vscode-theme CSS overrides that target harmless wrapper classes (thinking-block, tool-call-card, input-area-wrapper, user-message-bubble, steer-bubble, chat-status-bar). These classes are no-ops in built-in mode. This ensures the built-in theme remains pixel-identical to main while vscode theme mode continues to work as intended.
Author
|
Ah, looks like I broke the built-in theme with this. I'll revert it to original styling while in built-in mode. |
…s instead The previous commit changed ToolRenderers classNames globally (zinc → theme vars) which leaked into the built-in theme. Revert all styling classes back to their original zinc values and add wrapper classes instead: - tool-codeblock (CodeBlock root) - codeblock-expand (expand button) - data-todo-status=done/empty (todo icons) Add corresponding .vscode-theme CSS overrides in index.css so the VSCode theme mode still gets proper theme colours while the built-in theme remains pixel-identical to main.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
PR Summary
This PR adds a
kimi.themeModesetting that allows the extension's webview to optionally inherit VSCode's native theme colors instead of the built-in shadcn palette. It fixes a root cause where an unlayered* { border-color: var(--border); }rule was overriding all Tailwind border utilities, causing bright borders in high-contrast themes. The fix makes default borders transparent in VSCode mode while preserving explicit colored borders, adds computedcolor-mixhover highlights for buttons and menu items (replacing near-invisiblebg-muted/50), and updates key components to use theme-mapped backgrounds instead of hardcoded zinc colors.Changes
kimi.themeModesetting and.vscode-themeCSS variable mappings to--vscode-*colors*border rule that was stomping Tailwind utilities; default borders are now transparent in VSCode modecolor-mix(in oklch, var(--foreground) 20%, var(--background))hover tint to buttons, dropdown items, command items, session items, tool headers, thinking headers, and plan mode buttonbg-input; user bubbles →bg-muteddark:hover:bg-muted/50anddark:hover:bg-input/50from shadcn button variants for consistent cross-theme hoverResolves #162