diff options
| author | Shravya Ramesh <37447613+shravyaramesh@users.noreply.github.com> | 2020-11-09 11:30:26 -0800 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-11-09 14:30:26 -0500 |
| commit | d7ed9541f47c22d93c43a32baf3bf33d68d823c8 (patch) | |
| tree | 8342087f4cc5f41aff3f3fcec4559ac9019144db /src/screens | |
| parent | ea0b0a9730d2a5e410583f04c5d138a73d709a6c (diff) | |
blur background, realign comment count, reposition content (#110)
Diffstat (limited to 'src/screens')
| -rw-r--r-- | src/screens/profile/IndividualMoment.tsx | 19 |
1 files changed, 12 insertions, 7 deletions
diff --git a/src/screens/profile/IndividualMoment.tsx b/src/screens/profile/IndividualMoment.tsx index b76f36d0..a6f917b7 100644 --- a/src/screens/profile/IndividualMoment.tsx +++ b/src/screens/profile/IndividualMoment.tsx @@ -1,6 +1,7 @@ import React, {useEffect, useState} from 'react'; -import {StyleSheet, View, Image} from 'react-native'; +import {StyleSheet, View, Image, Text} from 'react-native'; import {Button} from 'react-native-elements'; +import {BlurView} from '@react-native-community/blur'; import { SCREEN_HEIGHT, SCREEN_WIDTH, @@ -85,7 +86,11 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({ }, [date_time, userId]); return ( - <View style={styles.contentContainer}> + <BlurView + blurType="light" + blurAmount={10} + reducedTransparencyFallbackColor="white" + style={styles.contentContainer}> <View style={styles.buttonsContainer}> <Button title="Close" @@ -114,7 +119,7 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({ <Animated.Text style={styles.text}>{elapsedTime}</Animated.Text> </View> <Animated.Text style={styles.text}>{caption}</Animated.Text> - </View> + </BlurView> ); }; const styles = StyleSheet.create({ @@ -122,7 +127,6 @@ const styles = StyleSheet.create({ width: SCREEN_WIDTH, paddingTop: StatusBarHeight, paddingBottom: SCREEN_HEIGHT, - backgroundColor: 'transparent', }, buttonsContainer: { flexDirection: 'row', @@ -149,15 +153,16 @@ const styles = StyleSheet.create({ bodyContainer: { flexDirection: 'row', justifyContent: 'space-between', - marginLeft: '5%', + marginLeft: '7%', marginRight: '5%', + marginBottom: '2%', }, text: { position: 'relative', paddingBottom: '1%', paddingTop: '1%', - marginLeft: '5%', - marginRight: '5%', + marginLeft: '7%', + marginRight: '2%', color: '#ffffff', fontWeight: 'bold', }, |