style(ui): polimento visual — tema, cards, dark mode e landing page

Raio de borda global 0.625rem → 0.7rem; ajustes finos em --card e --border.
DotPattern removido do layout, tela de auth e landing page.
Account-card redesenhado (cores de saldo, tooltip de flags de exclusão).
Budget-card, card-item, calendário (day-cell, event-modal) com layout revisado.
Auth-card-shell simplificado (sem glassmorphism/blob). Landing page com
mainFeatures + extraFeatures em grid único e dark mode nos botões de CTA.
Imagens de preview da landing atualizadas. CSS --data-7..10 removidas.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Felipe Coutinho
2026-04-20 17:52:17 +00:00
parent 5d84ae928a
commit 6d81ff8b53
67 changed files with 612 additions and 737 deletions

View File

@@ -149,9 +149,9 @@ export const InboxCard = memo(function InboxCard({
</div>
</CardHeader>
<CardContent className="flex-1 py-2">
<CardContent className="min-h-0 flex-1 overflow-hidden py-2">
{item.originalTitle && (
<p className="mb-1 text-sm font-medium">{item.originalTitle}</p>
<p className="mb-1 line-clamp-2 text-sm font-medium">{item.originalTitle}</p>
)}
<p className="line-clamp-4 whitespace-pre-wrap text-sm text-muted-foreground">
{item.originalText}

View File

@@ -102,32 +102,29 @@ export function InboxItemsList({
const groups = groupItemsByDay(items);
return (
<div className="space-y-6">
{groups.map((group) => (
<div key={group.label}>
<div className="mb-3 flex items-center gap-1 text-muted-foreground">
<RiCalendarEventLine className="size-3.5 shrink-0" />
<p className="text-sm font-medium">{group.label}</p>
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
{groups.flatMap((group) =>
group.items.map((item) => (
<div key={item.id} className="flex flex-col gap-1.5">
<div className="flex items-center gap-1.5 text-muted-foreground">
<RiCalendarEventLine className="size-3 shrink-0" />
<span className="text-xs font-medium">{group.label}</span>
</div>
<InboxCard
item={item}
readonly={readonly}
appLogoMap={appLogoMap}
onProcess={readonly ? undefined : onProcess}
onDiscard={readonly ? undefined : onDiscard}
onViewDetails={readonly ? undefined : onViewDetails}
onDelete={readonly ? onDelete : undefined}
onRestoreToPending={readonly ? onRestoreToPending : undefined}
selected={selectedIds.includes(item.id)}
onSelectToggle={onSelectToggle}
/>
</div>
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
{group.items.map((item) => (
<InboxCard
key={item.id}
item={item}
readonly={readonly}
appLogoMap={appLogoMap}
onProcess={readonly ? undefined : onProcess}
onDiscard={readonly ? undefined : onDiscard}
onViewDetails={readonly ? undefined : onViewDetails}
onDelete={readonly ? onDelete : undefined}
onRestoreToPending={readonly ? onRestoreToPending : undefined}
selected={selectedIds.includes(item.id)}
onSelectToggle={onSelectToggle}
/>
))}
</div>
</div>
))}
)),
)}
</div>
);
}