about summary refs log tree commit diff
path: root/src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx
diff options
context:
space:
mode:
authorHailey <me@haileyok.com>2024-09-13 12:44:42 -0700
committerGitHub <noreply@github.com>2024-09-13 12:44:42 -0700
commit26508cfe6a89df4ae1ab1256753faa860597bbc8 (patch)
tree8f0bf4e8f65863ddbe8d1ede7df3fd342e6ab69b /src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx
parent78a531f5ffe9287b5384ec1649dfbc45435ced28 (diff)
downloadvoidsky-26508cfe6a89df4ae1ab1256753faa860597bbc8.tar.zst
[Video] Remove `expo-video`, use `bluesky-video` (#5282)
Co-authored-by: Samuel Newman <mozzius@protonmail.com>
Diffstat (limited to 'src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx')
-rw-r--r--src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx15
1 files changed, 12 insertions, 3 deletions
diff --git a/src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx b/src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx
index be3f90711..66e1df50d 100644
--- a/src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx
+++ b/src/view/com/util/post-embeds/VideoEmbedInner/TimeIndicator.tsx
@@ -1,4 +1,5 @@
 import React from 'react'
+import {StyleProp, ViewStyle} from 'react-native'
 import Animated, {FadeInDown, FadeOutDown} from 'react-native-reanimated'
 
 import {atoms as a, native, useTheme} from '#/alf'
@@ -8,7 +9,13 @@ import {Text} from '#/components/Typography'
  * Absolutely positioned time indicator showing how many seconds are remaining
  * Time is in seconds
  */
-export function TimeIndicator({time}: {time: number}) {
+export function TimeIndicator({
+  time,
+  style,
+}: {
+  time: number
+  style?: StyleProp<ViewStyle>
+}) {
   const t = useTheme()
 
   if (isNaN(time)) {
@@ -22,18 +29,20 @@ export function TimeIndicator({time}: {time: number}) {
     <Animated.View
       entering={native(FadeInDown.duration(300))}
       exiting={native(FadeOutDown.duration(500))}
+      pointerEvents="none"
       style={[
         {
           backgroundColor: 'rgba(0, 0, 0, 0.5)',
           borderRadius: 6,
           paddingHorizontal: 6,
           paddingVertical: 3,
-          position: 'absolute',
           left: 6,
           bottom: 6,
           minHeight: 21,
-          justifyContent: 'center',
         },
+        a.absolute,
+        a.justify_center,
+        style,
       ]}>
       <Text
         style={[