From 6f52af0c2cf76cbab76052f189cd458127c335df Mon Sep 17 00:00:00 2001 From: "russell@unturf.com" Date: Tue, 12 May 2026 18:40:22 -0400 Subject: [PATCH] =?UTF-8?q?fix:=20actions=20hub=20=E2=80=94=20cap=20at=20t?= =?UTF-8?q?wo=20columns,=20restore=20gap,=20always=20show=20Offers=20butto?= =?UTF-8?q?n?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The previous .action-button-grid used auto-fit/minmax(15rem,1fr) which produced four columns on a wide well, and .mps-button's `min-width: 100%` + auto margins fought grid track sizing so the gap collapsed and buttons touched. Now: single column on narrow, exactly two equal columns at ≥720px (auto-flow keeps them balanced), explicit column/row gap, and the grid resets .mps-button min-width/margins. The "🤝 Offers" button is now always shown to shop owners (was gated on shop.offer_enabled) so the offers inbox is always reachable. --- CLAUDE.md | 12 ++++++---- make_post_sell/static/css/common.css | 29 ++++++++++++++++++------ make_post_sell/templates/actions_view.j2 | 2 -- 3 files changed, 29 insertions(+), 14 deletions(-) diff --git a/CLAUDE.md b/CLAUDE.md index b989218..e2dd45c 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -474,11 +474,13 @@ machines and architecture. ### Actions hub (`/actions/view`) -`actions_view.j2` is one flat `.action-button-grid` (Grid `auto-fit`, -`minmax(15rem, 1fr)`) of `.mps-button` links inside an `.action-columns` -well — no `
` spacers, no fixed two-column split. Add new operator -shortcuts as another `` in that -grid; it balances and wraps on its own. +`actions_view.j2` is one flat `.action-button-grid` of `.mps-button` links +inside an `.action-columns` well — single column on narrow viewports, +**at most two equal columns** at ≥720px (`grid-template-columns: 1fr 1fr`), +auto-flow row-by-row so the columns stay balanced. No `
` spacers. The +grid resets `.mps-button`'s `min-width: 100%` + auto margins (they fight +track sizing and eat the `gap`). Add a new operator shortcut as another +`` in that grid. ## Feature Kill Switches (MPS-22) diff --git a/make_post_sell/static/css/common.css b/make_post_sell/static/css/common.css index 98c70ad..a39b59e 100644 --- a/make_post_sell/static/css/common.css +++ b/make_post_sell/static/css/common.css @@ -2025,24 +2025,39 @@ section.checkout-page .well { background-image: url("/static/img/trans-green.png"); } -/* Action hub (actions_view.j2): one flat, balanced grid of buttons that - wraps responsively. Track min-width (15rem) is comfortably wider than - the widest button label so nowrap buttons never overflow the well. - Grid only — no flex. */ +/* Action hub (actions_view.j2): one flat list of operator-shortcut + buttons that auto-flows into AT MOST two equal columns (single column + on narrow viewports). Grid only — no flex, no
spacers. + `.mps-button` defaults to `min-width: 100%` + auto margins which fights + grid track sizing and eats the gap, so we reset those on grid items. */ .action-columns { display: grid; - max-width: 1100px; + max-width: 760px; margin: 0 auto; padding: var(--space-5, 20px); } .action-button-grid { display: grid; - grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); - gap: var(--space-3, 12px); + grid-template-columns: 1fr; + column-gap: var(--space-4, 16px); + row-gap: var(--space-3, 12px); align-content: start; } +@media (min-width: 720px) { + .action-button-grid { + grid-template-columns: 1fr 1fr; + } +} + +.action-button-grid .mps-button { + min-width: 0; + width: 100%; + box-sizing: border-box; + margin: 0; +} + /* markup editor css */ diff --git a/make_post_sell/templates/actions_view.j2 b/make_post_sell/templates/actions_view.j2 index 43132f9..412d8d6 100644 --- a/make_post_sell/templates/actions_view.j2 +++ b/make_post_sell/templates/actions_view.j2 @@ -14,9 +14,7 @@ {% if request.shop.gift_card_enabled %} 🎁  Gift Cards {% endif %} - {% if request.shop.offer_enabled %} 🤝  Offers - {% endif %} 👤  Shop Users 💰  Shop Sales 💬  Shop Comments