Adding a Form to reset password in forgetPassword page

src/App.css

@@ -134,4 +134,8 @@ footer p {
 
 form span {
     font-size: .8rem
+}
+
+#reset_pass_lbl {
+    float: left
 }

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>
     )
 }

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>

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/>