mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-29 16:03:21 +00:00
refactor: Refactoring de la section ClassSection
This commit is contained in:
@ -1,6 +1,6 @@
|
||||
import { useRef } from 'react';
|
||||
|
||||
const ToggleSwitch = ({ label, checked, onChange }) => {
|
||||
const ToggleSwitch = ({ name, label, checked, onChange }) => {
|
||||
const inputRef = useRef(null);
|
||||
|
||||
const handleChange = (e) => {
|
||||
@ -16,15 +16,15 @@ const ToggleSwitch = ({ label, checked, onChange }) => {
|
||||
<div className="relative inline-block w-10 mr-2 align-middle select-none transition duration-200 ease-in">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="toggle"
|
||||
id="toggle"
|
||||
name={name}
|
||||
id={name}
|
||||
checked={checked}
|
||||
onChange={handleChange}
|
||||
className="hover:text-emerald-500 absolute block w-6 h-6 rounded-full bg-white border-4 appearance-none cursor-pointer border-emerald-500 checked:right-0 checked:border-emerald-500 checked:bg-emerald-500 hover:border-emerald-500 hover:bg-emerald-500 focus:outline-none focus:ring-0"
|
||||
ref={inputRef} // Reference to the input element
|
||||
/>
|
||||
<label
|
||||
htmlFor="toggle"
|
||||
htmlFor={name}
|
||||
className={`toggle-label block overflow-hidden h-6 rounded-full cursor-pointer transition-colors duration-200 ${checked ? 'bg-emerald-300' : 'bg-gray-300'}`}
|
||||
></label>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user