diff --git a/controller/user/signUp.js b/controller/user/signUp.js
index 9c0aad8..1e651ee 100644
--- a/controller/user/signUp.js
+++ b/controller/user/signUp.js
@@ -15,12 +15,12 @@ class SignUp{
             .then((user) => {
             if (user)
                 {
-                    return res.status(400).json({"msg" : "The entered Email already exist!"})}
+                    return res.status(200).json({"msg" : "The entered Email already exist!","status" : false})}
             else {  
                     //for initialise NodeMailer
                     const transporter =  initNodeMailer();
                     generateOTP(req,res,transporter);
-                    return res.status(200).json({"user" : req.body,"msg" : "OTP has been sent to your Gmail"});
+                    return res.status(200).json({"user" : req.body,"msg" : "OTP has been sent to your Gmail","status" : true});
                 }
             });
         }
diff --git a/frontend/src/pages/Login/index.js b/frontend/src/pages/Login/index.js
index 4cb29dd..2c4896b 100644
--- a/frontend/src/pages/Login/index.js
+++ b/frontend/src/pages/Login/index.js
@@ -1,11 +1,18 @@
 import React from "react";
 import Joi from "@hapi/joi";
-
-
-
+import "../assets/css/bootstrap.css";
+import "../assets/css/bootstrap.min.css";
+import "../assets/css/mdb.css";
+import "../assets/css/mdb.lite.css";
+import "../assets/css/mdb.lite.min.css";
+import "../assets/css/mdb.min.css";
+import "../assets/css/style.min.css";
 import _ from "lodash";
 import { connect } from "react-redux";
 import { signIn } from "../../actions/authAction";
+// import Button from "../../components/common/Button";
+import "./style.css";
+// import {Helmet} from 'react-helmet';
 
 class Login extends React.Component {
   state = {
@@ -73,51 +80,60 @@ class Login extends React.Component {
     const { email, password } = data;
     const { authMessage, loggedIn,userData} = this.props;
     if (loggedIn) this.props.history.push("/dashboard");
-    console.log("logged",loggedIn);
+    // console.log("logged",loggedIn);
+    console.log("error",errors);
     return (
         
-             <div className="bg-image-login ">
-            <div className=" d-flex h-100 justify-content-center align-items-center">
-            <div className="container">
-            <div className="row">
-                <div className="col-xl-5 col-lg-6 col-md-10 col-sm-12 mx-auto mt-5">
+      <div class="login-page">
+            <div class="mask rgba-stylish-strong h-100 d-flex justify-content-center align-items-center">
+            <div class="container">
+            <div class="row">
+                <div class="col-xl-5 col-lg-6 col-md-10 col-sm-12 mx-auto mt-5">
 
-                <div className="card wow fadeIn" data-wow-delay="0.3s">
-                    <div className="card-body">
+                <div class="card wow fadeIn" data-wow-delay="0.3s">
+                    <div class="card-body">
 
-                    <div className="form-header purple-gradient">
-                        <h3 className="font-weight-500 my-2 py-1"><i className="fas fa-user"></i> Log in</h3>
+                    <div class="form-header purple-gradient">
+                        <h3 class="font-weight-500 my-2 py-1"><i class="fas fa-user"></i> Log in:</h3>
                     </div>
 
-                  
+                    {/* <div class="md-form">
+                        <i class="fas fa-user prefix white-text"></i>
+                        <input
+                         type="text" 
+                         id="orangeForm-name" 
+                         class="form-control"
+                         />
+                        <label for="orangeForm-name">Your name</label>
+                    </div> */}
               <form onSubmit={this.handleSubmit} onClick={this.saveUserDetais(userData,loggedIn)}>
-                    <div className="md-form">
-                        <i className="fas fa-envelope prefix " ></i>
+                    <div class="md-form">
+                        <i class="fas fa-envelope prefix white-text" style={{color:"black"}}></i>
                         <input
                         type="email"
                         name="email"
-                        error={errors["email"]}
                         id="orangeForm-email" 
-                        className="form-control"
+                        class="form-control"
                         onChange={this.handleChange}
                         value={email}
                         autoFocus
                         />
-                        <label htmlFor="orangeForm-email">Your email</label>
+                        <label for="orangeForm-email">Your email</label>
+                        { errors["email"] && <div className="alert alert-danger"> {errors["email"]} </div> }
                     </div>
 
-                    <div className="md-form">
-                        <i className="fas fa-lock prefix "></i>
+                    <div class="md-form">
+                        <i class="fas fa-lock prefix white-text"></i>
                         <input
                         name="password"
                         type="password"
-                        error={errors["password"]}
                         onChange={this.handleChange}
                         value={password}
                         id="orangeForm-pass" 
-                        className="form-control"
+                        class="form-control"
                         />
-                        <label htmlFor="orangeForm-pass">Your password</label>
+                        <label for="orangeForm-pass">Your password</label>
+                        { errors["password"] && <div className="alert alert-danger"> {errors["password"]} </div> }
                     </div>
 
                     {authMessage ? (
@@ -130,20 +146,23 @@ class Login extends React.Component {
                       )}
 
 
-
-                    <div className="text-center">
-                        <button className="btn purple-gradient btn-lg"
-                        onClick={this.handleSubmit}>Login</button>
-                        <div className="inline-ul text-center d-flex justify-content-center">
-                        
-                        
-                        <div className="d-flex flex-row mt-5">
-                       <span className=" text-right  mt-2  text-info">No Account?</span>
-                               <a href="http://localhost:3000/register" 
-                                > <button type="button" className="btn btn-info btn-rounded btn-sm"> Register </button></a>
-                          </div>
-                          
-                       
+                    <div class="text-center">
+                        <button class="btn purple-gradient btn-lg"
+                        onClick={this.handleSubmit}>Log In</button>
+                        <div class="inline-ul text-center d-flex justify-content-center">
+                        {/* <a class="p-2 m-2 fa-lg tw-ic"><i class="fab fa-twitter white-text"></i></a>
+                        <a class="p-2 m-2 fa-lg li-ic"><i class="fab fa-linkedin-in white-text"> </i></a>
+                        <a class="p-2 m-2 fa-lg ins-ic"><i class="fab fa-instagram white-text"> </i></a> */}
+                        <div style = {{
+                          display : "flex",
+                          flexDirection : "column"
+                        }}>
+                          <a href="http://localhost:3000/register" style={{
+                          color:"blue"}}>New User</a>
+                          <div style = {{backgroundColor: "blue",
+                                width: "70px",
+                                height: "1px"}}/>
+                        </div>
                     </div>
                     </div>
                   </form>
@@ -153,10 +172,16 @@ class Login extends React.Component {
                 </div>
             </div>
             </div>
-          
-        </div>
-        
         </div>
+        {/* <Helmet>
+            <meta charSet="utf-8" />
+            <script type="text/javascript" src={"./js/jquery-3.4.1.min.js"} />
+            <script type="text/javascript" src={"./js/popper.min.js"} />
+            <script type="text/javascript" src={"./js/bootstrap.min.js"} />
+            <script type="text/javascript" src={"./js/mdb.min.js"} />
+        </Helmet> */}
+
+    </div>
     );
   }
 }
diff --git a/frontend/src/pages/Register/index.js b/frontend/src/pages/Register/index.js
index 3528e92..8d14e55 100644
--- a/frontend/src/pages/Register/index.js
+++ b/frontend/src/pages/Register/index.js
@@ -14,11 +14,11 @@ class RegisterForm extends React.Component {
       username:"",
       email: "",
       password: "",
-      otp : "",
+      otp :""
     },
     isVerify : false,
     errors: {},
-    passwordError: "",
+    authError: "",
   };
 
   validateProperty = (input) => {
@@ -54,23 +54,19 @@ class RegisterForm extends React.Component {
   };
   handleSubmit = (e) => {
     e.preventDefault();
-      if((this.state.data.username !== "") && 
-        (this.state.data.email !== "") && 
-        (this.state.data.username !== "")){
-            this.setState({isVerify : true});
-      }
+    // console.log(this.props.status);
       this.props.getOTP(this.state.data.email);
     };
 
   handleVerify = (e) =>{
     e.preventDefault();
-    // console.log(this.state.data,"verfiy");
 
     if((this.state.data.username !== "") && 
       (this.state.data.email !== "") && 
       (this.state.data.username !== "") &&
       (this.state.data.otp !== "")){
-        const {username, password, email ,otp} = this.state.data;
+        const {username, password, email} = this.state.data;
+        const {otp} = this.state.data;
         this.props.signUpandVerify({username, email, password ,otp});
       }
   }
@@ -84,19 +80,22 @@ class RegisterForm extends React.Component {
   schema = {
     username: Joi.string().alphanum().min(3).max(30),
     email: Joi.string().email().required().label("Email"),
-    password: Joi.string().min(8).required().label("Password"),
-    otp: Joi.string().min(6).max(6),
+    password: Joi.string().min(5).required().label("Password"),
+    otp: (this.state.isVerify === false) ? "" : Joi.string().min(6).max(6),
   };
 
 
-  saveUserDetais(user,loggedIn){
-    // console.log(user);
+  saveUserDetais(user,loggedIn,authMessage){
+    console.log("hi",authMessage,user);
+    console.log("hi",loggedIn);
 
+    if(authMessage !== '' && authMessage !== undefined){return;}
+    console.log("hiiii",user.userData);
     if(user.userData === undefined){return;}
-
+    
+    
     if(loggedIn){
       localStorage.setItem('loggedIn', true);
-      console.log(user);
       if(localStorage.getItem('loggedIn') === 'true'){  
         localStorage.setItem('name',user.userData._id);
       }
@@ -104,10 +103,13 @@ class RegisterForm extends React.Component {
   }
 
   render() {
+    
+    if(this.props.status === true && this.state.isVerify === false){
+      this.setState({isVerify : true});
+    }
     const { authMessage,userData ,loggedIn } = this.props;
-    // console.log(loggedIn);
-    const { errors, passwordError } = this.state;
-    const { username, email, password, otp} = this.state.data;
+    const { errors, authError } = this.state;
+    const { username, email, password,otp} = this.state.data;
     if (loggedIn) this.props.history.push("/dashboard");
 
     return (
@@ -191,7 +193,7 @@ class RegisterForm extends React.Component {
                             </h4>
     
                           </div>
-                          <form onSubmit={this.handleSubmit} onClick={this.saveUserDetais(userData,loggedIn)}>
+                          <form onSubmit={this.handleSubmit} onClick={this.saveUserDetais(userData,loggedIn,authMessage)}>
 
 
                                 <div class="md-form">
@@ -201,11 +203,11 @@ class RegisterForm extends React.Component {
                                     name="username"
                                      id="orangeForm-name" 
                                     class="form-control"
-                                    error={errors["username"]}
                                     onChange={this.handleChange}
                                     value = {username}
                                     />
                                     <label for="orangeForm-name">Your name</label>
+                                    { errors["username"] && <div className="alert alert-danger"> {errors["username"]} </div> }
                                 </div>
                                 <div class="md-form">
                                     <i class="fas fa-envelope prefix"></i>
@@ -214,11 +216,11 @@ class RegisterForm extends React.Component {
                                     id="orangeForm-email" 
                                     class="form-control"
                                     type="email"
-                                    error={errors["email"]}
                                     onChange={this.handleChange}
                                     value = {email}
                                     />
                                     <label for="orangeForm-email">Your email</label>
+                                    { errors["email"] && <div className="alert alert-danger"> {errors["email"]} </div> }
                                 </div>
             
                                 <div class="md-form">
@@ -228,12 +230,12 @@ class RegisterForm extends React.Component {
                                     id="orangeForm-pass" 
                                     class="form-control"
                                     type="password"
-                                    error={errors["password"]}
                                     onChange={this.handleChange}
                                     // label="password"
                                     value = {password}
                                     />
                                     <label for="orangeForm-pass">Your password</label>
+                                    { errors["password"] && <div className="alert alert-danger"> {errors["password"]} </div> }
                                 </div>
 
                                 {
@@ -245,7 +247,6 @@ class RegisterForm extends React.Component {
                                         name="otp"
                                         id="orangeForm-otp" 
                                         class="form-control"
-                                        error={errors["otp"]}
                                         onChange={this.handleChange}
                                         value = {otp}
                                         />
@@ -256,10 +257,10 @@ class RegisterForm extends React.Component {
                                 }
 
 
-                                {authMessage || passwordError ? (
+                                {authMessage? (
                                 <p className="bg-info text-white">
                                 {" "}
-                                {authMessage} {passwordError}
+                                {authMessage}
                                 </p>
                                 ) : (
                                 <> </>
@@ -286,6 +287,7 @@ class RegisterForm extends React.Component {
                                   <div class="text-center"> 
                                   <button class="btn btn-indigo btn-rounded mt-5"                 
                                   type="button"
+                                  disabled = {this.validate()}
                                   onClick={this.handleSubmit}
                                   >Sign up</button>
                                   </div>
@@ -317,14 +319,6 @@ class RegisterForm extends React.Component {
             </div>
           </div>
           </div>
-          {/* <Helmet>
-              <meta charSet="utf-8" />
-              <script type="text/javascript" src={"./js/jquery-3.4.1.min.js"} />
-              <script type="text/javascript" src={"./js/popper.min.js"} />
-              <script type="text/javascript" src={"./js/bootstrap.min.js"} />
-              <script type="text/javascript" src={"./js/mdb.min.js"} />
-          </Helmet> */}
-      
       </div>
      
     );
@@ -335,6 +329,7 @@ const mapStateToProps = (state) => {
     userData: state.auth.userData,
     loggedIn: state.auth.loggedIn,
     authMessage: state.auth.authMessage,
+    status: state.auth.status
   };
 };
 const mapDispatchToProps = (dispatch) => {
diff --git a/frontend/src/reducers/authReducer.js b/frontend/src/reducers/authReducer.js
index bd0c114..97a1e4d 100644
--- a/frontend/src/reducers/authReducer.js
+++ b/frontend/src/reducers/authReducer.js
@@ -1,110 +1,109 @@
 import {
-    LOGIN_SUCCESS,
-    LOGIN_ERROR,
-    SIGNOUT,
-    SIGNUP_ERROR,
-    SIGNUP_SUCCESS,
-    GET_OTP_SUCCESS,
-    GET_OTP_ERROR,
-    GET_USER_DETAIL_SUCCESS,
-    GET_USER_DETAIL_ERROR,
-    PROFILE_UPDATE_SUCCESS,
-    PROFILE_UPDATE_ERROR,
-    UPLOAD_USER_IMAGE_SUCCESS,
-    UPLOAD_USER_IMAGE_ERROR
-  } from "../actions/actionTypes";
-  
-  const initState = {
-    loggedIn: (localStorage.getItem('loggedIn')==='true') || false,
-    userData: {},
-    authMessage: null,
-    // signin_status : false,
-    // login_status : false
-  };
-  
-  export default function (state = initState, action) {
-    switch (action.type) {
-      case LOGIN_SUCCESS:
-        return {
-          ...state,
-          loggedIn: action.payload.status,
-          userData: action.payload.userData,
-          authMessage: action.payload.msg,
-        };
-      case LOGIN_ERROR:
-        return {
-          ...state,
-          authMessage: action.error,
-        };
-      case SIGNUP_SUCCESS:
-        return {
-          ...state,
-          loggedIn: action.payload.verified,
-          userData: action.payload,
-          authMessage: action.payload.msg,
-        };
-  
-      case SIGNUP_ERROR:
-        return {
-          ...state,
-          authMessage: action.error.response.data.error,
-        };
-  
-      case SIGNOUT:
-        return {
-          ...state,
-          userData: {},
-          loggedIn: false,
-          authMessage: null,
-        };
+  LOGIN_SUCCESS,
+  LOGIN_ERROR,
+  SIGNOUT,
+  SIGNUP_ERROR,
+  SIGNUP_SUCCESS,
+  GET_OTP_SUCCESS,
+  GET_OTP_ERROR,
+  GET_USER_DETAIL_SUCCESS,
+  GET_USER_DETAIL_ERROR,
+  PROFILE_UPDATE_SUCCESS,
+  PROFILE_UPDATE_ERROR,
+  UPLOAD_USER_IMAGE_SUCCESS,
+  UPLOAD_USER_IMAGE_ERROR
+} from "../actions/actionTypes";
 
-        case GET_OTP_SUCCESS:
-        return {
-          authMessage: action.payload.msg,
-        };
+const initState = {
+  loggedIn: (localStorage.getItem('loggedIn')==='true') || false,
+  userData: {},
+  authMessage: null,
+  status : false
+};
 
-        case GET_OTP_ERROR:
-        return {
-          authMessage: action.error,
-        };
+export default function (state = initState, action) {
+  switch (action.type) {
+    case LOGIN_SUCCESS:
+      return {
+        ...state,
+        loggedIn: action.payload.status,
+        userData: action.payload.userData,
+        authMessage: action.payload.msg,
+      };
+    case LOGIN_ERROR:
+      return {
+        ...state,
+        authMessage: action.error,
+      };
+    case SIGNUP_SUCCESS:
+      return {
+        ...state,
+        loggedIn: action.payload.verified,
+        userData: action.payload,
+        authMessage: action.payload.msg,
+      };
 
-        case GET_USER_DETAIL_SUCCESS:
-        return {
-          ...state,
-          userData: action.payload,
-        };
-      case GET_USER_DETAIL_ERROR:
-        return {
-          ...state,
-          authMessage: action.error,
-        };
+    case SIGNUP_ERROR:
+      return {
+        ...state,
+        authMessage: action.error.response.data.error,
+      };
 
-        case PROFILE_UPDATE_SUCCESS:
-        return {
-          ...state,
-          authMessage: action.payload.msg,
-        };
-  
-      case PROFILE_UPDATE_ERROR:
-        return {
-          ...state,
-          authMessage: action.error.response.data.error,
-        };
+    case SIGNOUT:
+      return {
+        ...state,
+        userData: {},
+        loggedIn: false,
+        authMessage: null,
+      };
 
-      case UPLOAD_USER_IMAGE_SUCCESS:
-        return {
-          ...state,
-          userData: action.payload,
-          authMessage: action.payload.msg,
-        };
-      case UPLOAD_USER_IMAGE_ERROR:
-        return {
-          ...state,
-          authMessage: action.error,
-        };
+      case GET_OTP_SUCCESS:
+      return {
+        authMessage: action.payload.msg,
+        status : action.payload.status
+      };
 
-      default:
-        return state;
-    }
+      case GET_OTP_ERROR:
+      return {
+        authMessage: action.error,
+      };
+
+      case GET_USER_DETAIL_SUCCESS:
+      return {
+        ...state,
+        userData: action.payload,
+      };
+    case GET_USER_DETAIL_ERROR:
+      return {
+        ...state,
+        authMessage: action.error,
+      };
+
+      case PROFILE_UPDATE_SUCCESS:
+      return {
+        ...state,
+        authMessage: action.payload.msg,
+      };
+
+    case PROFILE_UPDATE_ERROR:
+      return {
+        ...state,
+        authMessage: action.error.response.data.error,
+      };
+
+    case UPLOAD_USER_IMAGE_SUCCESS:
+      return {
+        ...state,
+        userData: action.payload,
+        authMessage: action.payload.msg,
+      };
+    case UPLOAD_USER_IMAGE_ERROR:
+      return {
+        ...state,
+        authMessage: action.error,
+      };
+
+    default:
+      return state;
   }
-  
\ No newline at end of file
+}