wokapp-ui/src/routes/LoginPage.tsx
2024-12-17 01:45:25 +04:00

42 lines
No EOL
1.4 KiB
TypeScript

import Input from "../components/UI/Input.tsx";
import Button from "../components/UI/Button.tsx";
import {useState} from "react";
export function LoginPage() {
const [login,setLogin] = useState('');
const [password, setPassword] = useState('');
return <>
<div className={"flex flex-col items-center mb-4 pt-4"}>
<div className={"lg:w-80 sm:w-3/4"}>
<h1 className={"text-3xl text-center"}>Login</h1>
<p className={"text-gray-400"}>
Before use this app you need to have account
</p>
</div>
</div>
<div className={"flex flex-col items-center"}>
<div className={"lg:w-80 sm:w-3/4"}>
<Input type="text"
label="Login"
placeholder="Enter your login"
value={login}
name={"login"}
onChange={(e) => setLogin(e.target.value) }
error={false} />
<Input type={"password"}
label={"Password"}
value={password}
placeholder={"Enter your password"}
error={false}
name={"password"}
onChange={(e)=>setPassword(e.target.value) } />
<Button className={"w-full mt-8"} onClick={() => {}}>Login</Button>
<p className={"text-center"}>- or -</p>
<Button className={"w-full bg-gray-500"} onClick={() => {}}>Create account</Button>
</div>
</div>
</>
}