Salastil/odysseus
1
0
Fork 0
mirror of https://github.com/pewdiepie-archdaemon/odysseus.git synced 2026-06-17 02:05:22 -04:00
Code Issues Packages Projects Releases Wiki Activity

Email reader: To/Cc expand as floating panel instead of inline reflow

Browse Source 
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.
This commit is contained in:
pewdiepie-archdaemon
2026-06-13 07:30:30 +09:00
parent 0351e5e166
commit 37e49246a6
1 changed files with 17 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+17 -2
View File
@@ -28399,11 +28399,26 @@ button .spinner-whirlpool {
.email-reader-meta-details { .email-reader-meta-details {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* 6px between To and Cc, plus 4px breathing room below From. */
gap: 6px; gap: 6px;
margin-top: 4px;
} }
.email-reader-meta-details[hidden] { display: none; } .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 { .email-reader-header > .email-reader-meta {
flex: 1; min-width: 0; flex: 1; min-width: 0;
opacity: 0.85; line-height: 1.7; font-size: 11px; opacity: 0.85; line-height: 1.7; font-size: 11px;