From 1c919a636e53e1c89e334dd6179851bebfa5d6b1 Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Tue, 31 Mar 2026 19:52:04 +0700
Subject: [PATCH] Update card component styles for improved layout and
 consistency

- Adjusted padding and gap settings in the Card component for a more cohesive appearance.
- Enhanced the DataTableCard component by refining its class properties to ensure better alignment and visual consistency.
---
 web/src/lib/components/data-table/data-table-card.svelte | 2 +-
 web/src/lib/components/ui/card/card.svelte               | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/lib/components/data-table/data-table-card.svelte b/web/src/lib/components/data-table/data-table-card.svelte
index 419df3c..1c1d7d2 100644
--- a/web/src/lib/components/data-table/data-table-card.svelte
+++ b/web/src/lib/components/data-table/data-table-card.svelte
@@ -19,7 +19,7 @@
 	} = $props();
 </script>
 
-<Card.Root class={cn('overflow-hidden rounded-lg border border-border shadow-sm', className)}>
+<Card.Root class={cn('gap-0 py-0 overflow-hidden rounded-lg border border-border shadow-sm', className)}>
 	{#if title}
 		<div class="border-b border-border bg-muted/40 px-4 py-3">
 			<Card.Title class="text-base font-semibold">{title}</Card.Title>
diff --git a/web/src/lib/components/ui/card/card.svelte b/web/src/lib/components/ui/card/card.svelte
index d364eee..2b4f81a 100644
--- a/web/src/lib/components/ui/card/card.svelte
+++ b/web/src/lib/components/ui/card/card.svelte
@@ -15,7 +15,7 @@
 	bind:this={ref}
 	data-slot="card"
 	data-size={size}
-	class={cn("ring-foreground/10 bg-card text-card-foreground gap-0 overflow-hidden rounded-xl py-0 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-0 data-[size=sm]:py-0 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", className)}
+	class={cn("ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", className)}
 	{...restProps}
 >
 	{@render children?.()}