martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-12 03:29:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixing overlay blur for android

Browse Source
This commit is contained in:
balzack 2023-09-13 22:25:01 -07:00
parent 7a62d0ec82
commit dcdee2413e
2 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/mobile/src/session/profile/Profile.jsx
View File

@ -152,8 +152,9 @@ export function Profile() {
supportedOrientations={['portrait', 'landscape']} supportedOrientations={['portrait', 'landscape']}
onRequestClose={actions.hideDetails} onRequestClose={actions.hideDetails}
> >
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'}> <View style={styles.modalOverlay}>
<BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black"> <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
<KeyboardAvoidingView style={style.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
<View style={styles.modalContainer}> <View style={styles.modalContainer}>
<View style={styles.modalClose}> <View style={styles.modalClose}>
<TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideDetails}> <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideDetails}>
@ -207,8 +208,8 @@ export function Profile() {
</View> </View>
</View> </View>
</BlurView>
</KeyboardAvoidingView> </KeyboardAvoidingView>
</View>
</Modal> </Modal>
</View> </View>

11
app/mobile/src/session/profile/Profile.styled.js
View File

@ -184,11 +184,18 @@ export const styles = StyleSheet.create({
textAlign: 'center', textAlign: 'center',
}, },
modalOverlay: { modalOverlay: {
display: 'flex',
width: '100%', width: '100%',
height: '100%', height: '100%',
},
modalBase: {
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
display: 'flex',
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center'
}, },
modalContainer: { modalContainer: {
backgroundColor: Colors.modalBase, backgroundColor: Colors.modalBase,