81 lines
No EOL
4.3 KiB
TypeScript
81 lines
No EOL
4.3 KiB
TypeScript
|
|
export default function SkeletonTable() {
|
|
|
|
return (
|
|
|
|
<div>
|
|
<div role="status" aria-busy="true" aria-label="Carregando tabela" className="p-4 w-full">
|
|
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full border-collapse">
|
|
<thead>
|
|
<tr>
|
|
<th className="px-4 py-2 text-left">
|
|
<div className="h-4 w-20 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</th>
|
|
<th className="px-4 py-2 text-left">
|
|
<div className="h-4 w-28 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</th>
|
|
<th className="px-4 py-2 text-left">
|
|
<div className="h-4 w-24 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</th>
|
|
<th className="px-4 py-2 text-left">
|
|
<div className="h-4 w-16 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr className="border-t">
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-24 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-32 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-20 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-16 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr className="border-t">
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-20 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-24 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-28 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-16 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr className="border-t">
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-28 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-20 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-24 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
<td className="px-4 py-3">
|
|
<div className="h-4 w-16 bg-gray-200 dark:bg-slate-700 rounded animate-pulse"></div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
} |