Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | 1x 1x 1x 1x 1x 1x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x 16x | interface LoadingSpinnerProps {
size?: "sm" | "md" | "lg";
message?: string;
fullScreen?: boolean;
}
export default function LoadingSpinner({
size = "md",
message = "Loading...",
fullScreen = false}: LoadingSpinnerProps) {
const sizeClasses = {
sm: "w-6 h-6",
md: "w-8 h-8",
lg: "w-12 h-12"};
const containerClasses = fullScreen
? "fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 z-50"
: "flex items-center justify-center py-10";
return (
<div className={containerClasses}>
<div className="text-center">
<div className="inline-block">
<div className={`${sizeClasses[size]} border-4 border-gray-300 dark:border-gray-600 border-t-blue rounded-full animate-spin`}></div>
</div>
{message && <p className="text-gray-600 dark:text-gray-400 mt-4">{message}</p>}
</div>
</div>
);
}
|