aboutsummaryrefslogtreecommitdiff
path: root/src/components/moments/MomentPostContent.tsx
diff options
context:
space:
mode:
authorGeorge Rusu <george@tagg.id>2021-05-25 11:38:26 -0700
committerGeorge Rusu <george@tagg.id>2021-05-25 11:38:26 -0700
commit4723abb677dca97a9f0ac1c50084ba8902a31e36 (patch)
treecf9450b782aaf89faa97d1f9c9ba271578381719 /src/components/moments/MomentPostContent.tsx
parent46f82a43bfb3312a82a2f08affb7ca57d0345b79 (diff)
Fix positioning
Diffstat (limited to 'src/components/moments/MomentPostContent.tsx')
-rw-r--r--src/components/moments/MomentPostContent.tsx22
1 files changed, 9 insertions, 13 deletions
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
index a20249e6..6953dca4 100644
--- a/src/components/moments/MomentPostContent.tsx
+++ b/src/components/moments/MomentPostContent.tsx
@@ -1,13 +1,7 @@
import {useNavigation} from '@react-navigation/native';
import React, {useEffect, useRef, useState} from 'react';
-import {
- Image,
- StyleSheet,
- Text,
- TouchableOpacity,
- View,
- ViewProps,
-} from 'react-native';
+import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
+import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
import Animated, {Easing} from 'react-native-reanimated';
import {useDispatch, useStore} from 'react-redux';
import {getCommentsCount, loadMomentTags} from '../../services';
@@ -75,7 +69,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
const fade = async () => {
Animated.timing(fadeValue, {
toValue: 1,
- duration: 1000,
+ duration: 250,
easing: Easing.linear,
}).start();
};
@@ -84,8 +78,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
return (
<View style={[styles.container, style]}>
- <TouchableOpacity
- activeOpacity={1}
+ <TouchableWithoutFeedback
onPress={() => {
setVisible(!visible);
setFadeValue(new Animated.Value(0));
@@ -96,9 +89,9 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
source={{uri: pathHash}}
resizeMode={'cover'}
/>
- </TouchableOpacity>
+ </TouchableWithoutFeedback>
{visible && (
- <Animated.View style={{opacity: fadeValue}}>
+ <Animated.View style={[styles.tapTag, {opacity: fadeValue}]}>
<MomentTags editing={false} tags={tags} imageRef={imageRef} />
</Animated.View>
)}
@@ -130,6 +123,9 @@ const styles = StyleSheet.create({
aspectRatio: 1,
marginBottom: '3%',
},
+ tapTag: {
+ position: 'absolute',
+ },
footerContainer: {
flexDirection: 'row',
justifyContent: 'space-between',