leaky-ships/leaky-ships/components/OptionButton.tsx

27 lines
665 B
TypeScript

import {
FontAwesomeIcon,
FontAwesomeIconProps,
} from "@fortawesome/react-fontawesome"
import { ReactNode } from "react"
function OptionButton({
icon,
action,
children,
}: {
icon: FontAwesomeIconProps["icon"]
action?: () => void
children: ReactNode
}) {
return (
<button
className="flex w-full flex-row items-center justify-between rounded-lg border-2 border-black bg-voidDark py-4 pr-8 pl-16 text-4xl text-grayish first:mt-8 last:mt-8"
onClick={action}
>
<span className="mx-auto">{children}</span>
<FontAwesomeIcon className="ml-12 w-10 text-4xl" icon={icon} />
</button>
)
}
export default OptionButton