mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 17:43:47 +00:00
fix(cabinet): equal-height StatCards so dashboard balance/referral align
In a grid, the wrapping <Link> stretched to the row height but the
StatCard inside only took content height, so the referral card (which has
a subValue line) rendered taller than the balance card ('один толще
другого'). Make StatCard fill its cell with h-full and stretch the
StatsGrid links. Verified by rendering both cards against the built CSS:
balance 86px->94px, now equal to referral's 94px.
This commit is contained in:
@@ -24,7 +24,7 @@ export default function StatsGrid({
|
||||
|
||||
return (
|
||||
<div className="grid grid-cols-2 gap-2.5">
|
||||
<Link to="/balance" className="block" data-onboarding="balance">
|
||||
<Link to="/balance" className="block h-full" data-onboarding="balance">
|
||||
<StatCard
|
||||
label={t('dashboard.stats.balance')}
|
||||
value={`${formatAmount(balanceRubles)} ${currencySymbol}`}
|
||||
@@ -33,7 +33,7 @@ export default function StatsGrid({
|
||||
trailing={chevron}
|
||||
/>
|
||||
</Link>
|
||||
<Link to="/referral" className="block">
|
||||
<Link to="/referral" className="block h-full">
|
||||
<StatCard
|
||||
label={t('dashboard.stats.referrals')}
|
||||
value={`${referralCount}`}
|
||||
|
||||
@@ -50,7 +50,7 @@ export function StatCard({
|
||||
const trendStyle = delta ? (TREND_STYLES[delta.trend] ?? TREND_STYLES.stable) : null;
|
||||
|
||||
return (
|
||||
<div className="rounded-xl bg-dark-800/30 p-3 transition-colors hover:bg-dark-800/50">
|
||||
<div className="h-full rounded-xl bg-dark-800/30 p-3 transition-colors hover:bg-dark-800/50">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<span className="truncate text-xs text-dark-500 sm:text-sm">{label}</span>
|
||||
{trailing}
|
||||
|
||||
Reference in New Issue
Block a user