import { cn } from "@/lib/utils"
type LoadingSpinProps = {
className?: string
center?: boolean
}
export default function LoadingSpin({
className,
center = true,
}: LoadingSpinProps) {
return (
<div className={cn(center && "flex w-full justify-center")}>
<svg
width="38"
height="38"
viewBox="0 0 38 38"
xmlns="http://www.w3.org/2000/svg"
className={cn("size-9", className)}
stroke="currentColor"
>
<defs>
<linearGradient x1="8.042%" y1="0%" x2="65.682%" y2="23.865%" id="a">
<stop stopColor="currentColor" stopOpacity="0" offset="0%" />
<stop
stopColor="currentColor"
stopOpacity=".631"
offset="63.146%"
/>
<stop stopColor="currentColor" offset="100%" />
</linearGradient>
</defs>
<g fill="none" fillRule="evenodd">
<g transform="translate(1 1)">
<path
d="M36 18c0-9.94-8.06-18-18-18"
id="Oval-2"
stroke="url(#a)"
strokeWidth="2"
>
<animateTransform
attributeName="transform"
type="rotate"
from="0 18 18"
to="360 18 18"
dur="0.9s"
repeatCount="indefinite"
/>
</path>
<circle fill="currentColor" cx="36" cy="18" r="1">
<animateTransform
attributeName="transform"
type="rotate"
from="0 18 18"
to="360 18 18"
dur="0.9s"
repeatCount="indefinite"
/>
</circle>
</g>
</g>
</svg>
</div>
)
}
Created
January 3, 2024 04:11
-
-
Save rifayetuxbd/64bc0008dd92ba02f04f2819c81c1f83 to your computer and use it in GitHub Desktop.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment