wedding-planner-frontend/app/ui/components/button.tsx

/* Copyright (C) 2024 Manuel Bustillo*/

import clsx from "clsx";

type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow';

export function classNames(type: ButtonColor) {
    return (clsx("text-white py-1 px-2 mx-1 rounded disabled:opacity-50 disabled:cursor-not-allowed", {
        'bg-blue-400 hover:bg-blue-600': type === 'primary' || type === 'blue',
        'bg-green-500 hover:bg-green-600': type === 'green',
        'bg-red-500 hover:bg-red-600': type === 'red',
        'bg-yellow-500 hover:bg-yellow-700': type === 'yellow'
    }))
}