cards: orange right-aligned zap-total badge next to view counts (#47 follow-up)

Video cards show the total sats from the shared zapTotals cache: new
--color-zap token (bitcoin orange, both themes), badge pushed to the
engagement row's end so views/comments stay left-aligned, hidden until a
nonzero total is known. The list view's zap binder fills [data-zap-total]
on bind (also scheduling the batched receipt fetch) and one shared change
listener updates every bound card as receipt batches land.

Co-Authored-By: Claude Fable 5 <[email protected]>
This commit is contained in:
thePR0M3TH3ANandClaude Fable 5 committed 2026-07-03 21:49:35 -04:00
1 parent 8dfd2034b0
commit 86d7db4b1a
8 files changed
+286 -2

No files matched your search

+12
View File
@@ -2904,6 +2904,18 @@
transform-origin: top center;
}
/* Zap total on video cards (#47 follow-up): orange, pushed to the row's end
so views/comments stay left-aligned and sats sit right-aligned. Hidden
(via the utility class) until a nonzero total is known. */
.video-card__zaps {
color: var(--color-zap);
margin-inline-start: auto;
}
.video-card__zaps .zap-total-text {
font-variant-numeric: tabular-nums;
}
/* #43: always-visible active-identity pill. Rendered after the header in
flow and pulled up with a negative block-start margin so it sits half-on /
half-off the header divider — every pane shows who you're acting as. */
+4
View File
@@ -509,6 +509,8 @@
--color-accent: rgb(99 102 241);
--color-accent-strong: rgb(79 70 229);
--color-accent-pressed: rgb(67 56 202);
/* Zap totals (sats) — bitcoin orange, darker for light-bg contrast. */
--color-zap: rgb(217 119 6);
--color-accent-override: rgb(84 0 17);
--color-accent-strong-override: rgb(254 0 50);
--color-accent-pressed-override: rgb(169 0 33);
@@ -696,6 +698,8 @@
--color-accent: rgb(129 140 248);
--color-accent-strong: rgb(99 102 241);
--color-accent-pressed: rgb(79 70 229);
/* Zap totals (sats) — bitcoin orange. */
--color-zap: rgb(247 147 26);
--color-accent-override: rgb(84 0 17);
--color-accent-strong-override: rgb(254 0 50);
--color-accent-pressed-override: rgb(169 0 33);