matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pl-fe: always display volume handle

Browse Source 
Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>
This commit is contained in:
nicole mikołajczyk
2025-10-28 12:57:30 +01:00
parent 323e142705
commit 6f898a07f0
3 changed files with 7 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/pl-fe/src/features/audio/index.tsx
View File

@ -521,10 +521,10 @@ const Audio: React.FC<IAudio> = (props) => {
<Icon src={muted ? require('@phosphor-icons/core/regular/speaker-x.svg') : require('@phosphor-icons/core/regular/speaker-high.svg')} />
</button>
<div className={clsx('video-player__volume', { 'overflow-visible w-12 mr-4': hovered })} onMouseDown={handleVolumeMouseDown} ref={slider}>
<div className='video-player__volume' onMouseDown={handleVolumeMouseDown} ref={slider}>
<div className='video-player__volume__current' style={{ width: `${volume * 100}%`, backgroundColor: _getAccentColor() }} />
<span
className={clsx('video-player__volume__handle', { 'opacity-100': dragging || hovered })}
className='video-player__volume__handle'
tabIndex={0}
style={{ left: `${volume * 100}%`, backgroundColor: _getAccentColor() }}
/>

4
packages/pl-fe/src/features/video/index.tsx
View File

@ -538,10 +538,10 @@ const Video: React.FC<IVideo> = ({
<Icon src={muted ? require('@phosphor-icons/core/regular/speaker-x.svg') : require('@phosphor-icons/core/regular/speaker-high.svg')} />
</button>
<div className={clsx('video-player__volume', { 'overflow-visible w-12 mr-4': hovered })} onMouseDown={handleVolumeMouseDown} ref={slider}>
<div className={clsx('video-player__volume')} onMouseDown={handleVolumeMouseDown} ref={slider}>
<div className='video-player__volume__current' style={{ width: `${volume * 100}%` }} />
<span
className={clsx('video-player__volume__handle', { 'opacity-100': dragging || hovered })}
className={clsx('video-player__volume__handle')}
tabIndex={0}
style={{ left: `${volume * 100}%` }}
/>