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) {
setShowVolume(true);
video.volume = 1; video.volume = 1;
} else { } else {
setShowVolume(false);
video.volume = 0; video.volume = 0;
} }
} else { } else {
setShowVolume(!showVolume); setShowVolume(!showVolume);
} }
}} }}
> />
<VolumeIcon className="size-5" />
{showVolume && ( {showVolume && (
<Slider <Slider
className="w-20" className="w-20"