Skip to content

Add dark theme for settings UI - #292

Open
quangdat99x wants to merge 2 commits into
ramjke:masterfrom
quangdat99x:feature/dark-theme
Open

Add dark theme for settings UI#292
quangdat99x wants to merge 2 commits into
ramjke:masterfrom
quangdat99x:feature/dark-theme

Conversation

@quangdat99x

Copy link
Copy Markdown

Summary

  • Switches the MaterialDesignExtensions base theme from Light to Dark and repalettes the centralized brushes in App.xaml (chrome background, primary/secondary hues) to a dark background with teal accents.
  • Pins dark text on the few intentionally light chip controls (hotkey input box, ExtendedButton link buttons, Lookupper banner) so they stay readable against the new dark chrome.
  • Adds a .gitignore entry for a local run/ folder (a tidy, ready-to-launch copy of the build output used during manual testing; not meant to be tracked).

Why

Requested UI improvement: give Translumo a dark mode option for its Settings window instead of the current light cyan/mint theme.

Test plan

  • Built via dotnet publish Translumo.sln -c Release (net8.0-windows, self-contained win-x64).
  • Launched the built app and visually confirmed: sidebar/chrome renders dark, selected nav item highlighted in teal, content area dark, proxy info card readable, language switcher readable, and the white Lookupper banner still shows dark, readable text.
  • Other settings tabs (Hotkeys, OCR, Translation, About dialog) were not individually re-verified by click-through in this session — please double check those render correctly, since click-navigation could not be exercised in the automated test environment used.

🤖 Generated with Claude Code

quangdat99x and others added 2 commits July 1, 2026 16:54
Switches the MaterialDesignExtensions base theme from Light to Dark and
repalettes the centralized brushes in App.xaml (chrome, primary/secondary
hues) to a dark background with teal accents. Pins dark text on the few
intentionally light "chip" controls (hotkey input, ExtendedButton links,
Lookupper banner) so they stay readable against the new dark chrome.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Chaobs referenced this pull request in Chaobs/Translumo-LLM Jul 23, 2026
…ort of upstream PR #292)

Introduce ThemeService that toggles between light and dark modes at runtime
without recreating App.xaml brush resources. Key design points:
- Mutates SolidColorBrush.Color on existing app-level brushes (WPF Freezable
  change notification propagates to all StaticResource references).
- Swaps MaterialDesignThemes base theme via PaletteHelper.SetBaseTheme
  (Theme.Dark/Theme.Light) and MaterialDesignExtensions light/dark dict.
- Installs fresh mutable brushes when built-in ones are Frozen.
- Persists preference to config/theme.json independently of ConfigurationStorage.

Contrast/visibility fixes across 4 iterations:
- MaterialDesignBody light set to pure black (#000000, AAA 21:1) so right-side
  Labels on Language/Appearance/OCR/Hotkeys pages stay legible in light mode.
- SettingsView side panel + SimpleDialog title bar use ChromeBackgroundBrush;
  SettingsView LabelForeground switched to DynamicResource MaterialDesignBody.
- LightLabel Foreground switched to DynamicResource MaterialDesignBody.

UI additions: AppearanceSettingsView theme ToggleButton bound to IsDarkTheme;
DarkTheme localized strings added for en-US, ja-JP, ru-RU, zh-CN, zh-TW.
No impact on LLM, voice switcher, or existing UI layout.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant