diff --git a/CLAUDE.md b/CLAUDE.md index 467bf8e..309858c 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -261,6 +261,20 @@ dashboards safe: page uses `variant="strip"`. `pages.booking` takes `compact` for the home card; booking rules are shared and unchanged. +Gotchas found in the 24-x QA (2026-10-31) — all come from `app.css`/shared markup reaching into `body.site`: +- `app.css` sets `overflow-x:hidden` on `body` (breaks `position:sticky`) and the body font via + `html[lang] body` (beats `body.site`): `public.css` overrides both (`overflow-x:clip`, + `html[lang] body.site`). Any new public rule that must beat `app.css` needs the same care. +- Reveal uses the `translate` property, not `transform`, so hover lifts (`transform`) still work. +- Flux always renders a hidden `data-flux-error`, so `app.css` paints every Flux input red; auth + styles override it unless the error is visible (`:not(.hidden)`). +- A Volt template that starts with a Blade `@if` gets no Livewire root (form unbound, only visible + in the browser console): wrap such templates in one root `
`. +- A broad link-colour rule on auth pages must exclude `[data-test^=language-switch]`: its active + label is white on olive, and an olive link colour erased it. +- After a change, check text against its background (contrast of active, hover and filled states) + in a screenshot, not only layout metrics. + ## Design Requirements (from PRD) Below: the dashboards' palette and rules. Public pages: Part A of `docs/ux-design.md`. diff --git a/docs/ux-design.md b/docs/ux-design.md index 097a05d..9b35441 100644 --- a/docs/ux-design.md +++ b/docs/ux-design.md @@ -93,7 +93,7 @@ emails, PDFs, `/forms/nablus-workshop`. | `--forest` | `#2D3624` | hero frame ground, pillar band, booking card, hover fill of service rows | | `--forest-2` | `#232A1C` | footer only (depth) | | `--gold` | `#A68966` | gold buttons, rules, row numbers, focus ring | -| `--gold-ink` | `#8A7555` | gold text on cream (labels, dates) | +| `--gold-ink` | `#7A6648` | gold text on cream (labels, dates) — darkened from the brand gold-hover `#8A7555` on 2026-10-31 so small text meets WCAG AA (4.9:1 on cream, 5.5:1 on white) | | `--gold-lt` | `#C4A882` | small gold text on forest | | `--cream` | `#F4F1EA` | page ground | | `--olive` | `#4A5D23` | link hover, emphasis word in the hero, active accents |