fix(tradein/v2): пометка «В ОФФЕР» + сузить реестровую карточку (#1991) #2321

Merged
lekss361 merged 1 commit from fix/1991-tradein-price-hierarchy into main 2026-07-03 21:28:51 +00:00

View file

@ -15,6 +15,7 @@ import type { ResultPanelData } from "./mappers";
const {
accent,
accentDeep,
onAccent,
ink,
body,
body2,
@ -172,7 +173,14 @@ export default function ResultPanel({
<div
style={{
display: "grid",
gridTemplateColumns: "1fr 1fr 1fr",
// #1991 — the registry (ДКП) tile is an external anchor, not a peer
// of the two prices that actually matter (asking / expected). Equal
// 1fr columns still read as "three equivalent options" even with
// the demoted colors/type-scale below, so the two primary cards get
// ~50% more width and the registry tile narrows into a visibly
// secondary, reference-only column (closer to a convergence strip
// than a full-size card, per audit acceptance criteria).
gridTemplateColumns: "1.3fr 1.3fr 0.85fr",
gap: 14,
flex: "0 0 auto",
}}
@ -186,6 +194,8 @@ export default function ResultPanel({
// value so the user can't confuse it with the registry figure; the
// registry card is demoted to a softer, smaller, muted "СПРАВОЧНО"
// tile. Value scale reads expected(40) ≫ asking(30) > ДКП(28).
// #1991 — column width above is the third, independent axis: asking
// and expected visually dominate the row, ДКП is narrow/secondary.
//
// H1 — when the expected card has no prediction (emptyNote), it drops
// to an honest empty-state and the accent frame moves onto the asking
@ -232,19 +242,48 @@ export default function ResultPanel({
/>
<div
style={{
fontSize: 9.5,
letterSpacing: 1.5,
// Contrast follow-up (audit #2266): accent (#2e8bff) on the
// headline card's pale infoSoftBg tint measured ≈2.87:1 — below
// even the AA "large text" floor (3:1). accentDeep is the same
// brand hue, darkened (existing token, not a one-off hex) — it
// clears ~4.2:1 here, so the label reads reliably too.
color: isHeadline ? accentDeep : isRegistry ? muted2 : body2,
fontWeight: isHeadline ? 600 : undefined,
lineHeight: 1.6,
display: "flex",
alignItems: "flex-start",
justifyContent: "space-between",
gap: 8,
}}
>
{lines(card.title)}
<div
style={{
fontSize: 9.5,
letterSpacing: 1.5,
// Contrast follow-up (audit #2266): accent (#2e8bff) on the
// headline card's pale infoSoftBg tint measured ≈2.87:1 — below
// even the AA "large text" floor (3:1). accentDeep is the same
// brand hue, darkened (existing token, not a one-off hex) — it
// clears ~4.2:1 here, so the label reads reliably too.
color: isHeadline ? accentDeep : isRegistry ? muted2 : body2,
fontWeight: isHeadline ? 600 : undefined,
lineHeight: 1.6,
}}
>
{lines(card.title)}
</div>
{/* #1991 explicit "this is the figure that goes into the offer"
mark on the headline card, so the two dominant prices are not
just visually bigger but literally labelled which one to quote. */}
{isHeadline && !isEmptyCard && (
<span
style={{
flex: "0 0 auto",
fontSize: 8,
fontWeight: 700,
letterSpacing: 1,
color: onAccent,
background: accentDeep,
borderRadius: 3,
padding: "3px 6px",
whiteSpace: "nowrap",
}}
>
В ОФФЕР
</span>
)}
</div>
{isRegistry && (
<div