Skip to content

Commit 28b85ba

Browse files
committed
fix keyb issue
1 parent c60e083 commit 28b85ba

2 files changed

Lines changed: 118 additions & 112 deletions

File tree

app/(auth)/sign-in.tsx

Lines changed: 63 additions & 60 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, 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

@@ -21,76 +21,79 @@ export default function SignInScreen() {
2121
};
2222

2323
return (
24-
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
25-
<View style={[styles.container, { backgroundColor: colors.background }]}>
26-
<View style={styles.logoContainer}>
27-
<Image
28-
source={require('../../assets/images/icon.png')}
29-
style={styles.logo}
30-
resizeMode="contain"
31-
/>
32-
</View>
33-
34-
<View style={[styles.card, { backgroundColor: colors.card }]}>
35-
<Text style={[styles.title, { color: colors.text }]}>Welcome Back</Text>
36-
<Text style={[styles.subtitle, { color: colors.textSecondary }]}>
37-
Sign in to your account
38-
</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>
3943

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

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

58-
<TextInput
59-
style={[styles.input, {
60-
backgroundColor: colors.background,
61-
borderColor: colors.border,
62-
color: colors.text
63-
}]}
64-
placeholder="Password"
65-
placeholderTextColor={colors.textSecondary}
66-
value={password}
67-
onChangeText={setPassword}
68-
secureTextEntry
69-
/>
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+
/>
7074

71-
<TouchableOpacity
72-
style={[styles.button, { backgroundColor: colors.primary }]}
73-
onPress={handleSignIn}>
74-
<Text style={[styles.buttonText, { color: colors.card }]}>Sign In</Text>
75-
</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>
7680

77-
<View style={styles.footer}>
78-
<Text style={[styles.footerText, { color: colors.textSecondary }]}>
79-
Don't have an account?{' '}
80-
</Text>
81-
<Link href="/sign-up" style={[styles.link, { color: colors.primary }]}>
82-
Sign Up
83-
</Link>
84-
</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>
8588
</View>
8689
</View>
87-
</TouchableWithoutFeedback>
90+
</ScrollView>
8891
);
8992
}
9093

9194
const styles = StyleSheet.create({
9295
container: {
93-
flex: 1,
96+
flexGrow: 1,
9497
justifyContent: 'center',
9598
padding: 20,
9699
},

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)