fix(ui): stabilize modal keyboard behavior
This commit is contained in:
@@ -15,7 +15,7 @@ export default function CheckupFixModal({
|
||||
return (
|
||||
<Modal visible={visible} animationType="slide" transparent>
|
||||
<View style={styles.modalBackdrop}>
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} style={styles.modalKeyboardWrap}>
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : undefined} style={styles.modalKeyboardWrap}>
|
||||
<View style={styles.modalCard}>
|
||||
<View style={styles.sectionRow}>
|
||||
<Text style={styles.sectionTitle}>Update for this Check-Up</Text>
|
||||
@@ -24,7 +24,12 @@ export default function CheckupFixModal({
|
||||
</Pressable>
|
||||
</View>
|
||||
|
||||
<ScrollView keyboardShouldPersistTaps="handled" showsVerticalScrollIndicator={false}>
|
||||
<ScrollView
|
||||
keyboardShouldPersistTaps="handled"
|
||||
keyboardDismissMode="interactive"
|
||||
contentContainerStyle={{ paddingBottom: 12 }}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<Field label="Status">
|
||||
<ChipGroup
|
||||
options={ITEM_STATUSES}
|
||||
|
||||
@@ -16,7 +16,7 @@ export default function ItemModal({
|
||||
return (
|
||||
<Modal visible={visible} animationType="slide" transparent>
|
||||
<View style={styles.modalBackdrop}>
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} style={styles.modalKeyboardWrap}>
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : undefined} style={styles.modalKeyboardWrap}>
|
||||
<View style={styles.modalCard}>
|
||||
<View style={styles.sectionRow}>
|
||||
<Text style={styles.sectionTitle}>{itemForm.id ? 'Update Item' : 'Add Item'}</Text>
|
||||
@@ -25,7 +25,12 @@ export default function ItemModal({
|
||||
</Pressable>
|
||||
</View>
|
||||
|
||||
<ScrollView keyboardShouldPersistTaps="handled" showsVerticalScrollIndicator={false}>
|
||||
<ScrollView
|
||||
keyboardShouldPersistTaps="handled"
|
||||
keyboardDismissMode="interactive"
|
||||
contentContainerStyle={{ paddingBottom: 12 }}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<Field label="Name">
|
||||
<TextInput
|
||||
style={styles.input}
|
||||
|
||||
@@ -400,17 +400,17 @@ export const styles = StyleSheet.create({
|
||||
modalBackdrop: {
|
||||
flex: 1,
|
||||
backgroundColor: 'rgba(2,6,23,0.72)',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
paddingHorizontal: 12,
|
||||
},
|
||||
modalKeyboardWrap: {
|
||||
flex: 1,
|
||||
width: '100%',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
modalCard: {
|
||||
width: '96%',
|
||||
maxHeight: '92%',
|
||||
maxHeight: '90%',
|
||||
backgroundColor: '#0f172a',
|
||||
borderRadius: 20,
|
||||
borderWidth: 1,
|
||||
|
||||
Reference in New Issue
Block a user