emrg: gui — use theme variables in React shell (fix light theme regression) - #1047
Merged
Conversation
argszero
commented
Aug 27, 2026
argszero
left a comment
OwnerAuthor
There was a problem hiding this comment.
✅ LGTM — cycle cyc20260827-204948
Verified fresh this cycle:
- Fix summary: all hardcoded Catppuccin dark colors in
emrg/gui/renderer/src/shell.cssreplaced withcss/tokens.csstheme variables (var(--bg),var(--text-1),var(--border),var(--accent-soft),var(--accent), etc.). - Theme mechanism confirmed:
data-theme="light"resolves--bg:\ #fafafa/--text-1:\ #1a1d21in tokens.css, and.react-shellnow uses those vars — light theme works across all three states (light/dark/follow-system). - No hardcoded hex/
rgba(255,255,255)remains in any CSS rule on the PR branch (comment-only mention retained for traceability). - CI:
testcheck passes (1m43s).test-windowspending. - Covers rant 2026-08-27T20:33:31 (GUI light-theme regression).
argszero
commented
Aug 27, 2026
argszero
left a comment
OwnerAuthor
There was a problem hiding this comment.
✅ LGTM — cycle cyc20260827-205444 (2/3)
Re-verified fresh this cycle:
- PR head
d5fb71cunchanged since first LGTM; still clean — no hardcoded hex/rgba(255,255,255)in any CSS rule (only comment mentions retained for traceability). - CI:
test+test-windowsboth pass. mergeable: MERGEABLE, basemaster, no conflicts.- Covers rant 2026-08-27T20:33:31 (GUI light-theme regression).
argszero
commented
Aug 27, 2026
argszero
left a comment
OwnerAuthor
There was a problem hiding this comment.
✅ LGTM — cycle cyc20260827-205943 (3/3)
Third distinct-cycle verification:
- PR head
d5fb71cunchanged; still clean — no hardcoded hex/rgba(255,255,255)in any CSS rule. - CI:
test+test-windowsboth pass. mergeable: MERGEABLE, basemaster, no conflicts.- Covers rant 2026-08-27T20:33:31 (GUI light-theme regression).
3 consecutive ✅ (cycles 204948/205444/205943), no ❌ — merge gate satisfied.
Uh oh!
There was an error while loading. Please reload this page.
argszero added a commit
that referenced
this pull request
Aug 27, 2026
…egression via theme variables in React shell) (#1048) Co-authored-by: EMRG Evolution <emrg@argszero.dev>
argszero added a commit
that referenced
this pull request
Aug 27, 2026
…--radius-sm) + add theme-integrity guard (#1051) * emrg: gui — fix undefined theme tokens (--fs-small/--bg-1/--bg-hover/--radius-sm) + add theme-integrity guard Two-part change hardening renderer theming (rant 2026-08-27T20:33:31 → #1047 light-theme regression class): FIX: tokens.css lacked 4 variables that layout.css/components.css consume as bare var(--x) (no fallback): --fs-small (11px), --radius-sm (8px), --bg-1 and --bg-hover (per-theme values). Bare undefined vars make declarations invalid at computed-value time — task-form background transparent, filetab hover dead, badge font-size/radius wrong. All 4 now defined in every theme block (light default + forced, dark media + forced). GUARD: emrg/gui/test/theme-guard.test.js — 2 static tests: 1. every bare var(--x) in renderer CSS must be defined in tokens.css (catches silent invalid declarations — the bug above) 2. no Catppuccin dark-palette hexes outside tokens.css, comment-stripped (the exact #1047 regression shape: hardcoded theme colors bypassing vars) Negative-state verified: guard fails on pre-fix tokens, passes on fixed. GUI tests 93 -> 95, Agent.md synced. * test: make theme-guard scan recursive (cover src/**/*.css nested files) --------- Co-authored-by: argszero <argszero@gmail.com> Co-authored-by: EMRG Evolution <emrg@argszero.dev>
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 freeto 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.
Problem
The GUI's light theme is broken: after selecting 外观 = 浅色 (light), the main interface stays dark. Root cause confirmed by host (rant 2026-08-27T20:33:31): before the React migration the light theme worked fine, but the React shell (.react-shell and its children) hardcodes Catppuccin dark colors (
#1e1e2e/#cdd6f4/#89b4fa/ etc.) instead of using the theme variables fromtokens.css. This was introduced by Batch 0 (#991) and the layout fix (#1040) only addressed layout classes, not color-theme wiring.Fix
Replace all hardcoded Catppuccin colors in
emrg/gui/renderer/src/shell.csswith the CSS custom properties already defined incss/tokens.css:.react-shellbackground/color →var(--bg)/var(--text-1)var(--border)var(--accent-soft)/var(--accent)var(--text-2)/var(--bg-soft)/var(--text-1)/var(--accent)var(--text-1)var(--accent)/var(--text-3)var(--bg-panel)/var(--border)/var(--shadow-lg)/var(--text-*)The theme is driven by the
data-themeattribute (light/dark/system) set inSettingsPanel.tsxand resolved bytokens.css; using these variables makes the React shell correct in all three states (light, dark, follow-system) — matching pre-migration behavior.Verification
npm run build: OK (49.03 kB CSS, build succeeds)npx vitest run: 445 passed / 44 filespytest tests/ -v: 1126 passed + 1 skipped (collect-only 1127 == Agent.md doc-count)python -c "from emrg.client.app import run_client": import OKpython -m emrg --help: CLI OK