Uh oh!
There was an error while loading. Please reload this page.
docs: tick [P0-B] in the token-unification follow-ups (verified done) - #486
Conversation
beta-glow / .beta-glow-btn no longer exist anywhere in frontend/src, and the landing CTAs are the shared <Button variant="primary" size="xl">. Landed with the #291 motion work + the #287 beta-pill removal; the item was simply never ticked, so a reader would have re-done it. Notes that the glow was deleted outright rather than converted to a --brand-glow entrance — satisfies the intent, and explains why --brand-glow has no consumers. Docs-only; no code paths touched. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This pull request has been ignored for the connected project Preview Branches by Supabase. |
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThe follow-up documentation marks the beta CTA re-skin complete, recording adoption of shared primary button styling and removal of the former pill and glow treatments. ChangesBeta CTA styling follow-up
Estimated code review effort: 1 (Trivial) | ~2 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Deploying with |
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs | frontend-staging | 0d3aaeb | Commit Preview URL Branch Preview URL | Jul 31 2026, 01:37 AM |
Uh oh!
There was an error while loading. Please reload this page.
Tick [P1-E] in the token-unification follow-ups. This PR is what completes it, and the repo's convention is to fold that tick into the same PR — #486 existed purely to backfill a tick missed the same way. Name the shadow hue change for what it is. The comments described the adoption as de-drifting "three shadow alphas, two radii, one missing inset", which is accurate but incomplete in a misleading direction: the shadow's base COLOUR was the one value that had not drifted — all five sites agreed on slate rgba(15,23,42). The token is rgba(19,38,16) = --sap-900, the base the app's other shadows use, so adopting it re-tints these shadows rather than reconciling them. Deliberate, and called out in the PR body, but a reader of the code would have assumed the colour was untouched. Now stated in globals.css and HeroCard.tsx. part of #288 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Tick [P1-E] in the token-unification follow-ups. This PR is what completes it, and the repo's convention is to fold that tick into the same PR — #486 existed purely to backfill a tick missed the same way. Name the shadow hue change for what it is. The comments described the adoption as de-drifting "three shadow alphas, two radii, one missing inset", which is accurate but incomplete in a misleading direction: the shadow's base COLOUR was the one value that had not drifted — all five sites agreed on slate rgba(15,23,42). The token is rgba(19,38,16) = --sap-900, the base the app's other shadows use, so adopting it re-tints these shadows rather than reconciling them. Deliberate, and called out in the PR body, but a reader of the code would have assumed the colour was untouched. Now stated in globals.css and HeroCard.tsx. part of #288 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* refactor(ui): extract the shared hero-card surface (#288) The warm gradient behind the sign-in and beta modals was inlined as a literal at five sites, and had already drifted at four of them: three different shadow alphas (0.12 / 0.15 / 0.18), two radii (20 / 24), and one card missing the inset highlight entirely. Meanwhile --surface-hero and --surface-hero-shadow sat in globals.css with zero consumers. Adds `.card--hero` (a named variant of .card, used as `card card--hero`) and `.hero-surface` (the gradient alone, for panels nested inside a hero card that must not restate its border, radius or shadow), plus a thin <HeroCard> wrapper that owns those classes and forwards everything else. Both classes are now the tokens' only consumers. This is a VISIBLE change, not a pure refactor, and an intended one: adopting the token moves the shadow hue from cool slate rgba(15,23,42) to the warm rgba(19,38,16) the rest of the app uses, unifies the alphas at 0.12, and gives the beta success modal the 24px radius and inset highlight its two siblings already had. The literal fallbacks in both CSS rules are deliberate. The tokens are scoped to `.public-surface, .landing-page`; every consumer sits inside that subtree today (verified — SignInModal is mounted only from the landing page, and nothing here portals to document.body), so the fallback is defensive rather than load-bearing. For a shared component it is the cheap guard against the first mount that isn't. data-testid="signin-modal" and "signin-close" are unchanged. Deliberately NOT folded in: the close button and the logo/wordmark row. The close buttons are not actually duplicated verbatim — they differ in offset (18 vs 14) and only one carries a testid — and the wordmark appears at 20 sites repo-wide with no shared component, so extracting it for 2 of them would leave a half-migration. #111 touches every icon site anyway; that is the coherent place for it. part of #288 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * docs+comments: close review findings on the hero-card extraction (#288) Tick [P1-E] in the token-unification follow-ups. This PR is what completes it, and the repo's convention is to fold that tick into the same PR — #486 existed purely to backfill a tick missed the same way. Name the shadow hue change for what it is. The comments described the adoption as de-drifting "three shadow alphas, two radii, one missing inset", which is accurate but incomplete in a misleading direction: the shadow's base COLOUR was the one value that had not drifted — all five sites agreed on slate rgba(15,23,42). The token is rgba(19,38,16) = --sap-900, the base the app's other shadows use, so adopting it re-tints these shadows rather than reconciling them. Deliberate, and called out in the PR body, but a reader of the code would have assumed the colour was untouched. Now stated in globals.css and HeroCard.tsx. part of #288 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(css): repair the hero-surface comment, and guard globals.css structurally (#288) The review-fix commit closed the hero-surface block comment early: the `*/` that used to end the whole comment stayed put while a new paragraph was inserted above it, so the rest of the original comment became raw stylesheet text. postcss reported it as "Unclosed string" at line 1007 — 780 lines below the actual mistake, at the first quote it happened to reach. It got that far because nothing in the fast lane reads this file as CSS. eslint lints JS/TS, tsc checks types, vitest never imports the stylesheet; CI's `lint + tsc + vitest` job went green on the broken file. The first thing that actually parses globals.css is the Next production build, which is why the local e2e cycle caught it and everything cheaper did not. Adds src/app/globals.test.ts: a dependency-free structural scan (comments, strings, brace depth) that fails on exactly this class of breakage, in the fast lane, pointing at the right line. Hand-rolled rather than importing postcss on purpose — postcss is only a transitive dependency here and the installed copy already drifts from CI's. It also tests itself: a second case feeds it each broken shape to prove it does not silently return "fine". part of #288 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
Docs-only, one checkbox.
While verifying the design-debt pool I found
[P0-B]still unticked although it is verifiably done:beta-glow/.beta-glow-btnno longer exist anywhere infrontend/src, and the landing CTAs are the shared<Button variant="primary" size="xl">(.btn .btn--primary .btn--xl) — app button language, no motion. It landed with the #291 motion work and the #287 beta-pill removal and was simply never ticked, so anyone trusting the doc would have re-done it.The note also records that the glow was deleted outright rather than converted into a
--brand-glowfinite entrance. That satisfies the item's intent (no perpetual motion, one button species) and explains why--brand-glowhas no consumers today.No code paths touched, so no e2e cycle.
🤖 Generated with Claude Code
Summary by CodeRabbit