Fixed display issues on Android

Fixed bug where option list screen was always visible; this problem was caused by using position: absolute and display: none, which React Native does not like (see facebook/react-native#18415) Added solid black background to header in OptionList, preventing overlay with list items
elddc · Dec 10, 2021 · d0bcadc · d0bcadc
1 parent 978c35f
commit d0bcadc
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/components/optionlist.js b/components/optionlist.js
@@ -13,7 +13,7 @@ const Option = ({name, select}) => {
 
 const OptionList = ({title, options, visible, dismiss, select}) => {
 	return (
-		<View style={[s.fullscreen, !visible && s.hidden]}>
+		<View style={visible ? s.fullscreen : s.hidden}>
 			<FlatList
 				style={{width: '100%'}}
 				data={options}

diff --git a/styles/styles.js b/styles/styles.js
@@ -155,6 +155,7 @@ let header = {
 	paddingBottom: .8*em,
 	borderBottomWidth: 2,
 	borderColor: 'white',
+	backgroundColor: 'black',
 };
 let headerText = {
 	...text,