acasini/n3wt-school
1
0
Fork 0
mirror of https://git.v0id.ovh/n3wt-innov/n3wt-school.git synced 2026-01-29 16:03:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Création de composants et uniformisation des modales (#2)

Browse Source
This commit is contained in:
N3WT DE COMPET
2024-11-24 18:42:42 +01:00
parent 5946cbdee6
commit d51778ba54
18 changed files with 362 additions and 299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
Front-End/src/components/Slider.js
View File

@ -23,28 +23,30 @@ const Slider = ({ min, max, value, onChange }) => {
return (
<div className="space-y-4">
<div className="flex items-center space-x-2 w-1/2">
<span className="text-emerald-600">{value[0]}</span>
<input
type="range"
min={min}
max={max}
value={value[0]}
onChange={handleMinChange}
className="w-full h-2 bg-emerald-200 rounded-lg appearance-none cursor-pointer focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-opacity-50"
/>
</div>
<div className="flex items-center space-x-2 w-1/2">
<span className="text-emerald-600">{value[1]}</span>
<input
type="range"
min={value[0] + 1}
max={max}
value={value[1]}
onChange={handleMaxChange}
className="w-full h-2 bg-emerald-200 rounded-lg appearance-none cursor-pointer focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-opacity-50"
/>
</div>
<div className="flex items-center space-x-4">
<div className="flex items-center space-x-2 w-1/2">
<span className="text-emerald-600">{value[0]}</span>
<input
type="range"
min={min}
max={max}
value={value[0]}
onChange={handleMinChange}
className="w-full h-2 bg-emerald-200 rounded-lg appearance-none cursor-pointer focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-opacity-50"
/>
</div>
<div className="flex items-center space-x-2 w-1/2 justify-end">
<span className="text-emerald-600">{value[1]}</span>
<input
type="range"
min={value[0] + 1}
max={max}
value={value[1]}
onChange={handleMaxChange}
className="w-full h-2 bg-emerald-200 rounded-lg appearance-none cursor-pointer focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-opacity-50"
/>
</div>
</div>
</div>
);
};