feat: update global styles and component designs for enhanced aesthetics and responsiveness, including new gradients, shadows, and transitions

This commit is contained in:
Julien Froidefond
2025-12-07 17:25:58 +01:00
parent d4db94d156
commit 1548ce4b0d
8 changed files with 243 additions and 163 deletions

View File

@@ -46,14 +46,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
return (
<div className="grid gap-3 sm:gap-4 grid-cols-2 lg:grid-cols-4">
<Card
className={cn(
"border shadow-sm bg-gradient-to-br",
totalBalance >= 0
? "from-emerald-50/50 to-card dark:from-emerald-950/20 dark:to-card"
: "from-red-50/50 to-card dark:from-red-950/20 dark:to-card"
)}
>
<Card className="border shadow-sm">
<CardHeader className="flex flex-row items-start justify-between space-y-0 pb-2 px-4 pt-4 sm:px-6 sm:pt-6">
<CardTitle className="text-sm font-medium text-muted-foreground leading-tight">
Solde Total
@@ -77,7 +70,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
</CardContent>
</Card>
<Card className="border shadow-sm bg-gradient-to-br from-emerald-50/50 to-card dark:from-emerald-950/20 dark:to-card">
<Card className="border shadow-sm">
<CardHeader className="flex flex-row items-start justify-between space-y-0 pb-2 px-4 pt-4 sm:px-6 sm:pt-6">
<CardTitle className="text-sm font-medium text-muted-foreground leading-tight">
Revenus du mois
@@ -99,7 +92,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
</CardContent>
</Card>
<Card className="border shadow-sm bg-gradient-to-br from-red-50/50 to-card dark:from-red-950/20 dark:to-card">
<Card className="border shadow-sm">
<CardHeader className="flex flex-row items-start justify-between space-y-0 pb-2 px-4 pt-4 sm:px-6 sm:pt-6">
<CardTitle className="text-sm font-medium text-muted-foreground leading-tight">
Dépenses du mois
@@ -121,7 +114,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
</CardContent>
</Card>
<Card className="border shadow-sm bg-gradient-to-br from-blue-50/50 to-card dark:from-blue-950/20 dark:to-card">
<Card className="border shadow-sm">
<CardHeader className="flex flex-row items-start justify-between space-y-0 pb-2 px-4 pt-4 sm:px-6 sm:pt-6">
<CardTitle className="text-sm font-medium text-muted-foreground leading-tight">
Pointage