Skip to content

Commit 21ae31f

Browse files
committed
fix keyb issue
1 parent 0981deb commit 21ae31f

2 files changed

Lines changed: 118 additions & 113 deletions

File tree

app/(auth)/sign-in.tsx

Lines changed: 63 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import { useState } from 'react';
2-
import { View, Text, TextInput, TouchableOpacity, StyleSheet, Image, Keyboard, TouchableWithoutFeedback } from 'react-native';
3-
import { Link, router } from 'expo-router';
2+
import { View, Text, TextInput, TouchableOpacity, StyleSheet, Image, ScrollView, Platform } from 'react-native';
3+
import { router } from 'expo-router';
44
import { useAuth } from '../../lib/auth';
55
import { useTheme } from '../../lib/theme';
66

77
export default function SignInScreen() {
8-
console.log('SignInScreen rendered');
98
const [email, setEmail] = useState('');
109
const [password, setPassword] = useState('');
1110
const [error, setError] = useState('');
@@ -22,76 +21,79 @@ export default function SignInScreen() {
2221
};
2322

2423
return (
25-
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
26-
<View style={[styles.container, { backgroundColor: colors.background }]}>
27-
<View style={styles.logoContainer}>
28-
<Image
29-
source={require('../../assets/images/icon.png')}
30-
style={styles.logo}
31-
resizeMode="contain"
32-
/>
33-
</View>
34-
35-
<View style={[styles.card, { backgroundColor: colors.card }]}>
36-
<Text style={[styles.title, { color: colors.text }]}>Welcome Back</Text>
37-
<Text style={[styles.subtitle, { color: colors.textSecondary }]}>
38-
Sign in to your account
39-
</Text>
24+
<ScrollView
25+
style={{ backgroundColor: colors.background }}
26+
contentContainerStyle={styles.container}
27+
keyboardShouldPersistTaps="handled"
28+
showsVerticalScrollIndicator={false}
29+
>
30+
<View style={styles.logoContainer}>
31+
<Image
32+
source={require('../../assets/images/icon.png')}
33+
style={styles.logo}
34+
resizeMode="contain"
35+
/>
36+
</View>
37+
38+
<View style={[styles.card, { backgroundColor: colors.card }]}>
39+
<Text style={[styles.title, { color: colors.text }]}>Welcome Back</Text>
40+
<Text style={[styles.subtitle, { color: colors.textSecondary }]}>
41+
Sign in to your account
42+
</Text>
4043

41-
{error ? (
42-
<Text style={[styles.error, { color: colors.error }]}>{error}</Text>
43-
) : null}
44+
{error ? (
45+
<Text style={[styles.error, { color: colors.error }]}>{error}</Text>
46+
) : null}
4447

45-
<TextInput
46-
style={[styles.input, {
47-
backgroundColor: colors.background,
48-
borderColor: colors.border,
49-
color: colors.text
50-
}]}
51-
placeholder="Email"
52-
placeholderTextColor={colors.textSecondary}
53-
value={email}
54-
onChangeText={setEmail}
55-
autoCapitalize="none"
56-
keyboardType="email-address"
57-
/>
48+
<TextInput
49+
style={[styles.input, {
50+
backgroundColor: colors.background,
51+
borderColor: colors.border,
52+
color: colors.text
53+
}]}
54+
placeholder="Email"
55+
placeholderTextColor={colors.textSecondary}
56+
value={email}
57+
onChangeText={setEmail}
58+
autoCapitalize="none"
59+
keyboardType="email-address"
60+
/>
5861

59-
<TextInput
60-
style={[styles.input, {
61-
backgroundColor: colors.background,
62-
borderColor: colors.border,
63-
color: colors.text
64-
}]}
65-
placeholder="Password"
66-
placeholderTextColor={colors.textSecondary}
67-
value={password}
68-
onChangeText={setPassword}
69-
secureTextEntry
70-
/>
62+
<TextInput
63+
style={[styles.input, {
64+
backgroundColor: colors.background,
65+
borderColor: colors.border,
66+
color: colors.text
67+
}]}
68+
placeholder="Password"
69+
placeholderTextColor={colors.textSecondary}
70+
value={password}
71+
onChangeText={setPassword}
72+
secureTextEntry
73+
/>
7174

72-
<TouchableOpacity
73-
style={[styles.button, { backgroundColor: colors.primary }]}
74-
onPress={handleSignIn}>
75-
<Text style={[styles.buttonText, { color: colors.card }]}>Sign In</Text>
76-
</TouchableOpacity>
75+
<TouchableOpacity
76+
style={[styles.button, { backgroundColor: colors.primary }]}
77+
onPress={handleSignIn}>
78+
<Text style={[styles.buttonText, { color: colors.card }]}>Sign In</Text>
79+
</TouchableOpacity>
7780

78-
<View style={styles.footer}>
79-
<Text style={[styles.footerText, { color: colors.textSecondary }]}>
80-
Don't have an account?{' '}
81-
</Text>
82-
<Link href="/sign-up" style={[styles.link, { color: colors.primary }]}>
83-
Sign Up
84-
</Link>
85-
</View>
81+
<View style={styles.footer}>
82+
<Text style={[styles.footerText, { color: colors.textSecondary }]}>
83+
Don't have an account?{' '}
84+
</Text>
85+
<TouchableOpacity onPress={() => router.push('/sign-up')}>
86+
<Text style={[styles.link, { color: colors.primary }]}>Sign Up</Text>
87+
</TouchableOpacity>
8688
</View>
8789
</View>
88-
</TouchableWithoutFeedback>
90+
</ScrollView>
8991
);
9092
}
9193

9294
const styles = StyleSheet.create({
9395
container: {
94-
flex: 1,
96+
flexGrow: 1,
9597
justifyContent: 'center',
9698
padding: 20,
9799
},

app/(auth)/sign-up.tsx

Lines changed: 55 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState } from 'react';
2-
import { View, Text, TextInput, TouchableOpacity, StyleSheet, Keyboard, TouchableWithoutFeedback } from 'react-native';
3-
import { Link, router } from 'expo-router';
2+
import { View, Text, TextInput, TouchableOpacity, StyleSheet, ScrollView } from 'react-native';
3+
import { router } from 'expo-router';
44
import { useAuth } from '../../lib/auth';
55
import { useTheme } from '../../lib/theme';
66

@@ -21,68 +21,71 @@ export default function SignUpScreen() {
2121
};
2222

2323
return (
24-
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
25-
<View style={[styles.container, { backgroundColor: colors.background }]}>
26-
<View style={[styles.card, { backgroundColor: colors.card }]}>
27-
<Text style={[styles.title, { color: colors.text }]}>Create Account</Text>
28-
<Text style={[styles.subtitle, { color: colors.textSecondary }]}>
29-
Join OWC Social
30-
</Text>
24+
<ScrollView
25+
style={{ backgroundColor: colors.background }}
26+
contentContainerStyle={styles.container}
27+
keyboardShouldPersistTaps="handled"
28+
showsVerticalScrollIndicator={false}
29+
>
30+
<View style={[styles.card, { backgroundColor: colors.card }]}>
31+
<Text style={[styles.title, { color: colors.text }]}>Create Account</Text>
32+
<Text style={[styles.subtitle, { color: colors.textSecondary }]}>
33+
Join OWC Social
34+
</Text>
3135

32-
{error ? (
33-
<Text style={[styles.error, { color: colors.error }]}>{error}</Text>
34-
) : null}
36+
{error ? (
37+
<Text style={[styles.error, { color: colors.error }]}>{error}</Text>
38+
) : null}
3539

36-
<TextInput
37-
style={[styles.input, {
38-
backgroundColor: colors.background,
39-
borderColor: colors.border,
40-
color: colors.text
41-
}]}
42-
placeholder="Email"
43-
placeholderTextColor={colors.textSecondary}
44-
value={email}
45-
onChangeText={setEmail}
46-
autoCapitalize="none"
47-
keyboardType="email-address"
48-
/>
40+
<TextInput
41+
style={[styles.input, {
42+
backgroundColor: colors.background,
43+
borderColor: colors.border,
44+
color: colors.text
45+
}]}
46+
placeholder="Email"
47+
placeholderTextColor={colors.textSecondary}
48+
value={email}
49+
onChangeText={setEmail}
50+
autoCapitalize="none"
51+
keyboardType="email-address"
52+
/>
4953

50-
<TextInput
51-
style={[styles.input, {
52-
backgroundColor: colors.background,
53-
borderColor: colors.border,
54-
color: colors.text
55-
}]}
56-
placeholder="Password"
57-
placeholderTextColor={colors.textSecondary}
58-
value={password}
59-
onChangeText={setPassword}
60-
secureTextEntry
61-
/>
54+
<TextInput
55+
style={[styles.input, {
56+
backgroundColor: colors.background,
57+
borderColor: colors.border,
58+
color: colors.text
59+
}]}
60+
placeholder="Password"
61+
placeholderTextColor={colors.textSecondary}
62+
value={password}
63+
onChangeText={setPassword}
64+
secureTextEntry
65+
/>
6266

63-
<TouchableOpacity
64-
style={[styles.button, { backgroundColor: colors.primary }]}
65-
onPress={handleSignUp}>
66-
<Text style={[styles.buttonText, { color: colors.card }]}>Sign Up</Text>
67-
</TouchableOpacity>
67+
<TouchableOpacity
68+
style={[styles.button, { backgroundColor: colors.primary }]}
69+
onPress={handleSignUp}>
70+
<Text style={[styles.buttonText, { color: colors.card }]}>Sign Up</Text>
71+
</TouchableOpacity>
6872

69-
<View style={styles.footer}>
70-
<Text style={[styles.footerText, { color: colors.textSecondary }]}>
71-
Already have an account?{' '}
72-
</Text>
73-
<Link href="/sign-in" style={[styles.link, { color: colors.primary }]}>
74-
Sign In
75-
</Link>
76-
</View>
73+
<View style={styles.footer}>
74+
<Text style={[styles.footerText, { color: colors.textSecondary }]}>
75+
Already have an account?{' '}
76+
</Text>
77+
<TouchableOpacity onPress={() => router.push('/sign-in')}>
78+
<Text style={[styles.link, { color: colors.primary }]}>Sign In</Text>
79+
</TouchableOpacity>
7780
</View>
7881
</View>
79-
</TouchableWithoutFeedback>
82+
</ScrollView>
8083
);
8184
}
8285

8386
const styles = StyleSheet.create({
8487
container: {
85-
flex: 1,
88+
flexGrow: 1,
8689
justifyContent: 'center',
8790
padding: 20,
8891
},

0 commit comments

Comments
 (0)