Fix invisible text on highlighted sidebar rows in dark themes - #171
Open
ThePhatLeee wants to merge 2 commits into
Open
Fix invisible text on highlighted sidebar rows in dark themes#171ThePhatLeee wants to merge 2 commits into
ThePhatLeee wants to merge 2 commits into
Conversation
sidebar_highlight_text was mapped to PaletteColors.TextFocus, while sidebar_highlight (the background it sits on) is PaletteColors.AccentPrimary. In a dark theme where the accent color is light/bright (a common case, since accentPrimary is meant to stand out), textFocus is also typically a light color for readability against the main dark background elsewhere, so pairing two light colors together makes the text on a highlighted sidebar row nearly invisible. Confirmed live against a Noctalia-themed Thunderbird profile: accentPrimary rgb(255,245,155) with textFocus rgb(255,255,255) gives a roughly 1.05:1 contrast ratio (WCAG requires 4.5:1+ for normal text) on any highlighted row in a built-in sidebar, for example Thunderbird's Calendars list or folder tree selection. The two directly analogous pairs already get this right: popup_highlight_text and toolbar_field_highlight_text (dark) both use PaletteColors.Background against the same AccentPrimary highlight background, which is exactly the dark-on-light pairing needed. sidebar_highlight_text was the one outlier still using TextFocus instead of Background, for both light and dark themes since it lives in the shared BASE_BROWSER_TEMPLATE. Verified: existing test suite (12/12) and eslint both pass unchanged. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
ThePhatLeee
force-pushed
the
fix/sidebar-highlight-text-contrast
branch
from
July 27, 2026 17:46
7e7f33b to
32337c2
Compare
ThePhatLeee
marked this pull request as ready for review
July 27, 2026 17:54
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.
Problem
sidebar_highlight_textis mapped toPaletteColors.TextFocus, whilesidebar_highlight(the background it renders on top of) isPaletteColors.AccentPrimary. In a dark theme where the accent color is light or bright (a common case, since accent colors are meant to stand out against a dark background),textFocusis typically also a light color for readability elsewhere against the main dark background. Pairing two light colors together makes the text on a highlighted sidebar row nearly invisible.Confirmed live against a real themed Thunderbird profile (Noctalia palette, via pywalfox-native):
accentPrimaryisrgb(255,245,155)andtextFocusisrgb(255,255,255), a roughly 1.05:1 contrast ratio (WCAG requires 4.5:1+ for normal text) on any highlighted row in a built-in sidebar, for example Thunderbird's Calendars list or a selected folder in the folder tree.Fix
The two directly analogous pairs already get this right. Both
popup_highlight_textandtoolbar_field_highlight_text(dark) usePaletteColors.Backgroundagainst the sameAccentPrimaryhighlight background, which is the correct dark-on-light pairing.sidebar_highlight_textwas the one outlier still usingTextFocusinstead ofBackground, for both light and dark themes since it lives in the sharedBASE_BROWSER_TEMPLATE.One-line fix: change
sidebar_highlight_textfromPaletteColors.TextFocustoPaletteColors.Background.Screenshot
The Calendars sidebar in Thunderbird, after the fix — solid
AccentPrimaryhighlight withBackground-colored text, clearly readable instead of near-invisible:Testing
Existing test suite (12/12) and
eslintboth pass unchanged. This only touches a template mapping, not logic.