Skip to content

Commit 9d74b48

Browse files
munezeromichamunezeromicha
committed
fix-SignupAndLogin-screen-added
fix-SignupAndLogin-screen-added
1 parent f488cab commit 9d74b48

File tree

11 files changed

+647
-208
lines changed

11 files changed

+647
-208
lines changed

‎app/(app)/ActionMenu/Booking/SelectPayment.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ export default function SelectPayment() {
6767
: Colors.others.white,
6868
opacity: 8,
6969
}}
70-
onPress={() => {}}
70+
onPress={() => router.push('(app)/ActionMenu/Booking/AddNewCard')}
7171
// shadowColor={Colors.main.primary._100}
7272
/>
7373
<Button

‎app/(app)/ActionMenu/Booking/_layout.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ export default function BookingLayout() {
2222
<Stack.Screen name="Select-package" options={{ headerShown: false }} />
2323
<Stack.Screen name="Patient-details" options={{ headerShown: false }} />
2424
<Stack.Screen name="EnterYourPin" options={{ headerShown: false }} />
25+
<Stack.Screen name="AddNewCard" options={{ headerShown: false }} />
2526
<Stack.Screen
2627
name="SelectPayment"
2728
options={{ header: () => <Header title="Payments" /> }}

‎app/(auth)/SignIn&SignOut/LetsYouIn.tsx‎

Lines changed: 105 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,155 @@
11
import * as React from "react";
2-
import { StyleSheet, Text, View, Image, TouchableOpacity, Pressable } from "react-native";
3-
import { useState } from "react";
2+
import {
3+
StyleSheet,
4+
Text,
5+
View,
6+
Image,
7+
TouchableOpacity,
8+
Pressable,
9+
} from "react-native";
10+
import { useState, useContext } from "react";
411
import { LeftArrow } from "@/components/UI/Icons";
512
import { router } from "expo-router";
613
import Typography from "../../../constants/Typography";
714
import { Colors } from "../../../constants/Colors";
15+
import { ThemeContext } from "@/ctx/ThemeContext";
16+
import { StatusBar } from "expo-status-bar";
17+
import {
18+
BackArrow,
19+
blackArrow,
20+
OrLine,
21+
greyOrLine,
22+
BlackApple,
23+
WhiteApple,
24+
} from "@/components/Icons/Icons";
25+
import { SvgXml } from "react-native-svg";
826

927
const LetsYouIn = () => {
1028
const [visible, setVisible] = React.useState(false);
1129
const hideDialog = () => setVisible(false);
30+
const { theme, changeTheme } = useContext(ThemeContext);
31+
changeTheme("dark");
1232

1333
return (
14-
<View style={styles.container}>
15-
<Pressable
16-
onPress={()=> router.back()}
17-
style={styles.arrow}>
18-
<LeftArrow fillColor={"#23272f"} />
34+
<View
35+
style={[
36+
styles.container,
37+
{ backgroundColor: theme === "dark" ? "#181A20" : "#FFFFFF" },
38+
]}
39+
>
40+
<StatusBar style={theme === "dark" ? "light" : "dark"} />
41+
<Pressable onPress={() => router.back()} style={styles.arrow}>
42+
<SvgXml xml={theme === "dark" ? BackArrow : blackArrow} />
1943
</Pressable>
2044

2145
<Image source={require("../../../assets/icons/FrameOne.png")} />
2246

23-
<View style={styles.middlePart}>
24-
<View style={styles.midPartOne}>
25-
<Text
26-
style={[Typography.heading._1, { color: Colors.grayScale._900 }]}
27-
>
28-
Let's you in
29-
</Text>
30-
</View>
47+
<View style={styles.midPartOne}>
48+
<Text
49+
style={[
50+
Typography.heading._1,
51+
{ color: theme === "dark" ? "#FFFFFF" : Colors.grayScale._900 },
52+
]}
53+
>
54+
Let's you in
55+
</Text>
56+
</View>
3157

58+
<View style={styles.middlePart}>
3259
<View style={styles.Buttons}>
33-
<TouchableOpacity style={styles.middleButton}>
60+
<TouchableOpacity
61+
style={[
62+
styles.middleButton,
63+
{ backgroundColor: theme === "dark" ? "#1F222A" : "#FFFFFF", borderColor: theme === 'dark' ? '#35383F' : '#EEEEEE' },
64+
]}
65+
>
3466
<Image source={require("../../../assets/icons/facebook.png")} />
35-
<Text style={[Typography.semiBold.large]}>
67+
<Text
68+
style={[
69+
Typography.semiBold.large,
70+
{ color: theme === "dark" ? "#FFFFFF" : Colors.grayScale._900 },
71+
]}
72+
>
3673
Continue with facebook
3774
</Text>
3875
</TouchableOpacity>
3976

40-
<TouchableOpacity style={styles.middleButton}>
77+
<TouchableOpacity
78+
style={[
79+
styles.middleButton,
80+
{ backgroundColor: theme === "dark" ? "#1F222A" : "#FFFFFF", borderColor: theme === 'dark' ? '#35383F' : '#EEEEEE' },
81+
]}
82+
>
4183
<Image source={require("../../../assets/icons/Google.png")} />
42-
<Text style={[Typography.semiBold.large]}>
84+
<Text
85+
style={[
86+
Typography.semiBold.large,
87+
{ color: theme === "dark" ? "#FFFFFF" : Colors.grayScale._900 },
88+
]}
89+
>
4390
Continue with Google
4491
</Text>
4592
</TouchableOpacity>
4693

47-
<TouchableOpacity style={styles.middleButton}>
48-
<Image source={require("../../../assets/icons/AppleIcon.png")} />
49-
<Text style={[Typography.semiBold.large]}>Continue with Apple</Text>
94+
<TouchableOpacity
95+
style={[
96+
styles.middleButton,
97+
{ backgroundColor: theme === "dark" ? "#1F222A" : "#FFFFFF", borderColor: theme === 'dark' ? '#35383F' : '#EEEEEE' },
98+
]}
99+
>
100+
<SvgXml xml={theme === 'dark' ? WhiteApple : BlackApple } />
101+
<Text
102+
style={[
103+
Typography.semiBold.large,
104+
{ color: theme === "dark" ? "#FFFFFF" : Colors.grayScale._900 },
105+
]}
106+
>
107+
Continue with Apple
108+
</Text>
50109
</TouchableOpacity>
51110
</View>
52111
</View>
53112

54-
<Image source={require("../../../assets/icons/OR.png")} />
113+
<SvgXml xml={theme === "dark" ? OrLine : greyOrLine} />
55114

56-
<TouchableOpacity
57-
onPress={()=> router.push("/(auth)/SignIn&SignOut/YourProfile")}
58-
style={styles.signinBtn}>
115+
<TouchableOpacity
116+
onPress={() => router.push("/(auth)/SignIn&SignOut/YourProfile")}
117+
style={styles.signinBtn}
118+
>
59119
<Text style={[Typography.bold.large, { color: Colors.others.white }]}>
60120
Sign in with password
61121
</Text>
62122
</TouchableOpacity>
63123

64-
<Text style={[Typography.regular.medium]}>
65-
Don't have an account?
124+
<View style={{ flexDirection: "row", gap: 5 }}>
125+
<Text
126+
style={[
127+
Typography.regular.medium,
128+
{ color: theme === "dark" ? "#FFFFFF" : Colors.grayScale._500 },
129+
]}
130+
>
131+
Don't have an account?
132+
</Text>
66133
<Text
67-
style={styles.signupText}
134+
style={[Typography.semiBold.medium, { color: "#246DFB" }]}
68135
onPress={() =>
69136
router.replace("/(auth)/SignIn&SignOut/SignUpBlankForm")
70137
}
71138
>
72139
Sign up
73140
</Text>
74-
</Text>
141+
</View>
75142
</View>
76143
);
77144
};
78145

79146
export default LetsYouIn;
80147

81148
const styles = StyleSheet.create({
82-
signupText: {
83-
color: "#246BFD",
84-
fontWeight: "600",
85-
},
149+
// signupText: {
150+
// color: "#246BFD",
151+
// fontWeight: "600",
152+
// },
86153
signText: {
87154
fontSize: 16,
88155
color: "#FFFFFF",
@@ -95,6 +162,8 @@ const styles = StyleSheet.create({
95162
borderRadius: 100,
96163
justifyContent: "center",
97164
alignItems: "center",
165+
shadowColor: "#246BFD",
166+
elevation: 10,
98167
},
99168
textBtn: {
100169
fontSize: 16,
@@ -104,7 +173,6 @@ const styles = StyleSheet.create({
104173
flexDirection: "row",
105174
gap: 15,
106175
borderWidth: 1,
107-
borderColor: "#eeeeee",
108176
justifyContent: "center",
109177
alignItems: "center",
110178
padding: 15,
@@ -127,7 +195,7 @@ const styles = StyleSheet.create({
127195
alignItems: "center",
128196
},
129197
middlePart: {
130-
gap: 30,
198+
gap: 24,
131199
},
132200
arrow: {
133201
alignSelf: "flex-start",
@@ -141,7 +209,7 @@ const styles = StyleSheet.create({
141209
gap: 20,
142210
paddingTop: 24,
143211
paddingLeft: 24,
144-
paddingBottom: 48,
212+
paddingBottom: 24,
145213
paddingRight: 24,
146214
// borderWidth: 4,
147215
// borderColor: 'red',

0 commit comments

Comments
 (0)