fix full screen modal notch background

This commit is contained in:
bartronx7 2019-06-22 12:10:34 -05:00
parent e9cdfd35dc
commit 46e2f03838

View file

@ -1,9 +1,10 @@
// @flow
import React from 'react';
import { SafeAreaView } from 'react-native';
import { View, SafeAreaView } from 'react-native';
import { Toolbar } from 'react-native-material-ui';
import { compose, renderComponent, mapProps, pure } from 'recompose';
import TopSaveButton from '../components/TopSaveButton';
import { palette } from '../ui-theme';
type Props = {
onClose: () => void,
@ -13,28 +14,32 @@ type Props = {
};
const FullScreenModal = ({ onSave, onClose, title, children }: Props) => (
<SafeAreaView
<View
style={{
backgroundColor: 'white',
position: 'absolute',
top: 0,
bottom: 0,
left: 0,
right: 0,
backgroundColor: 'white',
}}>
<Toolbar
leftElement="close"
onLeftElementPress={onClose}
centerElement={title}
rightElement={onSave && <TopSaveButton onSave={onSave} />}
style={{
container: {
elevation: 3,
},
}}
/>
<View style={{ backgroundColor: palette.primaryColor }}>
<SafeAreaView>
<Toolbar
leftElement="close"
onLeftElementPress={onClose}
centerElement={title}
rightElement={onSave && <TopSaveButton onSave={onSave} />}
style={{
container: {
elevation: 3,
},
}}
/>
</SafeAreaView>
</View>
{children}
</SafeAreaView>
</View>
);
export default FullScreenModal;