implement home page

src/constants/imgs.js

@@ -63,4 +63,5 @@ export default {
   game_img_43: require('../assets/games/baby02.png'),
   game_img_44: require('../assets/games/game02Backgroundnew.jpeg'),
   game_img_45: require('../assets/games/game02Backgroundnew02.jpeg'),
+  home_page: require('../assets/home_page.png'),
 };

src/screens/auth/Login.js

@@ -8,54 +8,62 @@ import {
   TouchableOpacity,
   KeyboardAvoidingView,
   ScrollView,
-  ToastAndroid
+  ToastAndroid,
 } from 'react-native';
 import LinearGradient from 'react-native-linear-gradient';
 import {COLORS, ROUTES} from '../../constants';
 import Logo from '../../assets/icons/mother.svg';
-import { Formik } from 'formik';
-import { signin } from '../../services/auth/index';
+import {Formik} from 'formik';
+import {signin} from '../../services/auth/index';
 
-
-const Login = (props) => {
+const Login = props => {
   const {navigation} = props;
-  const onSubmit = async (values) => {
-    console.log("dataset2")
+  const onSubmit = async values => {
+    console.log('dataset2');
     let respond = await signin(values.email, values.password);
-    console.log("dataset3",respond.data)
-    if(respond.data){
-      if(respond.data.success === true){
-        console.log("dataset")
-        navigation.navigate(ROUTES.HOME)
-      }
-      else{
+    console.log('dataset3', respond.data);
+    if (respond.data) {
+      if (respond.data.success === true) {
+        console.log('dataset');
+        ToastAndroid.show('Logged Successfully', ToastAndroid.SHORT);
+        navigation.navigate(ROUTES.HOME);
+      } else {
         ToastAndroid.show('Email or password incorrect !', ToastAndroid.SHORT);
       }
-    }
-    else{
+    } else {
       ToastAndroid.show('Network Error !', ToastAndroid.SHORT);
     }
-    
-} 
+  };
   return (
-    <KeyboardAvoidingView style={{flex:1}}>
-    <ScrollView contentContainerStyle={{flex:1}} bounces={false}>
+    <KeyboardAvoidingView style={{flex: 1}}>
+      <ScrollView contentContainerStyle={{flex: 1}} bounces={false}>
         <View style={Styles.container}>
           <View style={Styles.wFull}>
             <Formik
-                initialValues={{ email: '' , password: ''}}
-                onSubmit={values => onSubmit(values)}
-            >
-                {({ handleChange, handleBlur, handleSubmit, values }) => (
+              initialValues={{email: '', password: ''}}
+              onSubmit={values => onSubmit(values)}>
+              {({handleChange, handleBlur, handleSubmit, values}) => (
                 <>
                   <View style={Styles.row}>
                     <Logo width={55} height={55} style={Styles.mr7} />
                     <Text style={Styles.brandName}>EmidWife</Text>
                   </View>
 
-          <Text style={Styles.loginContinueTxt}>Login in to continue</Text>
-          <TextInput style={Styles.input} placeholder="Email"  onChangeText={handleChange('email')} value={values.email}/>
-          <TextInput style={Styles.input} placeholder="Password" onChangeText={handleChange('password')} value={values.password}/>
+                  <Text style={Styles.loginContinueTxt}>
+                    Login in to continue
+                  </Text>
+                  <TextInput
+                    style={Styles.input}
+                    placeholder="Email"
+                    onChangeText={handleChange('email')}
+                    value={values.email}
+                  />
+                  <TextInput
+                    style={Styles.input}
+                    placeholder="Password"
+                    onChangeText={handleChange('password')}
+                    value={values.password}
+                  />
 
                   <View style={Styles.loginBtnWrapper}>
                     <LinearGradient
@@ -64,14 +72,19 @@ const Login = (props) => {
                       start={{y: 0.0, x: 0.0}}
                       end={{y: 1.0, x: 0.0}}>
                       {/******************** LOGIN BUTTON *********************/}
-              <TouchableOpacity activeOpacity={0.7} style={Styles.loginBtn}   onPress={handleSubmit}>
+                      <TouchableOpacity
+                        activeOpacity={0.7}
+                        style={Styles.loginBtn}
+                        onPress={handleSubmit}>
                         <Text style={Styles.loginText}>Log In</Text>
                       </TouchableOpacity>
                     </LinearGradient>
                   </View>
 
                   {/***************** FORGOT PASSWORD BUTTON *****************/}
-          <TouchableOpacity style={Styles.loginBtn}  onPress={() => navigation.navigate(ROUTES.FORGOT_PASSWORD)}>
+                  <TouchableOpacity
+                    style={Styles.loginBtn}
+                    onPress={() => navigation.navigate(ROUTES.FORGOT_PASSWORD)}>
                     <Text style={Styles.forgotPassText}>Forgot Password?</Text>
                   </TouchableOpacity>
                 </>
@@ -82,7 +95,8 @@ const Login = (props) => {
           <View style={Styles.footer}>
             <Text style={Styles.footerText}> Don't have an account? </Text>
             {/******************** REGISTER BUTTON *********************/}
-          <TouchableOpacity onPress={() => navigation.navigate(ROUTES.REGISTER)}>
+            <TouchableOpacity
+              onPress={() => navigation.navigate(ROUTES.REGISTER)}>
               <Text style={Styles.signupBtn}>Sign Up</Text>
             </TouchableOpacity>
           </View>
@@ -120,7 +134,6 @@ const Styles = StyleSheet.create({
     color: COLORS.gray,
     marginBottom: 16,
     fontWeight: 'bold',
-    
   },
   input: {
     borderWidth: 1,
@@ -130,7 +143,7 @@ const Styles = StyleSheet.create({
     borderRadius: 12,
     height: 45,
     paddingVertical: 0,
-    color: "black"
+    color: 'black',
   },
   // Login Btn Styles
   loginBtnWrapper: {

src/screens/auth/Register.js

@@ -28,8 +28,8 @@ const Register = ({navigation}) => {
     console.log('dataset3', respond.data);
     if (respond.data.success === true) {
       console.log('dataset');
+      ToastAndroid.show('Registered Successfully', ToastAndroid.SHORT);
       navigation.navigate(ROUTES.HOME);
-      ToastAndroid.show('Login success', ToastAndroid.SHORT);
     } else {
       ToastAndroid.show('Network or details not clear !', ToastAndroid.SHORT);
     }

src/screens/home/Home.js

 import React from 'react';
-import { SafeAreaView, StyleSheet, Text, View } from 'react-native';
+import {Image, TouchableOpacity, Text, View} from 'react-native';
+import {COLORS, IMGS} from '../../constants';
+import LinearGradient from 'react-native-linear-gradient';
 
 const Home = () => {
   return (
+    <LinearGradient
+      style={{
+        flex: 1,
+      }}
+      colors={[COLORS.dark_purple, COLORS.white, COLORS.dark_purple]}>
       <View>
-            <Text>Register</Text>
+        <View>
+          <Image
+            source={IMGS.home_page}
+            style={{
+              height: 360,
+              width: '100%',
+              position: 'absolute',
+              top: 100,
+            }}
+          />
+        </View>
+
+        <View
+          style={{
+            paddingHorizontal: 67,
+            position: 'absolute',
+            top: 590,
+            width: '100%',
+          }}>
+          <Text
+            style={{
+              fontSize: 48,
+              color: COLORS.black,
+              fontWeight: 'bold',
+              textAlign: 'center',
+            }}>
+            Welcome to
+          </Text>
+          <Text
+            style={{
+              fontSize: 48,
+              color: COLORS.black,
+              fontWeight: 'bold',
+              textAlign: 'center',
+            }}>
+            e-MidWife
+          </Text>
+
+          {/* <View style={{marginTop: 1}}>
+            <TouchableOpacity
+              style={{
+                backgroundColor: COLORS.purple_new,
+                borderColor: COLORS.purple_new,
+                height: 50,
+                marginBottom: 50,
+                justifyContent: 'center',
+                alignItems: 'center',
+                borderRadius: 14,
+                width: '100%',
+                zIndex: 3,
+                elevation: 10,
+              }}
+                onPress={() => navigation.navigate(ROUTES.GAME_QUIZ_OPTIONS)}
+            >
+              <Text
+                medium
+                center
+                style={{color: 'white', fontSize: 24, fontWeight: 'bold'}}>
+                Start
+              </Text>
+            </TouchableOpacity>
+          </View> */}
+        </View>
       </View>
+    </LinearGradient>
   );
 };
 export default Home;