refactoring the sign up page and added a sign up page
This commit is contained in:
parent
b2d75f37f8
commit
c28b9b1132
Binary file not shown.
Binary file not shown.
@ -1,7 +1,7 @@
|
|||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import reactLogo from './assets/react.svg'
|
import reactLogo from './assets/react.svg'
|
||||||
import viteLogo from '/vite.svg'
|
import viteLogo from '/vite.svg'
|
||||||
import SignUp from './components/login-logout/signup'
|
import SignInUp from './components/login-logout/signInup'
|
||||||
import './App.css'
|
import './App.css'
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
@ -9,7 +9,7 @@ function App() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='containment'>
|
<div className='containment'>
|
||||||
<SignUp />
|
<SignInUp />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,20 @@
|
|||||||
|
export default function LogIn() {
|
||||||
|
return (
|
||||||
|
<div className="LHS">
|
||||||
|
<h2>Log In</h2>
|
||||||
|
<form>
|
||||||
|
<div className="form-elements">
|
||||||
|
<div>
|
||||||
|
<label>user name</label>
|
||||||
|
<input name="user_name" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>password</label>
|
||||||
|
<input name="password" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button>Log In</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,51 @@
|
|||||||
|
import CezenBanner from "./cezenBanar";
|
||||||
|
import SignUp from "./signUp";
|
||||||
|
import LogIn from "./logIn";
|
||||||
|
import "./form_styling.css";
|
||||||
|
// admin signup
|
||||||
|
|
||||||
|
export default function SignInUp() {
|
||||||
|
// user signup
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="intro-page">
|
||||||
|
<div className="cezen-logo">
|
||||||
|
<CezenBanner />
|
||||||
|
</div>
|
||||||
|
<section>
|
||||||
|
<div className="LHS">
|
||||||
|
<SignUp />
|
||||||
|
<LogIn />
|
||||||
|
</div>
|
||||||
|
<div className="RHS">
|
||||||
|
<h1>Description</h1>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||||
|
Temporibus quos alias placeat incidunt debitis obcaecati, eos
|
||||||
|
pariatur vero iure corrupti provident accusantium? Accusantium
|
||||||
|
facere laborum mollitia? Quos vero consectetur similique.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||||
|
Temporibus quos alias placeat incidunt debitis obcaecati, eos
|
||||||
|
pariatur vero iure corrupti provident accusantium? Accusantium
|
||||||
|
facere laborum mollitia? Quos vero consectetur similique.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||||
|
Temporibus quos alias placeat incidunt debitis obcaecati, eos
|
||||||
|
pariatur vero iure corrupti provident accusantium? Accusantium
|
||||||
|
facere laborum mollitia? Quos vero consectetur similique.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||||
|
Temporibus quos alias placeat incidunt debitis obcaecati, eos
|
||||||
|
pariatur vero iure corrupti provident accusantium? Accusantium
|
||||||
|
facere laborum mollitia? Quos vero consectetur similique.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
export default function SignUp() {
|
||||||
|
return (
|
||||||
|
<div className="LHS">
|
||||||
|
<h2>Sign Up</h2>
|
||||||
|
<form>
|
||||||
|
<div className="form-elements">
|
||||||
|
<div>
|
||||||
|
<label>user name</label>
|
||||||
|
<input name="user_name" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>email</label>
|
||||||
|
<input name="email" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>password</label>
|
||||||
|
<input name="password" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>confirm password</label>
|
||||||
|
<input name="confirm_password" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button>Sign Up</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,50 +0,0 @@
|
|||||||
import CezenBanner from "./cezenBanar"
|
|
||||||
import "./form_styling.css"
|
|
||||||
// admin signup
|
|
||||||
|
|
||||||
export default function SignUp(){
|
|
||||||
|
|
||||||
// user signup
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="intro-page">
|
|
||||||
<div className="cezen-logo">
|
|
||||||
<CezenBanner />
|
|
||||||
</div>
|
|
||||||
<section>
|
|
||||||
<div className="LHS">
|
|
||||||
<h2>Signup</h2>
|
|
||||||
<form>
|
|
||||||
<div className="form-elements">
|
|
||||||
<div>
|
|
||||||
<label>user name</label>
|
|
||||||
<input name="user_name" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label>email</label>
|
|
||||||
<input name="email" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label>password</label>
|
|
||||||
<input name="password" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label>confirm password</label>
|
|
||||||
<input name="confirm_password" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button>Sign Up</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div className="RHS">
|
|
||||||
<h1>Description</h1>
|
|
||||||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus quos alias placeat incidunt debitis obcaecati, eos pariatur vero iure corrupti provident accusantium? Accusantium facere laborum mollitia? Quos vero consectetur similique.</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus quos alias placeat incidunt debitis obcaecati, eos pariatur vero iure corrupti provident accusantium? Accusantium facere laborum mollitia? Quos vero consectetur similique.</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus quos alias placeat incidunt debitis obcaecati, eos pariatur vero iure corrupti provident accusantium? Accusantium facere laborum mollitia? Quos vero consectetur similique.</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus quos alias placeat incidunt debitis obcaecati, eos pariatur vero iure corrupti provident accusantium? Accusantium facere laborum mollitia? Quos vero consectetur similique.</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue
Block a user