From b9bf115dab25a1bf5937e5a9c35c4ef7233738a8 Mon Sep 17 00:00:00 2001 From: Igor Chacon Date: Thu, 4 Mar 2021 12:00:34 -0300 Subject: [PATCH 1/3] =?UTF-8?q?feita=20p=C3=A1gina=20login?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/Pages/LoginPage/LoginPage.js | 85 ++++++++----- epps-labe-food7/src/Pages/LoginPage/style.js | 115 +++++++++++++++--- 2 files changed, 153 insertions(+), 47 deletions(-) diff --git a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js index 89378fe..6955c11 100644 --- a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js +++ b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js @@ -1,8 +1,8 @@ import React, { useState } from 'react'; import axios from 'axios'; import { useHistory } from 'react-router-dom'; -import { goToSignUp, goToProfile } from '../../Routes/Coordinator.js'; -import { Rectangle, LoginCard, LoginPageStyle } from './style'; +import { goToHome, goToProfile } from '../../Routes/Coordinator.js'; +import { Input, Label, Form, Header, ContainerContent, Button, ContainerInput } from './style'; const LoginPage = () => { @@ -34,12 +34,11 @@ const LoginPage = () => { body ) .then ((res) => { - console.log(res.data) localStorage.setItem("token", res.data.token); setToken(localStorage.getItem("token")) console.log(`hasAdress: ${res.data.user.hasAddress}`) - if (res.data.user.hasAddress) { - goToSignUp(history); + if (!res.data.user.hasAddress) { + goToHome(history); } else { goToProfile(history); } @@ -51,36 +50,56 @@ const LoginPage = () => { } return ( - <> - - - - - - - -
Entrar
-
- -
-
- -
+ +
+ +
+
+ + + + + + - - - - + + + +
+ + + ) } -export default LoginPage \ No newline at end of file +export default LoginPage + +{/*
Entrar
+ + + + +
+ Ainda não tem cadastro? + goToSignUp(history)}>Clique aqui */} \ No newline at end of file diff --git a/epps-labe-food7/src/Pages/LoginPage/style.js b/epps-labe-food7/src/Pages/LoginPage/style.js index 04d4906..bf9f040 100644 --- a/epps-labe-food7/src/Pages/LoginPage/style.js +++ b/epps-labe-food7/src/Pages/LoginPage/style.js @@ -1,20 +1,107 @@ import styled from 'styled-components'; -export const LoginPageStyle = styled.div ` - display: grid; - grid-template-columns: 1fr 2fr; - grid-template-rows: 1fr; -` +export const ContainerContent = styled.div` + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; + max-width: 100vw; + max-height: 100vh; + ` + +export const Form = styled.div` + display: flex; + justify-content: center; + flex-direction: column; + ` +export const Input = styled.input` + ::-webkit-input-placeholder { + color: #b8b8b8; + } + margin-left: 13px; + border: none; + width: 73.4vw; + height: 18px; + font-family: Roboto; + font-size: 16px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: normal; + letter-spacing: -0.19px; + &:focus, input:focus, select:focus { + box-shadow: 0 0 0 0; + border: 0 none; + outline: 0; +} + ` +export const Button = styled.button` +margin: 8px 16px 20px; + width: 91.1vw; + height: 6.5vh; + font-family: Roboto; + font-size: 16px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: normal; + letter-spacing: -0.39px; + text-align: center; + color: #000000; + background-color: #5cb646; + border: none; + border-radius: 2px; + ` -export const LoginCard = styled.div` - background-color: #fff; - text-align: center; - padding: 200px 0 0 70px; +export const Label = styled.label` +position: relative; +width: 21.6vw; + height: 2.8vh; + background-color: #fff; + margin: 3px 4px 3px 16px; + font-family: Roboto; + font-size: 12px; + font-weight: normal; + font-stretch: normal; + font-style: normal; + line-height: normal; + letter-spacing: -0.29px; + border: 2px solid #FFF; + color: ${(props) => { + if (props.erro === false) { + return "#e02020" + } else { + return "#b8b8b8" + + } + }}; ` +export const ContainerInput = styled.div` + display: flex; + justify-content: center; + flex-direction: column; + border-radius: 4px; + width: 91.1vw; + height: 8.7vh; + margin: 7.5px 16px; + border: ${(props) => { + if (props.erro === false) { + return "1px solid #e02020" + } else { + return "1px solid #b8b8b8" -export const Rectangle = styled.div ` - height: 640px; - padding: 288px 0 0 117px; - background-color: #000000; - color: white; + } + }}; +` +export const Header = styled.div` + width: 93vw; + min-height: 6.4vh; + margin: 0 0 24px; + padding: 0 0 0 20px; + -webkit-backdrop-filter: blur(10px); + backdrop-filter: blur(10px); + box-shadow: 0 0.5px 0 0 black-25; + border-bottom: 1px solid rgba(0, 0, 0, 0.25); + display: flex; + align-items: center; ` \ No newline at end of file From 41fa12a3ecd71e94b54a6711468e91f66449fdc5 Mon Sep 17 00:00:00 2001 From: Igor Chacon Date: Thu, 4 Mar 2021 16:21:45 -0300 Subject: [PATCH 2/3] =?UTF-8?q?corrigindo=20erros=20da=20p=C3=A1gina=20de?= =?UTF-8?q?=20login?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- epps-labe-food7/src/Pages/LoginPage/LoginPage.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js index 6955c11..5a5245e 100644 --- a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js +++ b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js @@ -55,7 +55,7 @@ const LoginPage = () => {
- + { onChange={handleEmail} /> - + - Date: Thu, 4 Mar 2021 19:55:35 -0300 Subject: [PATCH 3/3] =?UTF-8?q?corrigindo=20erros=20da=20p=C3=A1gina=20de?= =?UTF-8?q?=20login?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- epps-labe-food7/src/Pages/LoginPage/LoginPage.js | 1 - 1 file changed, 1 deletion(-) diff --git a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js index f7b1a59..426ab82 100644 --- a/epps-labe-food7/src/Pages/LoginPage/LoginPage.js +++ b/epps-labe-food7/src/Pages/LoginPage/LoginPage.js @@ -32,7 +32,6 @@ const LoginPage = () => { body ) .then ((res) => { -<<<<<<< HEAD localStorage.setItem("token", res.data.token); setToken(localStorage.getItem("token")) console.log(`hasAdress: ${res.data.user.hasAddress}`)