bridge/app/explorer/components/LoadingBlocks.tsx

const LoadingBlocks = () => {
    return <div className="px-4 sm:px-6 lg:px-8 max-w-6xl w-full py-5 animate-pulse">
        <div className="mt-8 flow-root">
            <div className="px-4 py-5 sm:px-6">
                <h3 className="text-lg leading-6 font-medium text-gray-900"><div className="h-2 bg-slate-500 rounded"></div></h3>
                <p className="mt-1 max-w-2xl text-sm text-gray-500"></p>
            </div>
            <div className="border-t border-gray-600 px-4 py-5 sm:p-0">
                <dl className="sm:divide-y sm:divide-gray-600">
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                    <div className="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
                        <dt className="text-sm font-medium text-gray-500"><div className="h-2 bg-slate-500 rounded col-span-1"></div></dt>
                        <dd className="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2"> <div className="h-2 bg-slate-500 rounded col-span-1"></div></dd>
                    </div>
                </dl>
            </div>
        </div>
    </div>
}
export default LoadingBlocks