fix(ui): make delete-project dialog readable under the paper theme - #28
Merged
Merged
Conversation
… readable The confirm dialog painted its panel with `var(--bg-surface, #1e1e2e)`, but `--bg-surface` is not defined by any stylesheet in the project. Every theme therefore fell through to the hardcoded dark `#1e1e2e`. That went unnoticed under the six dark themes, whose `--text` is light and so still contrasted against the dark panel. The paper theme is the only light palette: its `--text` is `#1e293b`, which put dark text on the dark panel at roughly 1.05:1 contrast and made the title and body invisible. Point the panel at `--bg-elevated` so it tracks the active palette, and give the title and body explicit `--text` / `--text-secondary` colors instead of relying on inherited color plus `opacity: 0.7`, which is equally unreliable over a light surface. Add a `--border` outline so the now-white panel still reads as a distinct layer above the scrim. Verified by hand across all seven themes.
CatJuly
force-pushed
the
fix/paper-theme-dialog-contrast
branch
from
August 5, 2026 09:27
4b9c090 to
2584c45
Compare
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
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.
Summary
Switching to the paper theme and clicking delete on a project produced an unreadable confirmation dialog — the title and body text were invisible against the panel.
Root cause
ProjectSelector.tsxpainted the dialog panel with:background: 'var(--bg-surface, #1e1e2e)'--bg-surfaceis not defined by any stylesheet in the project — a scan of everyvar(--token)reference against every theme block confirms it, along with--bg-primary, are the only two undefined tokens. So all seven themes fell through to the hardcoded dark#1e1e2eand the panel never tracked the active palette.This stayed invisible under the six dark themes, whose
--textis light and therefore still contrasted fine against a dark panel. The paper theme is the only light palette — its--textis#1e293b, which put dark text on the dark panel at roughly 1.05:1 contrast.It also explains the exact shape of the symptom:
Cancelstayed faintly legible because.pill-btnuses--text-secondary, andDeletestayed fully legible because it hardcodescolor: #fffover a red fill. Only the title and body, which inherit--text, disappeared.Fix
var(--bg-elevated), so it follows the active theme (#ffffffunder paper,#141b2bunder midnight, etc.)--text/--text-secondaryinstead of inherited color plusopacity: 0.7— dimming by opacity is equally unreliable over a light surface--borderoutline so the now-white panel still reads as a distinct layer above the scrimFixing the token rather than adding a
.theme-paperoverride keeps the next light theme from hitting the same trap.Effect on other themes
All seven themes now resolve the panel from their own palette. The six dark themes shift only slightly (
#1e1e2eto e.g.#141b2b) since they were already close to the hardcoded value — they go from coincidentally readable to consistently themed.Testing
npm run typecheckpassesfrontend_distrebuilt and included, matching the convention in feat: harden company resume, external sessions, and Office UI i18n #9 and 全系统的状态刷新没有对齐,必须强制刷新 #11Note
There is a second instance of this token class not touched here:
kanban/kanban.css:922usescolor-mix(in srgb, var(--bg-primary) 80%, transparent)where--bg-primaryis undefined and has no fallback, so that wholebackgrounddeclaration is dropped at compute time. Left out to keep this PR scoped to the reported bug — happy to send it separately.