Coder/aurum
1
0
Fork 0
mirror of https://github.com/Zproger/Aurum.git synced 2026-10-13 11:06:40 +07:00
Code Issues Packages Projects Releases Wiki Activity

fix: reserve fixed-width chevron slot so category amounts stay aligned

Browse Source 
Стрелка-шеврон появлялась только у строк с дочерними категориями, из-за
чего сумма в такой строке сдвигалась влево относительно остальных.
Теперь под стрелку всегда резервируется одинаковое место (пустое, если
разбивки нет), и суммы во всех строках выравниваются по одному краю.
This commit is contained in:
ZProger
2026-08-30 19:15:31 +03:00
parent b4503a933f
commit 84dc8e9721
2 changed files with 30 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/src/components/dashboard/SpendingByCategoryCard.tsx
View File

@@ -89,16 +89,21 @@ export function SpendingByCategoryCard({ items }: SpendingByCategoryCardProps) {
<span className="shrink-0 text-sm font-medium tabular-nums text-text-primary"> <span className="shrink-0 text-sm font-medium tabular-nums text-text-primary">
{formatCurrency(item.amount)} {formatCurrency(item.amount)}
</span> </span>
{hasChildren && ( {/* Fixed-width slot on every row, populated or not — a
<button chevron shown only on rows with children would shift
type="button" their amount left relative to every other row's. */}
aria-label={t("common.expand")} <span className="flex h-6 w-5 shrink-0 items-center justify-center">
onClick={() => setBreakdownItem(item)} {hasChildren && (
className="shrink-0 rounded-md p-1 text-text-muted hover:bg-surface-2 hover:text-text-primary" <button
> type="button"
<ChevronRight size={15} /> aria-label={t("common.expand")}
</button> onClick={() => setBreakdownItem(item)}
)} className="rounded-md p-0.5 text-text-muted hover:bg-surface-2 hover:text-text-primary"
>
<ChevronRight size={15} />
</button>
)}
</span>
</li> </li>
); );
})} })}

25
frontend/src/components/reports/CategoryRankingCard.tsx
View File

@@ -80,16 +80,21 @@ export function CategoryRankingCard({ items, isLoading, selectedCategoryId, onSe
{formatCurrency(item.amount)} {formatCurrency(item.amount)}
</span> </span>
</button> </button>
{hasChildren && ( {/* Fixed-width slot on every row, populated or not — a
<button chevron shown only on rows with children would shift
type="button" their amount left relative to every other row's. */}
aria-label={t("common.expand")} <span className="mr-1 flex h-8 w-7 shrink-0 items-center justify-center">
onClick={() => setBreakdownItem(item)} {hasChildren && (
className="mr-1 shrink-0 rounded-md p-1.5 text-text-muted hover:text-text-primary" <button
> type="button"
<ChevronRight size={14} /> aria-label={t("common.expand")}
</button> onClick={() => setBreakdownItem(item)}
)} className="rounded-md p-1.5 text-text-muted hover:text-text-primary"
>
<ChevronRight size={14} />
</button>
)}
</span>
</div> </div>
</li> </li>
); );