You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
competitions/components/UI/Switch/Switch.tsx

33 lines
763 B

import React from 'react';
interface Props {
isOn: boolean;
handleToggle: () => void;
onColor: string;
name: string;
value: number;
disable: boolean;
}
export const Switch: React.FC<Props> = ({isOn, handleToggle, onColor, name, value, disable }) => {
return(
<>
<input
checked={isOn}
onChange={handleToggle}
className="react-switch-checkbox"
id={`switch`+name}
type="checkbox"
value={value}
disabled={disable}
/>
<label
style={{ 'background' : isOn && onColor }}
className="react-switch-label"
htmlFor={`switch`+name}
>
<span className={`react-switch-button`} />
</label>
</>
)
}