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: lock cluster to 158px wide + right-edge anchor

Browse Source 
Was wrapping into 4+ rows at narrow widths because the cluster's
grid column could shrink below the 3-icon cap. Set both min-width
and max-width to the 3-icon row width and justify-self:end on the
cluster so the icons stay glued to the right edge instead of
sliding toward the middle when the cluster is wider than its
content.
This commit is contained in:
pewdiepie-archdaemon
2026-06-11 22:28:48 +09:00
parent debd2cd386
commit 73dbf3cde7
1 changed files with 27 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+27 -3
View File
@@ -10426,6 +10426,24 @@ textarea.memory-add-input {
.memory-bulk-bar.hidden { .memory-bulk-bar.hidden {
display: none; display: none;
} }
/* Enabled/Disabled text label next to an admin toggle.
The text auto-flips via :has() on the row containing the input. */
.admin-toggle-state {
font-size: 11px;
font-weight: normal;
letter-spacing: 0.02em;
}
.admin-card > div:has(.admin-switch input) .admin-toggle-state::before {
content: "Disabled";
color: var(--fg);
opacity: 0.55;
}
.admin-card > div:has(.admin-switch input:checked) .admin-toggle-state::before {
content: "Enabled";
color: var(--accent, var(--red));
opacity: 1;
}
/* Nudge the bulk-bar action buttons up 2px (and Memory's -2px left) to /* Nudge the bulk-bar action buttons up 2px (and Memory's -2px left) to
align with the row baseline. Covers both the Memory bulk bar align with the row baseline. Covers both the Memory bulk bar
(Cancel/Delete) and the Skills bulk bar (Cancel/Approve/Delete) — both (Cancel/Delete) and the Skills bulk bar (Cancel/Approve/Delete) — both
@@ -28169,12 +28187,18 @@ button .spinner-whirlpool {
min-width: 60px; min-width: 60px;
} }
/* Medium reader widths: cap the cluster at 3 icons per row so it /* Medium reader widths: cap the cluster at 3 icons per row so it
never wraps past 2 rows (3 top + 3 bottom). Below this break the never wraps past 2 rows. min-width forces the cluster to reserve
chips start sharing the width with a 2-row cluster instead of enough room for 3 icons in a row — without it, grid col 2 could
the icons multiplying into 3+ rows. */ shrink below the cap and the cluster fanned out into 4+ short
rows. */
@container emailreader (max-width: 600px) { @container emailreader (max-width: 600px) {
.email-reader-meta > .email-reader-actions-inline { .email-reader-meta > .email-reader-actions-inline {
min-width: calc(48px * 3 + 4px * 2);
max-width: calc(48px * 3 + 4px * 2); max-width: calc(48px * 3 + 4px * 2);
/* Right-align the (now wider) cluster so the icons stay glued
to the right edge instead of drifting to the middle when the
cluster is wider than its content (e.g. a 2-row stack of 3). */
justify-self: end;
} }
} }
/* Very narrow reader: once the chip span has shrunk to its ~4 /* Very narrow reader: once the chip span has shrunk to its ~4