2aa5360932
Acting on the review of #621. No bugs were found; these are the four suggestions and two nits. The real one: measurement accepted only hex. `relativeLuminance` returned 0 for anything else, which is black's luminance and indistinguishable from it -- so a token written `rgb(92 79 168)` measured as pure black, the "best" foreground was chosen against a colour the theme does not contain, and the wrong hex was then frozen into an inline style where CSS could no longer correct it. Silent, and worse than not measuring. `parseColor` now reads `rgb()`/`rgba()` in both the comma and space forms, percentages, and `#rgba`/`#rrggbbaa`; `isMeasurable` lets a caller tell "unreadable" from "black"; and navColorsFrom falls back to the tokens when the background or every candidate is unreadable. Unreadable candidates are filtered rather than the whole measurement abandoned, so one oddly written token does not cost the other two. This matters because the header claimed custom YAML themes get correct foregrounds for free, and a hand-written palette is exactly where a non-hex value will first appear. The Cypress inverse hardcoded night's `--btn-text` as `#0a0000`. The unit tests parse tokens.css precisely so a palette edit cannot leave a stale claim behind, and that literal was the one place the rule was broken. It reads the token from the theme now, asserts it resolved, and additionally pins that red still takes `--btn-text` while brown no longer does. Documented rather than changed: the warning indicators still pick their colour from the `conflictingColors` name list. It is the same defect as the one fixed here and measurably worse -- `--danger` and `--warning` are 1.0-1.8:1 against the bar in every theme, light and dark included, because a red icon on a red bar is a red icon on a red bar. The fix is not a better colour: severity has to stay distinguishable from the bar's text as well as from itself, and a monochrome theme has no third brightness, so it has to stop being a hue. That is a redesign, and the note now sits beside the residue in navColors.ts rather than only in a PR description. The gallery draws the indicators as the bar draws them when nothing is wrong; it does not stage a fake overheating Pi to exhibit a fault nobody has agreed how to fix. Also documented: re-measurement is triggered by `data-theme`, so a future custom-theme editor patching custom properties in place would leave the bar on the values it last measured. There is no event for "a custom property was assigned" to observe instead, so the note says what such an editor must do. Nits: "Eleven" in a comment where the assertion locks ten (and a stale 2.91:1 beside it, now 3.27:1), and a missing space in `const wrolpiIcon =<img`. Six new unit cases, planted: dropping the fallback reddens two. 1121 jest / 62 suites, 196 in ui-layout.cy.js, clean npm run build. |
||
|---|---|---|
| .. | ||
| cypress | ||
| public | ||
| scripts | ||
| src | ||
| .gitignore | ||
| cypress.config.js | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| serve.json | ||
| tsconfig.json | ||
Getting Started with Create React App
This project was bootstrapped with Create React App.
Available Scripts
In the project directory, you can run:
npm start
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
npm test
Launches the test runner in the interactive watch mode.
See the section about running tests for more
information.
npm run build
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about deployment for more information.
npm run eject
Note: this is a one-way operation. Once you eject, you can't go back!
If you aren't satisfied with the build tool and configuration choices, you can eject at any time. This command will
remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right
into your project so you have full control over them. All of the commands except eject will still work, but they will
point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use eject. The curated feature set is suitable for small and middle deployments, and you
shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't
customize it when you are ready for it.
Learn More
You can learn more in the Create React App documentation.
To learn React, check out the React documentation.
Code Splitting
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
Analyzing the Bundle Size
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
Making a Progressive Web App
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
Advanced Configuration
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
Deployment
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
npm run build fails to minify
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify