From 05f228728eba7749ad2337fcf851cd55a1986873 Mon Sep 17 00:00:00 2001 From: Abdul Wahab Date: Fri, 31 Jul 2026 16:19:01 +0500 Subject: [PATCH] Fix uneven gallery squares and size the phone section copy The card row's squares came out three different widths: centering the cards in the gallery shrank each one to its own label, and the square is a share of its card. The cards take their column again and their contents do the centering. On the handset the section title and its paragraph were the smallest type on a board that has room for more, so both take a step up. Prepared with AI assistance (Cursor). Co-authored-by: Cursor --- picker/styles/picker.css | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/picker/styles/picker.css b/picker/styles/picker.css index 4ef7aad4a..f6e803633 100644 --- a/picker/styles/picker.css +++ b/picker/styles/picker.css @@ -5263,7 +5263,10 @@ body.picker-page { height: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ps-gap-md); - justify-items: center; + /* The cards keep their column's width so the three squares are one size; + what centers is their contents, below. Shrinking the card to its label + handed each square a different width. */ + justify-items: stretch; } .picker-preview-type .ps-desktop .ps-gallery-item { @@ -5382,6 +5385,14 @@ body.picker-page { gap: var(--ps-gap-xs); } +.picker-preview-type[data-surface="persuade"] .ps-phone-body .ps-editorial-copy strong { + font-size: calc(var(--pt-title) * 1.12); +} + +.picker-preview-type[data-surface="persuade"] .ps-phone-body .pt-section-body { + font-size: var(--pt-base); +} + /* One gap owns the spacing down the phone. The margins underneath it were a second, unrelated scale, and every element that carried one landed on a different interval from its neighbour. */