steve
e4505ed9a7
Build image / build-and-push (push) Successful in 15s
Co-authored-by: Steve Dudenhoeffer <[email protected]>
19 lines
567 B
TypeScript
19 lines
567 B
TypeScript
import { cn } from '@/lib/cn'
|
|
|
|
/**
|
|
* A plant's emoji on a tile tinted with its own color (via color-mix, so any
|
|
* valid CSS color works). Shared by PlantCard and the PlantPicker rows. Size and
|
|
* shape come from `className`.
|
|
*/
|
|
export function PlantIcon({ color, icon, className }: { color: string; icon: string; className?: string }) {
|
|
return (
|
|
<span
|
|
className={cn('grid shrink-0 place-items-center', className)}
|
|
style={{ backgroundColor: `color-mix(in srgb, ${color} 18%, transparent)` }}
|
|
aria-hidden
|
|
>
|
|
{icon}
|
|
</span>
|
|
)
|
|
}
|