Repository navigation
feat(web): the dashboard takes the iOS app's palette - #1857
Merged
Merged
Conversation
theme.css now carries the phone's colours: a blue-black ground, ink for the interface, one grid hue both ways, solar, a battery that stores in cyan and gives in orange, a violet car, and two states, --live and --alarm. --green and --red now alias those states; energy keeps the -e names. Every use of a red, green or amber name is sorted into energy or state. States (ok, connected, done, failed, blocked, danger buttons, warnings that need action) move to --live or --alarm; warnings that need no action move to ink2. Battery, car and solar flows that sat on the grid names move to their own hue. Prices and savings become ink levels. Text on an accent fill reads --on-accent, now that the accent is ink. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
frahlg
added a commit
that referenced
this pull request
Nov 11, 2026
* feat(web): the charts take the iOS app's palette The canvases and chart palettes that kept raw hex after #1857 now read colour roles. window.ftwThemeColors gains the energy and state roles (solar, stores, gives, grid, car, live, alarm), and app.js's chart colours gain the same, so every canvas draws in the theme it shows. - Plan: prices are ink by tercile (32/50/80 %), tariff and VAT fainter ink3. The battery stores in cyan and gives in orange, the car is violet, the home is ink, the now line is ink. Plan marks draw at 75 %, as on the phone. - History: home use is ink, solar amber, and the grid one pink both ways, so export hangs below the zero line. - Live chart and 24 h battery chart: grid, solar, home, every battery in the storing hue and every car in violet, each a step fainter when a site has several. BATTERY_PALETTE and EV_PALETTE are gone. The 24 h chart redraws when the theme changes. - Diagnose chart, heating charts (ink levels told apart by dash), the car plan timeline and the legends follow. - style.css: diagnostics reasons, driver warning card, status bar, setup banner, fuse bars, plan tooltip and the remaining white overlays move to roles. Scrims and shadows stay black. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * fix(web): tell export apart, and keep alarm for failures Review fixes on the chart palette. - Live Energy view: export draws dashed and unfilled in the one grid pink, with a dashed legend swatch and tooltip mark. - Alarm only for refused, failed or blocked: an unsaved Home Assistant change gets its own ink class (ha-pending), and the first-run setup banner and the optimiser fallback box go to ink. "Plan stale", the failed driver card and HA "not connected" stay alarm. - History: one step serves both sides of zero and both sides take whole steps, so a day that sells more than any bar above zero still has a gridline and a label under it. A "sold" caption under the zero line says what the unsigned lower labels count. - Plan: tariff and VAT slices rise to 35 % and 20 % ink3, and the legend swatches match. - The 24 h battery chart redraws from the items it last drew when the theme changes, rather than fetching again. - Heating: the return line takes a dash, so it parts from supply. - Tests: the live chart maps each role to the same token as the shared resolver; export larger than every bar above zero reaches the lowest gridline with no minus sign; live export is dashed. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
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.
Why
Fredrik, 25 October 2026: the web app should take the iOS design, step by step, and the box page and the web app should take the iOS palette together ("Båda, i par"). They share color tokens:
scripts/check-token-drift.mjsin srcfl/ftw-webapp holds them equal.This is the box half. The web app half is srcfl/ftw-webapp#109. Merge both together.
The palette
From the iOS app (
ftw-appappleApp/FTWCharts/Theme.xcassets), light / dark:--live. Failed, refused, blocked and danger buttons →--alarm. New in both files:--live,--alarm,--energy-gives.--on-accent). About 15 places that hard-coded black or white text on the accent now read--on-accent.--fresh-liveis--live, and--fresh-staleis ink2.Before and after, the box page against the home box (read only) and the web app on the demo:
Choices a reviewer may want to change
--alarmin some places: control warnings (as the iOS control sheet does), the forecast's "waiting for data", and "charger saved with warnings". "Unconfirmed" in Plan could be ink2 instead.Not done yet
Canvases and palettes with raw hex values do not read roles, so they keep the old colours. This covers the box's
plan.jsprice bars (green/red) and charge/discharge, theenergy-history.jsseries,heating.js,BATTERY_PALETTE/EV_PALETTEinapp.js, and some raw rgba instyle.css. The webapp's stats page has its own palette. These are the next step.Open PRs that touch the same files
These will need a rebase after this merges: #1832 (
style.css,lan-auth.js), #1792 and #1789 (app.js), #1751 (energy-flow-readings.js), #1547 (style.css). Most of the overlap is single colour lines.Checks
npm test: 886/886. Palette assertions inweb/theme-unification.test.mjsandweb/header-status-marks.test.mjsare updated, and a new test checks grid, gives, live and alarm in both themes.make verifypasses.check-token-drift.mjsreports 35 vendored token names checked in both themes, with no drift./api/config: Overview in dark and light, before and after. The repository asks a person to inspect the rendered page before merge.🤖 Generated with Claude Code