diff options
| author | Ivan Chen <ivan@tagg.id> | 2021-04-07 16:36:34 -0400 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-04-07 16:36:34 -0400 |
| commit | 4cf3bc720ebcc0b16d158caf60fbdf091621c327 (patch) | |
| tree | 97d8db434060a7bf8579bb2975f9be25331ecb73 /src/components/common | |
| parent | a3abb3abe322ea84306e1a12cec46972a81a37de (diff) | |
| parent | 6db092b4b88a71c53088a14e330ec73e208ad958 (diff) | |
Merge pull request #354 from TaggiD-Inc/chat-poc
[POC] Chat
Diffstat (limited to 'src/components/common')
| -rw-r--r-- | src/components/common/BottomDrawer.tsx | 18 | ||||
| -rw-r--r-- | src/components/common/GradientBorderButton.tsx | 2 | ||||
| -rw-r--r-- | src/components/common/TabsGradient.tsx | 2 |
3 files changed, 8 insertions, 14 deletions
diff --git a/src/components/common/BottomDrawer.tsx b/src/components/common/BottomDrawer.tsx index bef9434a..988c1e79 100644 --- a/src/components/common/BottomDrawer.tsx +++ b/src/components/common/BottomDrawer.tsx @@ -6,7 +6,7 @@ import { View, ViewProps, } from 'react-native'; -import Animated from 'react-native-reanimated'; +import Animated, {interpolateColors} from 'react-native-reanimated'; import BottomSheet from 'reanimated-bottom-sheet'; import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; @@ -50,6 +50,10 @@ const BottomDrawer: React.FC<BottomDrawerProps> = (props) => { ); }; + const backgroundColor = interpolateColors(bgAlpha, { + inputRange: [0, 1], + outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'], + }); return ( <Modal transparent @@ -75,17 +79,7 @@ const BottomDrawer: React.FC<BottomDrawerProps> = (props) => { onPress={() => { setIsOpen(false); }}> - <Animated.View - style={[ - styles.backgroundView, - { - backgroundColor: Animated.interpolateColors(bgAlpha, { - inputRange: [0, 1], - outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'], - }), - }, - ]} - /> + <Animated.View style={[styles.backgroundView, {backgroundColor}]} /> </TouchableWithoutFeedback> </Modal> ); diff --git a/src/components/common/GradientBorderButton.tsx b/src/components/common/GradientBorderButton.tsx index 32ac5c52..a5dbde9d 100644 --- a/src/components/common/GradientBorderButton.tsx +++ b/src/components/common/GradientBorderButton.tsx @@ -42,7 +42,7 @@ const GradientBorderButton: React.FC<GradientBorderButtonProps> = ({ }; const styles = StyleSheet.create({ container: { - marginVertical: 15, + marginVertical: 10, }, gradientContainer: { width: SCREEN_WIDTH / 2 - 40, diff --git a/src/components/common/TabsGradient.tsx b/src/components/common/TabsGradient.tsx index a95e8bc3..07c55042 100644 --- a/src/components/common/TabsGradient.tsx +++ b/src/components/common/TabsGradient.tsx @@ -14,7 +14,7 @@ const TabsGradient: React.FC = () => { }; const styles = StyleSheet.create({ gradient: { - position: 'absolute', + ...StyleSheet.absoluteFillObject, top: (SCREEN_HEIGHT / 10) * 9, height: SCREEN_HEIGHT / 10, width: SCREEN_WIDTH, |