brut/bincio-activity
1
0
Fork 0
Code Issues Pull Requests Actions 8 Packages Projects Releases Wiki Activity

feat: show percentage next to progress bar in month header

Browse Source
This commit is contained in:
Davide Scaini
2026-06-03 23:55:52 +02:00
parent e967ef5322
commit 29eb1dfcdc
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/pages/support/index.astro
+4 -4
View File
@@ -424,13 +424,13 @@ function renderBudget() {
header.innerHTML = `
<span class="font-medium text-white shrink-0">${monthLabel(ym)}</span>
${pct !== null
? `<div class="flex-1 mx-2 h-1.5 rounded-full bg-zinc-800 overflow-hidden"><div class="h-full rounded-full" style="width:${pct}%;background:var(--accent)"></div></div>`
? `<div class="flex-1 mx-2 flex items-center gap-1.5"><div class="flex-1 h-1.5 rounded-full bg-zinc-800 overflow-hidden"><div class="h-full rounded-full" style="width:${pct}%;background:var(--accent)"></div></div><span class="text-xs text-zinc-500 shrink-0">${pct}%</span></div>`
: `<span class="flex-1"></span>`}
<span class="text-xs text-green-400">+${fmtEur(donated)}</span>
<span class="text-xs text-green-400"><span class="hidden sm:inline text-zinc-600 mr-0.5">donated</span>+${fmtEur(donated)}</span>
<span class="text-xs text-zinc-700">/</span>
<span class="text-xs text-red-400">−${fmtEur(spent)}</span>
<span class="text-xs text-red-400"><span class="hidden sm:inline text-zinc-600 mr-0.5">spent</span>−${fmtEur(spent)}</span>
<span class="text-xs text-zinc-700">/</span>
<span class="text-xs ${balance >= 0 ? 'text-zinc-300' : 'text-red-400'}">${balance >= 0 ? '+' : '−'}${fmtEur(Math.abs(balance))}</span>
<span class="text-xs ${balance >= 0 ? 'text-zinc-300' : 'text-red-400'}"><span class="hidden sm:inline text-zinc-600 mr-0.5">balance</span>${balance >= 0 ? '+' : '−'}${fmtEur(Math.abs(balance))}</span>
<span class="text-zinc-600 text-xs ml-1">${open ? '▲' : '▼'}</span>`;
header.addEventListener('click', () => {
if (expandedMonths.has(ym)) expandedMonths.delete(ym); else expandedMonths.add(ym);