Make settings page more compact

This commit is contained in:
Brandon Presley 2022-09-25 18:35:30 +13:00
parent 1ee95021b9
commit ce0297dce6

View File

@ -1,7 +1,7 @@
import {Picker} from '@react-native-picker/picker'; import {Picker} from '@react-native-picker/picker';
import {useFocusEffect} from '@react-navigation/native'; import {useFocusEffect} from '@react-navigation/native';
import React, {useCallback, useContext, useEffect, useState} from 'react'; import React, {useCallback, useContext, useEffect, useState} from 'react';
import {NativeModules, ScrollView, StyleSheet} from 'react-native'; import {NativeModules, Pressable, ScrollView, StyleSheet} from 'react-native';
import DocumentPicker from 'react-native-document-picker'; import DocumentPicker from 'react-native-document-picker';
import {Button, Text} from 'react-native-paper'; import {Button, Text} from 'react-native-paper';
import {CustomTheme} from './App'; import {CustomTheme} from './App';
@ -165,14 +165,21 @@ export default function SettingsPage() {
input.name.toLowerCase().includes(search.toLowerCase()), input.name.toLowerCase().includes(search.toLowerCase()),
) )
.map(input => ( .map(input => (
<React.Fragment key={input.name}> <Pressable
onPress={() => input.onChange(!input.value)}
style={{
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
}}
key={input.name}>
<Text style={styles.item}>{input.name}</Text> <Text style={styles.item}>{input.name}</Text>
<MassiveSwitch <MassiveSwitch
style={styles.item} style={styles.item}
value={input.value} value={input.value}
onValueChange={input.onChange} onValueChange={input.onChange}
/> />
</React.Fragment> </Pressable>
))} ))}
{'alarm sound'.includes(search.toLowerCase()) && ( {'alarm sound'.includes(search.toLowerCase()) && (
<Button style={{alignSelf: 'flex-start'}} onPress={changeSound}> <Button style={{alignSelf: 'flex-start'}} onPress={changeSound}>