64fbb81ddf
- rounded-[var(--radius-xl/md/lg/sm)] → rounded-xl, rounded-md, rounded-lg, rounded-sm - Timeline: min-w-[200px] → min-w-50 - AddEquipmentView, MetadataForm: min-h-[100px] → min-h-25 - NavigationProgress: shadow-[...] → shadow-button-primary-glow - Stories: ActivityGraph, StatCard, NotificationBell, LoadingState, ScrollArea, Skeleton, FileUploadZone - Reduced arbitrary values from ~60+ to 11 (5 files, exceptions documented) Co-authored-by: Cursor <cursoragent@cursor.com>
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { Skeleton } from '@/components/ui/skeleton';
|
|
|
|
export function AnalyticsViewSkeleton() {
|
|
return (
|
|
<div className="space-y-8 pb-24 container py-8 animate-fadeIn">
|
|
<div className="flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 border-b border-white/5 pb-8">
|
|
<div>
|
|
<Skeleton className="h-10 w-64 mb-2" />
|
|
<Skeleton className="h-4 w-80" />
|
|
</div>
|
|
<div className="flex flex-wrap items-center gap-3">
|
|
<Skeleton className="h-10 w-48 rounded-xl" />
|
|
<div className="flex gap-2">
|
|
<Skeleton className="h-9 w-20" />
|
|
<Skeleton className="h-9 w-20" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
|
{[1, 2, 3, 4].map((i) => (
|
|
<Skeleton key={i} className="h-28 w-full rounded-xl" />
|
|
))}
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
|
<Skeleton className="lg:col-span-2 h-80 rounded-xl" />
|
|
<div className="space-y-6">
|
|
<Skeleton className="h-56 rounded-xl" />
|
|
<Skeleton className="h-44 rounded-xl" />
|
|
</div>
|
|
</div>
|
|
|
|
<Skeleton className="h-96 w-full rounded-xl" />
|
|
</div>
|
|
);
|
|
}
|