feat(controller): migrate Usage screen to semantic colour tokens (theming)#17
Merged
Conversation
… T0) Start the light-theme overhaul as a refactor-by-feature slice. The app already had a DayNight setup, but most screens hardcoded dark-tuned hex, so light mode breaks wherever that happens. Foundation (additive — nothing renamed or removed yet): - Add a semantic colour-token palette with full light/dark parity in values/colors.xml + values-night/colors.xml: surfaces (surface_background/ card/section), text (primary/secondary/disabled/on_accent), accent/accent_muted, status (success/warning/danger/info), divider_line, and data-viz (chart_*). QR colours (qr_foreground/qr_background) are intentionally fixed — no -night override — since a QR must stay black/white to scan. - Document the palette and the rule (no hardcoded colours; every token defined in both values and values-night) in CLAUDE.md (new "Theming" section). Pilot — Dashboard (the reference migration to copy): - fragment_dashboard.xml: replace the 7 hardcoded hex (#888888 -> @color/text_secondary; offline badge #555555 -> @color/surface_section). - DashboardFragment.java: replace the Color.parseColor gauge/battery colours with ContextCompat.getColor(R.color.status_warning/danger/success/info). Legacy dash_*/literal tokens are kept for now and retired as other screens migrate. Verify in light AND dark on device.
ResourceGaugeView hardcoded the gauge title (#CCCCCC) and subtitle (#AAAAAA) in a light grey that is unreadable on the light surface, and the track arc in #333333 (a heavy black arc on a light card). Route them through tokens: title/subtitle -> text_secondary, percent -> text_primary, track -> chart_track, default arc -> status_success. Removes the last hardcoded colours from the Dashboard's gauges; verify both modes.
The light-theme track (#E0E0E0) blended into the card background, so the gauge 'path' was barely distinguishable from the surface. Bump to #C4C7CC so the track reads clearly as the channel the colored arc follows. Dark theme track (#333333) is unchanged.
Refactor-by-feature theming slice for the USAGE tab (UsageFragment + fragment_usage.xml), following the Dashboard pilot pattern. Adds the round-2 token block (twins in values + values-night) for needs not covered by the foundation: - surface_active_success/info/danger: tinted 'active' card states - status_pending: amber in-progress LED - accent_secondary: purple secondary actions - btn_neutral: neutral button fill that stays dark in BOTH themes so white button text stays legible (light surfaces would hide it) - terminal_background/terminal_text: log console (green-on-black, fixed) - overlay_scrim: modal dim Usage migration: - fragment_usage.xml: 14 hardcoded hex -> tokens (button text -> text_on_accent, #673AB7 apps button -> accent_secondary, warning text/progress -> status_warning, save button #555555 -> btn_neutral, log console #000000/#00FF00 -> terminal_*, #00000000 -> @android:color/transparent). - UsageFragment.java: Color.WHITE button text -> text_on_accent; swipe-hint #00E5FF -> status_info. Color.TRANSPARENT kept (theme-independent). No layout/behaviour change intended; pure colour-source migration. Verify in light AND dark on device.
The status LED panel barely separated from the page in light mode (#E8EAED panel on #F4F5F7 page). Darken dash_module_bg #E8EAED -> #DEE1E6 (light only; dark twin unchanged) so the panel reads as a card. Same token as the Install LED panel, so both panels stay identical and equally defined.
…g PRs Make the round-2 token block byte-identical in the Usage/Install/Share theming branches (12 tokens incl. toggle_selected, plus dash_module_bg #DEE1E6) so colors.xml merges cleanly regardless of merge order. Tokens not referenced by this screen are harmless definitions (other screens use them).
…hare Make values/ and values-night/ colors.xml byte-identical across the three theming branches (only stray blank lines differed) so they merge cleanly in any order with zero conflicts.
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.
Refactor-by-feature theming slice for the USAGE tab, following the Dashboard pilot.
Files:
fragment_usage.xml(14 hex),UsageFragment.java(4 refs).Adds the shared round-2 token block (twins in
values+values-night):surface_active_success/info/danger,status_pending(amber LED),accent_secondary(purple),btn_neutral(dark-in-both button fill so white text stays legible),terminal_background/terminal_text(log console),overlay_scrim.Mapping highlights: button text ->
text_on_accent; apps button#673AB7->accent_secondary; Save button#555555->btn_neutral; warning text/progress#FF9800->status_warning; log console#000000/#00FF00->terminal_*; swipe hint#00E5FF->status_info.Color.TRANSPARENTkept.Verified: XML valid, 0 hex remaining, all tokens resolve, braces balanced. Not built on-device — verify light + dark.