feat(03-01): add CSS animation tokens, i18n keys, and carryover display

- Add collapsible-open/close keyframes and CSS animation tokens to index.css
- Add dashboard.sections and dashboard.carryoverIncludes keys to en.json and de.json
- Add optional subtitle/subtitleClassName props to StatCard
- Extend SummaryStrip balance prop with carryoverSubtitle/carryoverIsNegative
- Compute and pass carryover subtitle from DashboardContent to SummaryStrip
This commit is contained in:
2026-03-17 15:07:08 +01:00
parent 1a4035bea1
commit 21ce6d8230
6 changed files with 51 additions and 3 deletions

View File

@@ -3,7 +3,12 @@ import { StatCard } from "./StatCard"
interface SummaryStripProps {
income: { value: string; budgeted: string }
expenses: { value: string; budgeted: string }
balance: { value: string; isPositive: boolean }
balance: {
value: string
isPositive: boolean
carryoverSubtitle?: string
carryoverIsNegative?: boolean
}
t: (key: string) => string
}
@@ -39,6 +44,8 @@ export function SummaryStrip({
title={t("dashboard.availableBalance")}
value={balance.value}
valueClassName={balance.isPositive ? "text-on-budget" : "text-over-budget"}
subtitle={balance.carryoverSubtitle}
subtitleClassName={balance.carryoverIsNegative ? "text-over-budget" : undefined}
/>
</div>
)