30 lines
1.3 KiB
TypeScript
30 lines
1.3 KiB
TypeScript
/** Skeleton daftar trip — tampil instan saat list masih di-fetch. */
|
|
export default function Loading() {
|
|
return (
|
|
<div className="mx-auto max-w-6xl px-4 py-6 sm:py-8">
|
|
<div className="mb-6 h-8 w-56 animate-pulse rounded-lg bg-neutral-200 sm:mb-8" />
|
|
<div className="mb-6 h-40 animate-pulse rounded-2xl bg-neutral-100" />
|
|
|
|
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
|
{Array.from({ length: 6 }).map((_, i) => (
|
|
<div
|
|
key={i}
|
|
className="overflow-hidden rounded-2xl border border-neutral-200 bg-white"
|
|
>
|
|
<div className="h-40 animate-pulse bg-neutral-200" />
|
|
<div className="space-y-3 p-4">
|
|
<div className="h-5 w-3/4 animate-pulse rounded bg-neutral-200" />
|
|
<div className="h-4 w-1/2 animate-pulse rounded bg-neutral-100" />
|
|
<div className="h-4 w-2/3 animate-pulse rounded bg-neutral-100" />
|
|
<div className="mt-3 flex items-center justify-between border-t border-neutral-100 pt-3">
|
|
<div className="h-5 w-20 animate-pulse rounded bg-neutral-200" />
|
|
<div className="h-4 w-16 animate-pulse rounded bg-neutral-100" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|