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

LordNex · Jan 27, 2021 · 26ba29b · 26ba29b
1 parent 70167a3
commit 26ba29b
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/web/src/components/Button.jsx b/web/src/components/Button.jsx
@@ -2,12 +2,18 @@ import { h } from 'preact';
 
 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 }) {
  return (
  <div
  role="button"
  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}
  {...attrs}
  >