36 lines
1.2 KiB
TypeScript
36 lines
1.2 KiB
TypeScript
import { Skeleton } from '@/components/ui/skeleton'
|
|
|
|
export default function Loading() {
|
|
return (
|
|
<div className="container mx-auto px-4 py-8 space-y-8">
|
|
{/* Artist header skeleton */}
|
|
<div className="flex flex-col md:flex-row gap-8">
|
|
<Skeleton className="w-64 h-64 rounded-lg mx-auto md:mx-0" />
|
|
<div className="flex-1 space-y-4">
|
|
<Skeleton className="h-10 w-48" />
|
|
<Skeleton className="h-6 w-32" />
|
|
<div className="space-y-2">
|
|
<Skeleton className="h-4 w-full" />
|
|
<Skeleton className="h-4 w-3/4" />
|
|
<Skeleton className="h-4 w-5/6" />
|
|
</div>
|
|
<div className="flex gap-4">
|
|
<Skeleton className="h-10 w-32" />
|
|
<Skeleton className="h-10 w-24" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Portfolio skeleton */}
|
|
<div className="space-y-6">
|
|
<Skeleton className="h-8 w-32" />
|
|
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
|
|
{Array.from({ length: 9 }).map((_, i) => (
|
|
<Skeleton key={i} className="aspect-square w-full rounded-lg" />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|