feat: redesign app UI — top nav, clean dashboard, warm branding
- Replace sidebar with top navigation bar (like Airbnb/Nextdoor) - Redesign dashboard: home cards, coming up tasks, quick action pills - Remove widget-heavy layout (charts, stats, activity feed) - Add landing page with hero, features, how-it-works, CTA sections - Update auth pages with split layout - Clean white theme with neutral grays, brand orange/teal accents - Friendly copy across all empty states and page headers - Add Bricolage Grotesque + Outfit fonts - Default to light mode Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -11,12 +11,16 @@ interface EmptyStateProps {
|
||||
|
||||
export function EmptyState({ icon: Icon, title, description, actionLabel, onAction }: EmptyStateProps) {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center py-16 text-center">
|
||||
<div className="rounded-full bg-muted p-4 mb-4"><Icon className="size-8 text-muted-foreground" /></div>
|
||||
<h3 className="text-lg font-semibold">{title}</h3>
|
||||
<p className="text-muted-foreground mt-1 max-w-sm">{description}</p>
|
||||
<div className="flex flex-col items-center justify-center py-20 text-center">
|
||||
<div className="size-16 rounded-2xl bg-[#FFF3EB] flex items-center justify-center mb-5">
|
||||
<Icon className="size-7 text-[#E07A3A]" />
|
||||
</div>
|
||||
<h3 className="font-heading text-lg font-bold">{title}</h3>
|
||||
<p className="text-sm text-muted-foreground mt-2 max-w-sm leading-relaxed">{description}</p>
|
||||
{actionLabel && onAction && (
|
||||
<Button onClick={onAction} className="mt-4"><Plus className="size-4 mr-2" />{actionLabel}</Button>
|
||||
<Button onClick={onAction} className="mt-6 rounded-xl shadow-sm shadow-primary/20">
|
||||
<Plus className="size-4 mr-2" />{actionLabel}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user