Alt text followups -- SLIGHTLY larger, and update gifs (#4252)

* Bump up the alt text indicator's text size just a smidge

* Update the GIF alt indicator to match images (right side, visually smaller on mobile)
zio/stable
Paul Frazee 2024-05-28 20:58:40 -07:00 committed by GitHub
parent 19ee89caf3
commit efdfb7f57a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 8 additions and 8 deletions

View File

@ -79,7 +79,7 @@ const styles = StyleSheet.create({
},
alt: {
color: 'white',
fontSize: 6,
fontSize: 7,
fontWeight: 'bold',
},
})

View File

@ -5,7 +5,7 @@ import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {HITSLOP_10} from '#/lib/constants'
import {HITSLOP_20} from '#/lib/constants'
import {parseAltFromGIFDescription} from '#/lib/gif-alt-text'
import {isWeb} from '#/platform/detection'
import {EmbedPlayerParams} from 'lib/strings/embed-player'
@ -166,7 +166,7 @@ function AltText({text}: {text: string}) {
accessibilityRole="button"
accessibilityLabel={_(msg`Show alt text`)}
accessibilityHint=""
hitSlop={HITSLOP_10}
hitSlop={HITSLOP_20}
onPress={control.open}
style={styles.altContainer}>
<Text style={styles.alt} accessible={false}>
@ -195,18 +195,18 @@ const styles = StyleSheet.create({
altContainer: {
backgroundColor: 'rgba(0, 0, 0, 0.75)',
borderRadius: 6,
paddingHorizontal: 6,
paddingVertical: 3,
paddingHorizontal: isWeb ? 8 : 6,
paddingVertical: isWeb ? 6 : 3,
position: 'absolute',
// Related to margin/gap hack. This keeps the alt label in the same position
// on all platforms
left: isWeb ? 8 : 5,
right: isWeb ? 8 : 5,
bottom: isWeb ? 8 : 5,
zIndex: 2,
},
alt: {
color: 'white',
fontSize: 10,
fontSize: isWeb ? 10 : 7,
fontWeight: 'bold',
},
})

View File

@ -183,7 +183,7 @@ const styles = StyleSheet.create({
},
alt: {
color: 'white',
fontSize: 6,
fontSize: 7,
fontWeight: 'bold',
},
customFeedOuter: {