afc77439bb
Optimize user detail page for asset assessment and tag info. #VERCEL_SKIP Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>
62 lines
2.8 KiB
TypeScript
62 lines
2.8 KiB
TypeScript
export default function Loading() {
|
|
return (
|
|
<div className="min-h-screen bg-[#F8F9FA] pb-20">
|
|
<header className="sticky top-0 z-10 bg-white">
|
|
<div className="flex items-center h-14 px-4">
|
|
<div className="w-6 h-6 bg-gray-200 rounded animate-pulse" />
|
|
<div className="ml-2 w-32 h-5 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
</header>
|
|
|
|
<div className="mt-8">
|
|
{/* Step Indicator Skeleton */}
|
|
<div className="flex justify-center items-center space-x-4 px-6">
|
|
<div className="w-8 h-8 bg-gray-200 rounded-full animate-pulse" />
|
|
<div className="w-16 h-1 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-8 h-8 bg-gray-200 rounded-full animate-pulse" />
|
|
<div className="w-16 h-1 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-8 h-8 bg-gray-200 rounded-full animate-pulse" />
|
|
</div>
|
|
|
|
{/* Content Skeleton */}
|
|
<div className="mt-8 px-6">
|
|
<div className="bg-white rounded-lg p-6 space-y-6">
|
|
<div className="space-y-2">
|
|
<div className="w-20 h-4 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-full h-10 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
<div className="space-y-2">
|
|
<div className="w-32 h-4 bg-gray-200 rounded animate-pulse" />
|
|
<div className="flex space-x-2">
|
|
<div className="w-24 h-10 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-8 h-4 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-24 h-10 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<div className="w-24 h-4 bg-gray-200 rounded animate-pulse" />
|
|
<div className="flex items-center space-x-4">
|
|
<div className="w-8 h-8 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-8 h-4 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-8 h-8 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-16 h-4 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
</div>
|
|
<div className="w-full h-10 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Bottom Navigation Skeleton */}
|
|
<nav className="fixed bottom-0 left-0 right-0 h-16 bg-white border-t flex items-center justify-around px-6">
|
|
{Array.from({ length: 4 }).map((_, i) => (
|
|
<div key={i} className="flex flex-col items-center space-y-1">
|
|
<div className="w-6 h-6 bg-gray-200 rounded animate-pulse" />
|
|
<div className="w-12 h-3 bg-gray-200 rounded animate-pulse" />
|
|
</div>
|
|
))}
|
|
</nav>
|
|
</div>
|
|
)
|
|
}
|