From ff144b0b057e8ac76a628adfa02c556d5c6214c9 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Mon, 3 Aug 2026 08:48:18 -0700 Subject: Balance card: one account at a time, swipe or dots to flip MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replaces the segmented toggle and the always-visible second balance. The card now shows the account you're in at full size with a plain-word descriptor ("Instant · free to send" / "On-chain · mining fees apply"), two dots to flip, and a sideways slide when it changes. A swipe that starts on the card switches account instead of tab; swipes anywhere else still move between Receive/Send/History. Fixes a real mobile bug found while testing: a touch sequence still fires a compatibility click at the release point, so every swipe was ALSO pressing whatever sat under the finger (which is what kept bouncing the test wallet back to the unlock screen). One click is now swallowed after a recognized swipe. Co-Authored-By: Claude Fable 5 Claude-Session: https://claude.ai/code/session_01Wvj4aoeMZwA7VUGdJP9Swi --- src/style.css | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 3a5ab97..0131556 100644 --- a/src/style.css +++ b/src/style.css @@ -387,7 +387,6 @@ hr.divider { margin: 16px 0; } .balance-move { gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); text-align: left; } .balance-move .seg { display: flex; width: 100%; } .balance-move .seg button { flex: 1; } -.balance-seg { display: inline-flex; margin-bottom: 6px; } .send-suggest { max-height: 260px; overflow-y: auto; } .clickable { cursor: pointer; } .profile-avatar { width: 64px; height: 64px; font-size: 18px; } @@ -513,3 +512,10 @@ body::after { @keyframes mark-float { 50% { transform: translateY(-6px); } } @media (prefers-reduced-motion: reduce) { .onb-mark { animation: none; } } .onb-addr { color: var(--muted); font-family: var(--mono); font-size: 13px; } +/* balance card: one account at a time, dots to flip */ +.balance-face { min-height: 118px; } +.balance-note { margin-top: 2px; } +.balance-dots { display: flex; gap: 7px; align-items: center; } +.bdot { width: 8px; height: 8px; padding: 0; border-radius: 50%; border: 0; background: var(--line-strong); cursor: pointer; transition: background .18s, transform .18s; } +.bdot:hover { transform: scale(1.25); background: var(--muted); } +.bdot.on { background: var(--accent); transform: scale(1.15); } -- cgit v1.2.3