import { ReactNode } from "react"

function Icon({
  src,
  children,
  onClick,
}: {
  src: string
  children: ReactNode
  onClick?: () => void
}) {
  return (
    <button
      className="mx-4 mt-4 flex flex-col items-center border-none"
      onClick={onClick}
    >
      <img
        className="pixelart mb-1 box-content w-16 rounded-xl bg-white p-1"
        src={"/assets/" + src}
        alt={src}
      />
      <span className="font-semibold">{children}</span>
    </button>
  )
}

export default Icon