From 5c753e4ab0349d370d566264f89a48fe7d3aac9e Mon Sep 17 00:00:00 2001
From: ilyaszm <zmr.ilyas@gmail.com>
Date: Wed, 24 Jul 2019 16:46:09 +0100
Subject: [PATCH] Adding a Form to reset password in forgetPassword page

---
 src/App.css                                |  4 ++++
 src/components/pages/ForgetPasswordPage.js | 21 +++++++++++++++++++--
 src/components/pages/LoginPage.js          | 10 +++-------
 src/components/pages/RegisterPage.js       |  2 +-
 4 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/App.css b/src/App.css
index 9f93fa7..179d0b3 100644
--- a/src/App.css
+++ b/src/App.css
@@ -134,4 +134,8 @@ footer p {
 
 form span {
     font-size: .8rem
+}
+
+#reset_pass_lbl {
+    float: left
 }
\ No newline at end of file
diff --git a/src/components/pages/ForgetPasswordPage.js b/src/components/pages/ForgetPasswordPage.js
index ab1100d..5757940 100644
--- a/src/components/pages/ForgetPasswordPage.js
+++ b/src/components/pages/ForgetPasswordPage.js
@@ -1,9 +1,26 @@
 import React from 'react'
+import { Link } from 'react-router-dom'
+
+import '../../App.css'
 
 export default function ForgetPasswordPage() {
     return (
-        <div>
-            <h1>Forget Password Page</h1>
+        <div className="text-center m-5-auto">
+            <h2>Reset your password</h2>
+            <h5>Enter your email address and we will send you a new password</h5>
+            <form action="/login">
+                <p>
+                    <label id="reset_pass_lbl">Email address</label><br/>
+                    <input type="email" name="email" required />
+                </p>
+                <p>
+                    <button id="sub_btn" type="submit">Send password reset email</button>
+                </p>
+            </form>
+            <footer>
+                <p>First time? <Link to="/register">Create an account</Link>.</p>
+                <p><Link to="/">Back to Homepage</Link>.</p>
+            </footer>
         </div>
     )
 }
diff --git a/src/components/pages/LoginPage.js b/src/components/pages/LoginPage.js
index 0dd19d9..cf6b011 100644
--- a/src/components/pages/LoginPage.js
+++ b/src/components/pages/LoginPage.js
@@ -3,10 +3,6 @@ import { Link } from 'react-router-dom'
 
 import '../../App.css'
 
-const handleClick = () => {
-    alert('Login Successfully')
-}
-
 export default function SignInPage() {
     return (
         <div className="text-center m-5-auto">
@@ -14,16 +10,16 @@ export default function SignInPage() {
             <form action="/home">
                 <p>
                     <label>Username or email address</label><br/>
-                    <input type="text" name="first_name"/>
+                    <input type="text" name="first_name" required />
                 </p>
                 <p>
                     <label>Password</label>
                     <Link to="/forget-password"><label className="right-label">Forget password?</label></Link>
                     <br/>
-                    <input type="password" name="password"/>
+                    <input type="password" name="password" required />
                 </p>
                 <p>
-                    <button id="sub_btn" onClick={handleClick} type="submit">Login</button>
+                    <button id="sub_btn" type="submit">Login</button>
                 </p>
             </form>
             <footer>
diff --git a/src/components/pages/RegisterPage.js b/src/components/pages/RegisterPage.js
index a46e3e4..efe2010 100644
--- a/src/components/pages/RegisterPage.js
+++ b/src/components/pages/RegisterPage.js
@@ -8,7 +8,7 @@ export default function SignUpPage() {
     return (
         <div className="text-center m-5-auto">
             <h2>Join us</h2>
-            <h3>Create your personal account</h3>
+            <h5>Create your personal account</h5>
             <form action="/home">
                 <p>
                     <label>Username</label><br/>