import Skeleton from "./_lib/components/skeleton-loading";

export default function Loading() {
  return (
    <>
      <Skeleton className="sk-home w-full h-auto aspect-video max-h-[450px]" />
      <div className="grid grid-cols-4 w-[65%] m-auto max-[750px]:my-12 max-[1150px]:w-[80%] max-[850px]:w-[98%] gap-4 mt-4 mb-4 max-[600px]:gap-0">
        <Skeleton className="flex flex-col w-32 !aspect-square items-center justify-center p-4 duration-300 max-[800px]:w-full" />
        <Skeleton className="flex flex-col w-32 !aspect-square items-center justify-center p-4 duration-300 max-[800px]:w-full" />
        <Skeleton className="flex flex-col w-32 !aspect-square items-center justify-center p-4 duration-300 max-[800px]:w-full" />
        <Skeleton className="flex flex-col w-32 !aspect-square items-center justify-center p-4 duration-300 max-[800px]:w-full" />
      </div>
    </>
  );
}