fix accessibility #2705
fix accessibility #2705
Conversation
|
Aria is used by assistive technologies and, therefore, targets a subset of readers with accessibility needs. It is always better to have an accessible name available for all readers (as title) instead of a specific user agent category. |
|
Any way I can't find the "textValue" attribute (rendered as "aria-label") in that PR. |
arthur-lemeur
changed the title
| @@ -1043,7 +1043,7 @@ const AnnotationList: React.FC<{ annotationUUIDFocused: string, resetAnnotationU | |||
| </div> | |||
| </summary> | |||
| <TagList items={selectDrawtypesOptions} className={stylesAnnotations.annotations_filter_taglist}> | |||
| {(item) => <Tag id={item.name} className={stylesAnnotations.annotations_filter_drawtype} textValue={item.name}><SVG svg={item.svg} /></Tag>} | |||
| {(item) => <Tag id={item.name} className={stylesAnnotations.annotations_filter_drawtype} textValue={item.title}><SVG svg={item.svg} /></Tag>} | |||
There was a problem hiding this comment.
Why not reuse similar pattern to the annotation panel selector?
| @@ -1043,7 +1043,7 @@ const AnnotationList: React.FC<{ annotationUUIDFocused: string, resetAnnotationU | |||
| </div> | |||
| </summary> | |||
| <TagList items={selectDrawtypesOptions} className={stylesAnnotations.annotations_filter_taglist}> | |||
There was a problem hiding this comment.
This taglist element is rendered as a non semantic div.
Checkboxes with labels would be more appropriate.
src/resources/locales/en.json
Outdated
There was a problem hiding this comment.
added those keys to the localisation table in the support pages edrlab/thorium-reader-doc@c7453f8
There was a problem hiding this comment.
Not sure if Zen mode replace Full screen. In this case, the old key should be deleted.
Fixes #2698
Fixes #2700
Fixes #2709
Fixes #2710
Fixes #2711
Fixes #2715
Fixes #2714
Fixes #2718
Fixes #2724
Fixes #2735
Fixes #2728
Fixes #2729
Fixes #2731
(PS : The "Tag" element from React Aria does not allow for a "title" attribute ([https://react-spectrum.adobe.com/react-aria/TagGroup.html#tag]), I updated the "textValue" attribute (rendered as "aria-label") to be localised instead. According to the documentation, this is the attribute used for accessibility on this element.)