Adjust volume behavior

This commit is contained in:
Nicolas Mowen 2024-03-13 16:56:55 -06:00
parent ed9bf9dce4
commit 36abc2a73f

View File

@ -321,25 +321,25 @@ function VideoControls({
<div <div
className={`absolute bottom-5 left-1/2 -translate-x-1/2 px-4 py-2 flex justify-between items-center gap-8 text-white z-50 bg-black bg-opacity-60 rounded-lg`} className={`absolute bottom-5 left-1/2 -translate-x-1/2 px-4 py-2 flex justify-between items-center gap-8 text-white z-50 bg-black bg-opacity-60 rounded-lg`}
> >
<div <div className="flex justify-normal items-center gap-2">
className="flex justify-normal items-center gap-2" <VolumeIcon
onMouseOver={isDesktop ? () => setShowVolume(true) : undefined} className="size-5"
onMouseOut={isDesktop ? () => setShowVolume(false) : undefined} onClick={(e) => {
onClick={(e) => { e.stopPropagation();
e.stopPropagation();
if (isDesktop) { if (isDesktop) {
if (video.muted) { if (volume == 0) {
video.volume = 1; setShowVolume(true);
video.volume = 1;
} else {
setShowVolume(false);
video.volume = 0;
}
} else { } else {
video.volume = 0; setShowVolume(!showVolume);
} }
} else { }}
setShowVolume(!showVolume); />
}
}}
>
<VolumeIcon className="size-5" />
{showVolume && ( {showVolume && (
<Slider <Slider
className="w-20" className="w-20"