cerc-io/keycloak-reg-ui
16
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

First draft

Browse Source
This commit is contained in:
Thomas E Lackey 2023-08-14 23:17:14 -05:00
parent b0d694df88
commit c9ee91c5a8
4 changed files with 11750 additions and 7652 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19323
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

10
src/App.js
View File

@ -14,11 +14,11 @@ export default function App() {
<Router>
<div>
<Switch>
<Route exact path="/" component={ LandingPage } />
<Route path="/login" component={ LoginPage } />
<Route exact path="/" component={ RegisterPage } />
{/*<Route path="/login" component={ LoginPage } />*/}
<Route path="/register" component={ RegisterPage } />
<Route path="/forget-password" component={ ForgetPasswordPage } />
<Route path="/home" component={ HomePage } />
{/*<Route path="/forget-password" component={ ForgetPasswordPage } />*/}
{/*<Route path="/home" component={ HomePage } />*/}
</Switch>
<Footer />
</div>
@ -28,7 +28,7 @@ export default function App() {
const Footer = () => {
return (
<p className="text-center" style={ FooterStyle }>Designed & coded by <a href="https://izemspot.netlify.com" target="_blank" rel="noopener noreferrer">IZEMSPOT</a></p>
<p className="text-center" style={ FooterStyle }><a href="https://www.cerc.io/" target="_blank" rel="noopener noreferrer">cerc.io</a></p>
)
}

12
src/components/pages/LandingPage.js
View File

@ -7,14 +7,14 @@ import BackgroundImage from '../../assets/images/bg.png'
export default function LandingPage() {
return (
<header style={ HeaderStyle }>
<h1 className="main-title text-center">login / register page</h1>
<p className="main-para text-center">join us now and don't waste time</p>
<h1 className="main-title text-center">User Registraton</h1>
{/*<p className="main-para text-center">join us now and don't waste time</p>*/}
<div className="buttons text-center">
<Link to="/login">
<button className="primary-button">log in</button>
</Link>
{/*<Link to="/login">*/}
{/* <button className="primary-button">log in</button>*/}
{/*</Link>*/}
<Link to="/register">
<button className="primary-button" id="reg_btn"><span>register </span></button>
<button className="primary-button" id="reg_btn"><span>Register</span></button>
</Link>
</div>
</header>

57
src/components/pages/RegisterPage.js
View File

@ -1,37 +1,68 @@
import React from 'react'
import { Link } from 'react-router-dom'
import { useState } from "react";
import '../../App.css'
export default function SignUpPage() {
const [username, setUsername] = useState("");
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
let handleSubmit = async (e) => {
e.preventDefault();
try {
let res = await fetch("/register", {
method: "POST",
body: JSON.stringify({
username: username,
email: email,
}),
});
let resJson = await res.json();
if (res.status === 200) {
setMessage("User created successfully");
} else {
setMessage("Some error occured");
}
} catch (err) {
setMessage("Some error occured");
}
};
return (
<div className="text-center m-5-auto">
<h2>Join us</h2>
<h5>Create your personal account</h5>
<form action="/home">
{/*<h5>Create your personal account</h5>*/}
<form onSubmit={handleSubmit} action="">
<p>
<label>Username</label><br/>
<input type="text" name="first_name" required />
<input type="text" name="username"
onChange={(e) => setUsername(e.target.value)}
required />
</p>
<p>
<label>Email address</label><br/>
<input type="email" name="email" required />
<input type="email" name="email"
onChange={(e) => setEmail(e.target.value)}
required />
</p>
{/*<p>*/}
{/* <label>Password</label><br/>*/}
{/* <input type="password" name="password" requiredc />*/}
{/*</p>*/}
<p>
<label>Password</label><br/>
<input type="password" name="password" requiredc />
</p>
<p>
<input type="checkbox" name="checkbox" id="checkbox" required /> <span>I agree all statements in <a href="https://google.com" target="_blank" rel="noopener noreferrer">terms of service</a></span>.
<input type="checkbox" name="checkbox" id="checkbox" required /> <span>I agree all statements in <a href="https://cerc.io" target="_blank" rel="noopener noreferrer">terms of service</a></span>.
</p>
<p>
<button id="sub_btn" type="submit">Register</button>
</p>
</form>
<footer>
<p><Link to="/">Back to Homepage</Link>.</p>
</footer>
<div className="message">{message ? <p>{message}</p> : null}</div>
{/*<footer>*/}
{/* <p><Link to="/">Back to Homepage</Link>.</p>*/}
{/*</footer>*/}
</div>
)