From efdfb7f57a6de487330cd1a24c3bc4955bb8c74d Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Tue, 28 May 2024 20:58:40 -0700
Subject: [PATCH] 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)
---
 src/view/com/util/images/Gallery.tsx       |  2 +-
 src/view/com/util/post-embeds/GifEmbed.tsx | 12 ++++++------
 src/view/com/util/post-embeds/index.tsx    |  2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/view/com/util/images/Gallery.tsx b/src/view/com/util/images/Gallery.tsx
index f0b7ac15e7..8d23d258f5 100644
--- a/src/view/com/util/images/Gallery.tsx
+++ b/src/view/com/util/images/Gallery.tsx
@@ -79,7 +79,7 @@ const styles = StyleSheet.create({
   },
   alt: {
     color: 'white',
-    fontSize: 6,
+    fontSize: 7,
     fontWeight: 'bold',
   },
 })
diff --git a/src/view/com/util/post-embeds/GifEmbed.tsx b/src/view/com/util/post-embeds/GifEmbed.tsx
index deb82655b5..1c0cf3d39d 100644
--- a/src/view/com/util/post-embeds/GifEmbed.tsx
+++ b/src/view/com/util/post-embeds/GifEmbed.tsx
@@ -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',
   },
 })
diff --git a/src/view/com/util/post-embeds/index.tsx b/src/view/com/util/post-embeds/index.tsx
index 8aa9919ca8..0fc8296252 100644
--- a/src/view/com/util/post-embeds/index.tsx
+++ b/src/view/com/util/post-embeds/index.tsx
@@ -183,7 +183,7 @@ const styles = StyleSheet.create({
   },
   alt: {
     color: 'white',
-    fontSize: 6,
+    fontSize: 7,
     fontWeight: 'bold',
   },
   customFeedOuter: {