fix(landing): give the country lockups the partner-tile treatment - #2692
Conversation
The Pix wordmark in pix-brz.svg is mint #32BCAD. Against the homepage's #90A8ED that is 1.01:1 — the same luminance as the ground — so it reads as a rendering fault rather than a logo. It failed on cream too (2.15:1); the blue only made it obvious. A lighter card does not rescue it either: the mint is 2.35:1 on white and 1.17:1 on pink. Only the black mark clears 4.5:1. So each lockup now uses what #regulated-rails already ships one fold up: the pink partner tile, 1px black border and 4px hard shadow, holding the black mark on the white inner card that fold gives PIX and MercadoPago (both are line art, not heavy wordmarks, and go weak straight on the pink). The flags stay, but as their own assets drawn to one rule — the old SVGs baked flag and logo into a single file, so the logo could not move into a tile without splitting them. mepa-arg.svg also carried no outline at all, which is why Argentina dissolved into the background at 1.37:1; both flags now have the same 3px black edge and hold their silhouette on either ground. Also fixes the asset itself: pix-logo.svg declared viewBox "0 0 88 38" while its ink spans x = -15.7..87.7, so the left petal of the diamond was sheared off — visible on the rails marquee today, not just here. Both links keep their hrefs and now look like links: the tile lifts on hover and an underlined "Learn more ->" sits under each, reusing landingLearnMore, so no locale file changes. On mobile the pair sits above the phone, so the sticky CTA covers the screenshot instead of a link. Mobile and desktop share one block via md:contents, which drops the duplicated markup from four link elements to two.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
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 |
Verified on the previewhttps://peanut-wallet-git-fix-qrpay-lockup-house-tiles-squirrellabs.vercel.app/en Checked at 1280 and 390 against the deployed build, not the mockup:
CI: e2e, eslint, format, typecheck, unit, report, ci-success all pass. Not checked: |
…ground Implements mono projects/lp-refresh/handoff-qrpay-lockups.md (Konrad's revised ruling): the pink tile and white inner card go, the original wavy flag artwork returns (cropped flag-only via root viewBox — ink untouched), and the black marks sit directly on the section bg (9:1 on the homepage blue, 19:1 on the /quests cream). Mark scale L per the brief's recommendation — the PIX Banco Central strapline is illegible at S. Fixed-height slot keeps the marks on a shared baseline; the underlined Learn more stays as the sole click affordance. Kept from #2692: the pix-logo viewBox fix and the Manteca mobile/desktop collapse.
Stacked on
lp-refresh(#2690), which is where this fold's background moved to blue and whereManteca.tsxis already being changed.The bug
The Pix wordmark inside
pix-brz.svgis mint#32BCAD. Against the homepage's#90A8EDthat is 1.01:1 — the same luminance as the ground. It reads as a rendering fault, not a logo.It was already failing on cream (2.15:1); the blue only made it obvious. And a lighter card does not rescue it — the mint measures 2.35:1 on white and 1.17:1 on pink. Only the black mark clears 4.5:1 anywhere.
#90A8ED#32BCAD#3F96D7#177D32#0A0080What changed
Each lockup now uses what
#regulated-railsalready ships one fold up: the pink partner tile, 1px black border, 4px hard shadow, holding the black mark on the white inner card that fold gives PIX and MercadoPago. That inner card is not new here —RegulatedRails.tsxalready flags those two marksonWhitebecause they are line art rather than heavy wordmarks and go weak straight on the pink. Black on white in the tile is 21:1.The flags stay, but as their own assets drawn to one rule. The old SVGs baked flag and logo into a single file, so the logo could not move into a tile without splitting them.
mepa-arg.svgalso carried no black outline at all, which is why Argentina dissolved into the background; both flags now share the same 3px black edge and hold their silhouette on either ground.Asset fix, independent of this fold:
pix-logo.svgdeclaredviewBox="0 0 88 38"while its ink spans x = −15.7…87.7, so the left petal of the diamond was sheared off. That is visible on the rails marquee today. Widened to-15.5 0 102 38.Affordance: both links keep their hrefs and now look like links — the tile lifts on hover and an underlined
Learn more →sits under each, reusing the existinglandingLearnMorekey, so no locale files change.Mobile: the pair sits above the phone, so the sticky CTA covers the screenshot instead of a link. Mobile and desktop now share one block via
md:contents, which drops the duplicated markup from four link elements to two.mepa-arg.svgandpix-brz.svgare deleted —Manteca.tsxwas their only consumer.Checks
pnpm typecheckcleanpnpm test— 232 suites, 2973 passedpnpm prettier --check .cleanNot verified locally: the dev server would not serve on this sandbox (inotify watch limit exhausted, 36s+ compiles). The fold needs an eyes-on check on the Vercel preview before merge.
Open for review