Consult AS Technology
c77b4c0628
Fase 1 - UI: dark mode, skeletons, toasts Fase 2 - Filtros: avanzados Mi día, búsqueda global Ctrl+K Fase 3 - Datos: export Excel, notas apartados, auditoría Fase 4 - Dashboard: gráficas vendedor + métricas uso Fase 5 - Responsive: tablets optimizadas Fase 6 - PWA: IndexedDB offline, push notifications Backend: 3 tablas nuevas, 6 services, 6 endpoints nuevos 721 API tests + fronts verdes.
22 lines
701 B
TypeScript
22 lines
701 B
TypeScript
export default function Skeleton({ className = "" }: { className?: string }) {
|
|
return <div className={`animate-pulse rounded-lg bg-[#E2E8F0] dark:bg-[#334155] ${className}`} />
|
|
}
|
|
|
|
export function SkeletonCard() {
|
|
return (
|
|
<div className="rounded-xl border border-[#E5E7EB] bg-white p-4 shadow-sm dark:border-[#1E293B] dark:bg-[#1E293B]">
|
|
<Skeleton className="h-4 w-1/3 mb-3" />
|
|
<Skeleton className="h-3 w-2/3 mb-2" />
|
|
<Skeleton className="h-3 w-1/2" />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function SkeletonList({ count = 5 }: { count?: number }) {
|
|
return (
|
|
<div className="space-y-3">
|
|
{Array.from({ length: count }).map((_, i) => <SkeletonCard key={i} />)}
|
|
</div>
|
|
)
|
|
}
|