-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
28 lines (26 loc) · 1.52 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import logo from './logo.svg';
function App() {
return (
<section className="App h-screen w-full flex justify-center items-center bg-green-500">
<div className="w-full max-w-md bg-gray-800" >
<div className="p-2 w-full max-w-md bg-blue-dark flex justify-center">
<img className="w-42" src={logo} alt="React Logo" />
</div>
<form action="" className="bg-white shadow-md rounded px-8 py-8 pt-8">
<div className="px-4 pb-4">
<label htmlFor="email" className="text-sm block font-bold pb-2">EMAIL ADDRESS</label>
<input type="email" name="email" id="" className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline border-blue-300 " placeholder="Johnbull@example.com" />
</div>
<div className="px-4 pb-4">
<label htmlFor="password" className="text-sm block font-bold pb-2">PASSWORD</label>
<input type="password" name="email" id="" className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline border-blue-300" placeholder="Enter your password" />
</div>
<div className="mt-6 justify-center items-center flex">
<button className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" type="button">Sign In</button>
</div>
</form>
</div>
</section>
);
}
export default App;