From 781d2d655e620fd041cf4315b5d6fd6837952c7a Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Sun, 25 Oct 2026 16:00:24 -0700 Subject: History rows no longer wrap: the recipient's name chip keeps to one line (ellipsized when it must) and the "in progress" tag sits beside the time, not in the title row where it broke the name mid-word in the narrow wallet column Co-Authored-By: Claude Fable 5.1 --- src/style.css | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 31231fe..460b584 100644 --- a/src/style.css +++ b/src/style.css @@ -359,6 +359,10 @@ textarea.send-dest::placeholder { font-family: var(--sans); } /* ---- lists (tx / utxo) ---- */ .list { display: flex; flex-direction: column; } .item { display: flex; align-items: center; gap: 12px; padding: 13px 2px; border-top: 1px solid var(--line); } +/* the middle column may shrink: a long name chip beside the label then + ellipsizes on one line instead of breaking mid-name and pushing the + amount about */ +.item > .grow { min-width: 0; } .item:first-child { border-top: 0; } .ico { width: 34px; height: 34px; border-radius: 9px; flex: none; display: grid; place-items: center; font-size: 16px; } .ico.in { background: var(--green-soft); color: var(--green); } @@ -366,7 +370,7 @@ textarea.send-dest::placeholder { font-family: var(--sans); } .amount-pos { color: var(--green); font-family: var(--mono); font-weight: 600; } .amount-neg { color: var(--red); font-family: var(--mono); font-weight: 600; } .amount { font-family: var(--mono); font-weight: 600; } -.tag { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; } +.tag { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; white-space: nowrap; flex: none; } .tag.pending { background: var(--accent-soft); color: var(--accent-ink); } .tag.conf { background: var(--green-soft); color: var(--green); } @@ -1215,7 +1219,8 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; } .profile-banner + .row .profile-avatar { border: 3px solid var(--paper); box-sizing: content-box; } -.zap-chip { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; background: var(--surface2); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px 1px 2px; } +.zap-chip { display: inline-flex; gap: 5px; align-items: center; cursor: pointer; background: var(--surface2); border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px 1px 2px; min-width: 0; max-width: 100%; } +.zap-chip > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .chat-avatar.mini { width: 18px; height: 18px; font-size: 8px; flex-shrink: 0; } /* A feed row is the one place a face is the point, not a label on a line — Amethyst gives it 55dp; at our 30px it read as a bullet beside the post. -- cgit v1.2.3