diff --git a/frontend/src/routes/[fam]/+page.svelte b/frontend/src/routes/[fam]/+page.svelte index 21b2667..f40df27 100644 --- a/frontend/src/routes/[fam]/+page.svelte +++ b/frontend/src/routes/[fam]/+page.svelte @@ -473,52 +473,16 @@ Overall -
-
This week
-
- Points - {s.pointsEarned} +
+
+ Week + {s.pointsEarned} pts · £{Number(s.moneyEarned || 0).toFixed(2)} · {wkDone}/{wkTotal} + {#if (goals?.count ?? 0) > 0}🎉{goals?.count}{/if}
-
- Cash - £{Number(s.moneyEarned || 0).toFixed(2)} -
-
- Done - {wkDone}/{wkTotal} -
-
- Goals 🎉 - {goals?.count ?? 0} -
-
- Pocket Money - {pocketMoneyByMember.get(s.memberId) ?? 0} -
-
All time
-
- Points - {at?.points ?? s.pointsEarned} -
-
- Cash - £{Number(at?.cash ?? s.moneyEarned ?? 0).toFixed(2)} -
-
- Done - {sc.done}/{sc.total} -
-
- Goals 🎉 - {goalsAll?.count ?? 0} -
-
- Pocket Money - {pocketMoneyAllTimeByMember.get(s.memberId) ?? 0} +
+ All time + {at?.points ?? s.pointsEarned} pts · £{Number(at?.cash ?? s.moneyEarned ?? 0).toFixed(2)} · {sc.done}/{sc.total} + {#if (goalsAll?.count ?? 0) > 0}🎉{goalsAll?.count}{/if}
@@ -777,18 +741,18 @@ display: flex; justify-content: center; flex-wrap: wrap; - gap: 0.85rem; - margin: 3rem 0; + gap: 0.6rem; + margin: 0.9rem 0 0.7rem; } .donut-wrap { position: relative; - width: 62px; - height: 62px; + width: 54px; + height: 54px; flex-shrink: 0; } .donut-wrap canvas { - max-width: 62px; - max-height: 62px; + max-width: 54px; + max-height: 54px; } .donut-center { position: absolute; @@ -819,6 +783,49 @@ gap: 0.3rem; margin-bottom: 0.5rem; } + .member-stats.compact .mstat { + display: flex; + align-items: baseline; + gap: 0.4rem; + font-size: 0.76rem; + color: #374151; + background: rgba(255, 255, 255, 0.65); + border: 1px solid #e5e7eb; + border-radius: 8px; + padding: 0.28rem 0.5rem; + white-space: nowrap; + overflow: hidden; + } + .member-stats.compact .mstat.dim { + opacity: 0.75; + } + .mstat-tag { + font-size: 0.6rem; + font-weight: 800; + text-transform: uppercase; + letter-spacing: 0.06em; + color: #9ca3af; + flex-shrink: 0; + } + .mstat-main { + overflow: hidden; + text-overflow: ellipsis; + } + .mstat-main b { + font-weight: 800; + } + .mstat-main b.pts { + color: #7c3aed; + } + .mstat-main b.cash { + color: #059669; + } + .mstat-goals { + margin-left: auto; + flex-shrink: 0; + font-weight: 700; + color: #059669; + } .stat-row { display: flex; justify-content: space-between;