From 37e49246a6a0c5f3a803e5ed12ade2c6ab3fe0b0 Mon Sep 17 00:00:00 2001
From: pewdiepie-archdaemon <pewdiepie-archdaemon@users.noreply.github.com>
Date: Sat, 13 Jun 2026 07:30:30 +0900
Subject: [PATCH] Email reader: To/Cc expand as floating panel instead of
 inline reflow
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

When the chevron opens the details, the To/Cc rows pop up as an
absolutely-positioned panel anchored to the bottom of the meta
block — with bg, border, rounded corners and a shadow. Nothing
in the rest of the header reflows: From row stays put, the action
cluster stays put, the email body content stays put. This kills
all the height-/spacing-jump quirks the inline-expanded design
was fighting.
---
 static/style.css | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/static/style.css b/static/style.css
index 4ffa4e397..afeaa31d6 100644
--- a/static/style.css
+++ b/static/style.css
@@ -28399,11 +28399,26 @@ button .spinner-whirlpool {
 .email-reader-meta-details {
   display: flex;
   flex-direction: column;
-  /* 6px between To and Cc, plus 4px breathing room below From. */
   gap: 6px;
-  margin-top: 4px;
 }
 .email-reader-meta-details[hidden] { display: none; }
+/* When expanded, To/Cc pop up as a floating panel below the From
+   row instead of pushing the email body down. From-row stays
+   exactly where it was; nothing else has to reflow, which kills
+   all the jump/realign quirks. */
+.email-reader-meta > .email-reader-meta-details:not([hidden]) {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  margin-top: 4px;
+  background: var(--bg);
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  padding: 8px 10px;
+  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
+  z-index: 5;
+}
 .email-reader-header > .email-reader-meta {
   flex: 1; min-width: 0;
   opacity: 0.85; line-height: 1.7; font-size: 11px;