[APP-724] Collection of accessibility fixes (#949)

* Fix: include alt text on the web lightbox image

* a11y: Dont read the 'ALT' label

* a11y: remove a wrapper behavior from posts

This appears to have been introduced with the goal of creating meta
actions on posts, but the behavior seems counter-productive. The
accessibility inspector was unable to access individual items within
the post and therefore most content was simply skipped.

There may be a way to support the post actions without losing the
ability to access the inner elements but I couldnt find it. -prf

* a11y: apply alt tags to image wrappers so they get read

* a11y: set Link accessibilityLabel to the title if none set

* a11y: skip the SANDBOX watermark

* a11y: improve post meta to not read UI and give a useful date

* ally: improve post controls

* a11y: add labels to lightbox images on mobile

* fix types
This commit is contained in:
Paul Frazee 2023-07-03 15:57:53 -05:00 committed by GitHub
parent 0163ba0af8
commit bc55241c9a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 80 additions and 148 deletions

View file

@ -88,6 +88,10 @@ export const Link = observer(function Link({
props.dataSet.noUnderline = 1
}
if (title && !props.accessibilityLabel) {
props.accessibilityLabel = title
}
return (
<TouchableOpacity
testID={testID}
@ -171,6 +175,7 @@ export const DesktopWebTextLink = observer(function DesktopWebTextLink({
text,
numberOfLines,
lineHeight,
...props
}: {
testID?: string
type?: TypographyVariant
@ -179,6 +184,9 @@ export const DesktopWebTextLink = observer(function DesktopWebTextLink({
text: string | JSX.Element
numberOfLines?: number
lineHeight?: number
accessible?: boolean
accessibilityLabel?: string
accessibilityHint?: string
}) {
if (isDesktopWeb) {
return (
@ -190,6 +198,7 @@ export const DesktopWebTextLink = observer(function DesktopWebTextLink({
text={text}
numberOfLines={numberOfLines}
lineHeight={lineHeight}
{...props}
/>
)
}
@ -199,7 +208,8 @@ export const DesktopWebTextLink = observer(function DesktopWebTextLink({
type={type}
style={style}
numberOfLines={numberOfLines}
lineHeight={lineHeight}>
lineHeight={lineHeight}
{...props}>
{text}
</Text>
)