engineering/make_post_sell
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 2 Packages Wiki Activity Actions

product page: 280px floor on the purchase column (two-column grid)

Browse source 
Per fox: the price / Add-To-Cart / Make-an-offer box gets squeezed too
narrow on mid-width viewports (960px–1200px) where the 2fr/1fr split
gives the 1fr column only ~250-300px, crushing the buttons.

section.two-column grid columns: minmax(0, 2fr) minmax(280px, 1fr)
- the images column can shrink (minmax(0, 2fr)) so the purchase
  column always gets its 280px minimum first
- once the viewport is wide enough, the columns return to the 2:1
  ratio up to the 1200px max-width

Grid only, no flex.

Tests pass (10 in target slices).
This commit is contained in:
russell@unturf.com 2026-05-11 17:29:55 -04:00
parent 46dd2cb929
commit 5cad5c3a0c
No known key found for this signature in database
1 changed files with 5 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

8
make_post_sell/static/css/common.css
View file

@ -2196,11 +2196,13 @@ textarea.markup-editor-textarea {
grid-template-columns: repeat(auto-fit, minmax(240px, .25fr));
}
/* We have the room to really break into 2 columns */
/* We have the room to really break into 2 columns. The purchase
column has a 280px floor so the price/Add-To-Cart/offer box never
gets crushed on mid-width viewports (960px–1200px). */
section.two-column {
display: grid;
grid-template-columns: 2fr 1fr;
grid-template-areas:
grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
grid-template-areas:
"images purchase"
"description purchase"
"comments purchase";