diff options
| author | Adam Soltys <[email protected]> | 2026-08-03 13:26:45 -0700 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2026-08-03 13:26:45 -0700 |
| commit | 5a602f87ddf314ba603da259e34fd40176e1f375 (patch) | |
| tree | 8f6b5b1c7c4ceb0644935c7fbf8e9993a58627f9 /src/style.css | |
| parent | 436af47e7219126f4c9b4e8d25c99a98bf6c37cb (diff) | |
| download | coinosv3-5a602f87ddf314ba603da259e34fd40176e1f375.tar.gz coinosv3-5a602f87ddf314ba603da259e34fd40176e1f375.zip | |
Balance card: a real button to change account, not two dots
The dots were an indicator pressed into service as a control — fine
under a thumb that can just swipe, too small for a mouse. They're
replaced by a pill in the header row naming the account it takes you to
(⇄ Savings / ⇄ Spending), which is both a proper click target and a
clearer answer to "what's the other one?". Swiping the card still works.
Co-Authored-By: Claude Fable 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01Wvj4aoeMZwA7VUGdJP9Swi
Diffstat (limited to 'src/style.css')
| -rw-r--r-- | src/style.css | 13 |
1 files changed, 9 insertions, 4 deletions
diff --git a/src/style.css b/src/style.css index c12efd3..d3bc9fa 100644 --- a/src/style.css +++ b/src/style.css @@ -515,10 +515,6 @@ body::after { /* balance card: one account at a time, dots to flip */ .balance-face { min-height: 96px; } .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); } /* amount input with an inline Max affordance */ .amt-field { position: relative; display: flex; flex: 1; min-width: 0; } .amt-field input { width: 100%; padding-right: 52px; } @@ -531,3 +527,12 @@ body::after { /* recipient chip: large variant for pay/zap screens */ .zap-chip.lg { gap: 8px; padding: 4px 12px 4px 4px; font-weight: 600; } .chat-avatar.chip-lg { width: 30px; height: 30px; font-size: 11px; flex-shrink: 0; } +/* the clickable way to change account (swiping only helps on touch) */ +.balance-switch { + display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; + padding: 6px 12px; font-size: 13px; font-weight: 600; + color: var(--muted); background: var(--surface2); + border: 1px solid var(--line); border-radius: 999px; cursor: pointer; +} +.balance-switch:hover { color: var(--ink); border-color: var(--line-strong); } +.balance-switch svg { opacity: .75; } |