97 lines
1.9 KiB
TypeScript
97 lines
1.9 KiB
TypeScript
import { cn } from "@/lib/utils"
|
|
|
|
interface manaIcon {
|
|
className: string
|
|
}
|
|
|
|
const Black = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/B.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
Black.displayName = "Black"
|
|
|
|
const Blue = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/U.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
Blue.displayName = "Blue"
|
|
|
|
const Green = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/G.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
Green.displayName = "Green"
|
|
|
|
const White = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/W.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
White.displayName = "White"
|
|
|
|
const Red = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/R.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
Red.displayName = "Red"
|
|
|
|
const Colorless = ({ className, ...props }: manaIcon) => {
|
|
return (
|
|
<img
|
|
src="https://svgs.scryfall.io/card-symbols/C.svg"
|
|
loading="lazy"
|
|
className={cn(
|
|
"",
|
|
className
|
|
)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
Colorless.displayName = "Colorless"
|
|
|
|
export { Black, Blue, Green, White, Red, Colorless }
|