Skip to content

Commit

Permalink
feat(a11y): improve sound volume controller
Browse files Browse the repository at this point in the history
* Add a screen-reader only span with information about sound
* Add title on input with the state of volume
  • Loading branch information
mateusfg7 committed Oct 6, 2022
1 parent c96996e commit e20113d
Showing 1 changed file with 2 additions and 1 deletion.
3 changes: 2 additions & 1 deletion src/components/VolumeController/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,12 @@ export const VolumeController: React.FC<IVolumeController> = ({

return (
<Container isActive={isActive}>
<span className="sr-only">{soundName} volume controller</span>
<input
className="slider-input absolute top-0 left-0"
type="range"
name={`${soundName}-volume-controller`}
title={`${soundName} Volume Controller`}
title={`${soundName} volume in ${Number(rangeValue / 10).toFixed(1)}%`}
min="20"
max="1000"
value={rangeValue}
Expand Down

0 comments on commit e20113d

Please sign in to comment.