2 Commits

Author SHA1 Message Date
bd500674a0 fix(ui): stabilize modal keyboard behavior
All checks were successful
Luggage List Build / build-web (push) Successful in 55s
Luggage List Build / build-android (push) Successful in 6m28s
Luggage List Build / release (push) Successful in 10s
2026-04-18 14:12:34 +02:00
ef7e0ba7a1 style: center and enlarge modals to overlay navbar
All checks were successful
Luggage List Build / build-web (push) Successful in 30s
Luggage List Build / build-android (push) Successful in 6m13s
Luggage List Build / release (push) Successful in 15s
2026-04-18 13:34:42 +02:00
4 changed files with 25 additions and 10 deletions

View File

@@ -37,3 +37,5 @@ Improving & Fixing Bugs (V3)
- [x] Increased safe top inset to avoid status-bar overlap
- [x] Added check-up stats (correct/bad/pending) and persisted per snapshot
- [x] Extra UI polish pass (spacing, cards, hierarchy)
- [x] Centered and enlarged edit/check-up modals to fully overlay nav
- [x] Fixed modal keyboard glitching (stable centered keyboard-aware layout)

View File

@@ -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}

View File

@@ -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}

View File

@@ -400,20 +400,23 @@ export const styles = StyleSheet.create({
modalBackdrop: {
flex: 1,
backgroundColor: 'rgba(2,6,23,0.72)',
justifyContent: 'flex-end',
paddingHorizontal: 12,
},
modalKeyboardWrap: {
flex: 1,
width: '100%',
alignItems: 'center',
justifyContent: 'center',
},
modalCard: {
maxHeight: '87%',
width: '96%',
maxHeight: '90%',
backgroundColor: '#0f172a',
borderTopLeftRadius: 18,
borderTopRightRadius: 18,
borderRadius: 20,
borderWidth: 1,
borderColor: '#1e293b',
padding: 14,
gap: 8,
padding: 16,
gap: 10,
},
closeText: {
color: '#93c5fd',