components

3.6 KB

1. # Report 003 — components.hybriel#15: black and white base look, greys for nuances (worker w090, 2026-10-04)
3. **Result: done, not deployed, not pushed.** components.hybriel main 5a98d77 (code) + docs commit; layouts.worldapi.org main 635234d.
5. ## What changed
6. - **Base look** named once in `shared/base.hl`: black #000, greyDark #555, grey #999, greyLight #ddd, greyLighter #f2f2f2, white #fff
7. (README "Look" says what each is for). Light by default: white page, black text.
8. - **8 components** (`<name>.hl` Styles): every `var(--color-…, <WorldAPI value>)` fallback → a base value (syntax colours of the code
9. editor: greys, plain code black; selected day / current page / main modal button: white on black; focus ring #555; modal backdrop #555).
10. Decorative borders (fields, buttons, day cells, popups, editors, toolbars, modal header/footer, code gutter) → `0`; separation by
11. grey surfaces instead; date/range popup gets a soft black shadow; invalid field = dashed outline. Kept functional: focus ring,
12. today ring, drop zone (dashed #999). Additions only where layouts' theme sets the same property itself (gap/radius on day grids,
13. popup shadow, link-form background, invalid outline) → layouts unchanged.
14. - **Public names, elements, classes, token names unchanged.**
15. - **md-editor.hl** `inlineRule`: strips `style` attributes from the surface after its `insertHTML` — Chrome wrote
16. `<strong style="color: rgb(0, 0, 0)">` once strong and the text around it had the same colour (gate "typing **x**" failed).
17. - **Site**: `components/styles.hl` uses the base names, declares no `--color-…` token (the showcase = a bare copy); header black;
18. `project.hl` PWA theme #000 / background #fff; icon (svg, 192/512/180 PNG, favicon svg/ico) white blocks on black.
19. - **Gate** `tests/browser.mjs`: +10 `base look:` checks (base.hl has the 6 values; every colour in the 9 public files is a base value;
20. at 1280 + 390 px on home + 8 demos + open date popup + open modal: no `--color-…` on :root, white page/black text, every computed
21. colour incl. borders/outline/caret/accent/shadow/::backdrop r=g=b, no visible border inside components except the drop zone);
22. PWA checks updated to the b/w colours. Screenshots `.scratch/gate-bw-<page>-<width>.png`.
24. ## Tests (ports 8750–8759)
25. - components gate: **230 passed, 0 failed** (`.scratch/w090/gate3.txt`). Same new gate on the OLD tree (git archive 3f93d71 + new
26. test): 217/13 — all base-look + PWA colour checks fail there → the checks bite.
27. - Screenshots LOOKED at (390 + 1280): home, month view, date picker (+ popup open), range picker, pagination, md editor, code editor,
28. file upload, modal (+ open): all black/white/grey, no frames except the drop zone.
29. - `python3 tests/letcount.py .` → never reassigned 0.
30. - layouts.worldapi.org: `tools/sync-components.sh 5a98d77` (verbatim check ok), gate **73/0**, `check-theme` **0 problems**;
31. pixel diff (`magick compare -metric AE`) of its 19 gate screenshots + 26 full-page shots (/, /elements, /components, 8 component
32. pages, 2 shells × 390/1280) old vs new: all 0, except gate-1280-modal-open max 1/255 on a few backdrop pixels (0 at 0.5 % fuzz,
33. compositing noise). Old/new trees + shots: layouts `.scratch/w090/`.
35. ## Notes / open
36. - Not deployed: on deploy the icon changes (PWA/Cloudflare caches); mission 002's old root `styles.hl` on Byrodin still to delete.
37. - `shared/tokens.hl` stays in the repo (verbatim WorldAPI copy) but the site no longer imports it.
38. - Accident fixed: my scratch copy pushed two stray files (`components/calendar.hl`, `components/loginfailed.hl`, from an old calendar
39. session) into the working tree; removed before any commit (never committed).