From 6b1f07502fc849e62402229ce93d97fd90c835b3 Mon Sep 17 00:00:00 2001
From: "Rayyan (Rayy)" <rayyan.hodges@studytafensw.edu.au>
Date: Tue, 5 Sep 2023 11:07:20 +0000
Subject: [PATCH] Create signup page with username box.

---
 src/App.js          |  6 ++++--
 src/pages/Signup.js | 20 +++++++++++++++++++-
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/App.js b/src/App.js
index 6bece4a..70e84c2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -8,6 +8,7 @@ import './App.css'
 import { About } from "./pages/About"
 import { Home } from "./pages/Home"
 import { Contact } from "./pages/Contact"
+import { Signup } from "./pages/Signup"
 
 
 function App() {
@@ -21,7 +22,7 @@ function App() {
     { label: "Log in", link: "/signin" },
   ]
 // navigation for authenticated user
-const AuthNavItems = [
+const AuthnavItems = [
     { label: "Home", link: "/" },
     { label: "About", link: "/about" },
     { label: "Contact", link: "/contact" },
@@ -29,7 +30,7 @@ const AuthNavItems = [
 ] 
 
 /// application states
-const [nav, setNav ] = useState( AuthNavItems )
+const [nav, setNav ] = useState( navItems )
 
 
   const saySomething = ( word ) => {
@@ -42,6 +43,7 @@ const [nav, setNav ] = useState( AuthNavItems )
         <Route path="/" element={ <Home greeting="Hey you're at home!" /> } />
         <Route path="/about" element={ <About greeting="Hey you, this is about page!" handler={saySomething} /> } />
         <Route path="/contact" element={ <Contact greeting="Hey you, this is contact page!" /> } />
+        <Route path="/signup" element={ <Signup/> } />
       </Routes>
     </div>
   );
diff --git a/src/pages/Signup.js b/src/pages/Signup.js
index 0a44a4b..55e45a8 100644
--- a/src/pages/Signup.js
+++ b/src/pages/Signup.js
@@ -1,4 +1,22 @@
 import Form from 'react-bootstrap/Form';
+import Container from 'react-bootstrap/Container';
+import Row from 'react-bootstrap/Row';
+import Col from 'react-bootstrap/Col';
+
 export function Signup ( props ) {
-    return ( <h1>Signup</h1>)
+    return (
+       
+       <Container>
+        <Row>
+            <Col>
+           <Form>
+                <Form.Group>
+                    <Form.Label>Username</Form.Label>
+                    <Form.Control name="text" placeholder='username'/>
+                    </Form.Group>
+                </Form>
+                </Col>
+                </Row>
+       </Container>
+    )
 }
\ No newline at end of file