From d95abaff1b9606f0da9da9f0ee273a37953912a6 Mon Sep 17 00:00:00 2001 From: pewdiepie-archdaemon Date: Thu, 11 Jun 2026 22:21:04 +0900 Subject: [PATCH] Email reader: cap action cluster at 2 rows then overlay with shadow MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Three-step shrink: 1. > 600px pane: cluster sits in col 2 as 1 row of 6 2. 380-600px pane: cluster capped at 3-icon width so wrapping stops at 3 + 3 (max 2 rows) — chips share width with the 2-row cluster instead of multiplying into 3+ rows 3. < 380px pane: cluster snaps to absolute overlay with left-edge box-shadow, still capped at 3-icon width so it's the same 2-row shape but floating above the truncated chips --- static/style.css | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/static/style.css b/static/style.css index 0464f78da..1fb7e47e5 100644 --- a/static/style.css +++ b/static/style.css @@ -28149,6 +28149,15 @@ button .spinner-whirlpool { .email-reader-meta .recipient-chips { min-width: 60px; } +/* Medium pane widths: cap the cluster at 3 icons per row so it + never wraps past 2 rows (3 top + 3 bottom). Below this break the + chips start sharing the width with a 2-row cluster instead of + the icons multiplying into 3+ rows. */ +@container docpane (max-width: 600px) { + .email-reader-meta > .email-reader-actions-inline { + max-width: calc(48px * 3 + 4px * 2); + } +} /* Very narrow undocked panes: once the chip span has shrunk to its ~4-character min, the cluster snaps to absolute overlay with a soft shadow so it visually floats above the truncated chip. */ @@ -28158,7 +28167,7 @@ button .spinner-whirlpool { top: 1px; right: 0; margin-top: 0; - max-width: none; + max-width: calc(48px * 3 + 4px * 2); z-index: 2; background: linear-gradient(to right, transparent 0, var(--bg) 18px); padding-left: 22px;