fix(web): ensure button bg colors show in prod builds

This commit is contained in:
Paul Armstrong 2021-01-18 09:31:06 -08:00 committed by Blake Blackshear
parent 70167a34b6
commit 26ba29b538

View File

@ -2,12 +2,18 @@ import { h } from 'preact';
const noop = () => {}; const noop = () => {};
const BUTTON_COLORS = {
blue: { normal: 'bg-blue-500', hover: 'hover:bg-blue-400' },
red: { normal: 'bg-red-500', hover: 'hover:bg-red-400' },
green: { normal: 'bg-green-500', hover: 'hover:bg-green-400' },
};
export default function Button({ children, className, color = 'blue', onClick, size, ...attrs }) { export default function Button({ children, className, color = 'blue', onClick, size, ...attrs }) {
return ( return (
<div <div
role="button" role="button"
tabindex="0" tabindex="0"
className={`rounded bg-${color}-500 text-white pl-4 pr-4 pt-2 pb-2 font-bold shadow hover:bg-${color}-400 hover:shadow-lg cursor-pointer ${className}`} className={`rounded ${BUTTON_COLORS[color].normal} text-white pl-4 pr-4 pt-2 pb-2 font-bold shadow ${BUTTON_COLORS[color].hover} hover:shadow-lg cursor-pointer ${className}`}
onClick={onClick || noop} onClick={onClick || noop}
{...attrs} {...attrs}
> >