fix(web): restore the Dashboard status tiles' top padding

CardContent is shadcn's header-adjacent variant (`p-4 pt-0 sm:p-6 sm:pt-0`),
but the four Live-status tiles use it with no CardHeader. tailwind-merge lets
the call site's unprefixed `p-4` cancel the base `pt-0`, yet nothing cancels
`sm:pt-0` — so the tiles lost their top padding at >=640px only, and the
content sat against the top edge. Restores the top inset at the sm breakpoint
and lets the content fill the stretched grid cell so it stays centred when a
sibling tile is taller.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
2026-07-20 20:13:34 +02:00
co-authored by Claude Fable 5
parent 1262fec2ae
commit 84e1e5aeb4
+3 -3
View File
@@ -40,7 +40,7 @@ export const DashboardView: FC<{
on={s.audio_streaming}
/>
<Card>
<CardContent className="flex items-center justify-between p-4">
<CardContent className="flex flex-1 items-center justify-between p-4 sm:pt-6">
<span className="text-sm text-muted-foreground">
{m.status_paired_count()}
</span>
@@ -50,7 +50,7 @@ export const DashboardView: FC<{
</CardContent>
</Card>
<Card>
<CardContent className="flex items-center justify-between p-4">
<CardContent className="flex flex-1 items-center justify-between p-4 sm:pt-6">
<span className="text-sm text-muted-foreground">
{m.status_pin_pending()}
</span>
@@ -134,7 +134,7 @@ const StatCard: FC<{ icon: ReactNode; label: string; on: boolean }> = ({
on,
}) => (
<Card>
<CardContent className="flex items-center justify-between p-4">
<CardContent className="flex flex-1 items-center justify-between p-4 sm:pt-6">
<span className="flex items-center gap-2 text-sm text-muted-foreground">
{icon}
{label}