Showing
1 changed file
with
53 additions
and
0 deletions
front/src/Routes/Auth.js
0 → 100644
1 | +import React, { useState } from "react"; | ||
2 | +import styled from "styled-components"; | ||
3 | +import Input from "../Components/Input"; | ||
4 | +import Button from "../Components/Button"; | ||
5 | + | ||
6 | +const Wrapper = styled.div``; | ||
7 | + | ||
8 | +const Box = styled.div``; | ||
9 | + | ||
10 | +const StateChanger = styled(Box)``; | ||
11 | + | ||
12 | +const Link = styled.span``; | ||
13 | + | ||
14 | +const Form = styled(Box)``; | ||
15 | + | ||
16 | +export default () => { | ||
17 | + const [action, setAction] = useState("logIn"); | ||
18 | + | ||
19 | + return ( | ||
20 | + <Wrapper> | ||
21 | + <Form> | ||
22 | + {action === "logIn" ? ( | ||
23 | + <form> | ||
24 | + <Input placeholder={"Email"} type="email" /> | ||
25 | + <Input placeholder={"Password"} type="password" /> | ||
26 | + <Button text={"Log In"} /> | ||
27 | + </form> | ||
28 | + ) : ( | ||
29 | + <form> | ||
30 | + <Input placeholder={"Email"} type="email" /> | ||
31 | + <Input placeholder={"Password"} type="password" /> | ||
32 | + <Input placeholder={"Password for validation"} type="password" /> | ||
33 | + <Input placeholder={"UserName"} /> | ||
34 | + <Button text={"Sign Up"} /> | ||
35 | + </form> | ||
36 | + )} | ||
37 | + </Form> | ||
38 | + <StateChanger> | ||
39 | + {action === "logIn" ? ( | ||
40 | + <> | ||
41 | + Don't you have an account ? | ||
42 | + <Link onClick={() => setAction("signUp")}> </Link> | ||
43 | + </> | ||
44 | + ) : ( | ||
45 | + <> | ||
46 | + Did you have an account ? | ||
47 | + <Link onClick={() => setAction("logIn")}> </Link> | ||
48 | + </> | ||
49 | + )} | ||
50 | + </StateChanger> | ||
51 | + </Wrapper> | ||
52 | + ); | ||
53 | +}; |
-
Please register or login to post a comment