32 lines
1.3 KiB
TypeScript
32 lines
1.3 KiB
TypeScript
/** Skeleton halaman detail trip — tampil instan saat data masih di-fetch. */
|
|
export default function Loading() {
|
|
return (
|
|
<div className="mx-auto max-w-3xl px-4 py-4 sm:py-8">
|
|
<div className="mb-3 h-4 w-40 animate-pulse rounded bg-neutral-200 sm:mb-4" />
|
|
|
|
<div className="overflow-hidden rounded-2xl border border-neutral-200 bg-white shadow-sm">
|
|
<div className="h-44 animate-pulse bg-neutral-200 sm:h-56 lg:h-72" />
|
|
|
|
<div className="border-b border-neutral-100 px-4 py-4 sm:px-6">
|
|
<div className="h-6 w-2/3 animate-pulse rounded bg-neutral-200" />
|
|
<div className="mt-2 h-4 w-1/3 animate-pulse rounded bg-neutral-100" />
|
|
</div>
|
|
|
|
<div className="space-y-5 p-4 sm:space-y-6 sm:p-6">
|
|
<div className="grid grid-cols-2 gap-2 sm:gap-3">
|
|
{Array.from({ length: 4 }).map((_, i) => (
|
|
<div
|
|
key={i}
|
|
className="h-16 animate-pulse rounded-xl bg-neutral-100 sm:h-[72px]"
|
|
/>
|
|
))}
|
|
</div>
|
|
<div className="h-24 animate-pulse rounded-xl bg-neutral-100" />
|
|
<div className="h-32 animate-pulse rounded-xl bg-neutral-100" />
|
|
<div className="h-12 animate-pulse rounded-xl bg-neutral-200" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|