From c4a18eebfddf9b6cd54ee6c4e79e9bd76b7c1c18 Mon Sep 17 00:00:00 2001 From: Renato Di Giacomo Date: Wed, 20 Jul 2022 12:23:38 -0300 Subject: [PATCH] Revert "Layout/login" --- .../Base/Form/Input/InputComponent.jsx | 15 ---- .../MainContainer/MainContainer.style.jsx | 29 ------- .../components/Menu/MenuComponent.style.jsx | 82 ------------------- .../components/PageTitle/PageTitle.style.jsx | 69 ---------------- .../components/PageTitle/UserBtn/UserBtn.jsx | 46 ----------- .../src/components/UserModal/UserModal.jsx | 56 ------------- .../components/UserModal/UserModal.style.jsx | 34 -------- 7 files changed, 331 deletions(-) delete mode 100644 frontend/src/components/Base/Form/Input/InputComponent.jsx delete mode 100644 frontend/src/components/Base/MainContainer/MainContainer.style.jsx delete mode 100644 frontend/src/components/Menu/MenuComponent.style.jsx delete mode 100644 frontend/src/components/PageTitle/PageTitle.style.jsx delete mode 100644 frontend/src/components/PageTitle/UserBtn/UserBtn.jsx delete mode 100644 frontend/src/components/UserModal/UserModal.jsx delete mode 100644 frontend/src/components/UserModal/UserModal.style.jsx diff --git a/frontend/src/components/Base/Form/Input/InputComponent.jsx b/frontend/src/components/Base/Form/Input/InputComponent.jsx deleted file mode 100644 index c47e53a..0000000 --- a/frontend/src/components/Base/Form/Input/InputComponent.jsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import LabelComponent from "../Label/LabelComponent"; -import { InputComponentStyled, InputContainerStyled } from "./InputComponent.style"; - -const InputComponent = ({ type, id, label, value, ...props }) => { - return ( - - - - - ); -}; - -export default InputComponent; - diff --git a/frontend/src/components/Base/MainContainer/MainContainer.style.jsx b/frontend/src/components/Base/MainContainer/MainContainer.style.jsx deleted file mode 100644 index a288e71..0000000 --- a/frontend/src/components/Base/MainContainer/MainContainer.style.jsx +++ /dev/null @@ -1,29 +0,0 @@ -import styled from "styled-components"; - -const MainContainerStyled = styled.main` - padding-left: 97px; - padding-top: 26px; - margin-right: 16px; - position: relative; - display: flex; - flex-direction: column; - align-items: flex-end; - height: 96vh; - @media only screen and (max-height: 790px) { - padding-top: 12px; - } -`; -const TitleContainerStyled = styled.div` - width: 100%; -`; -const ContentContainerStyled = styled.div` - width: 100%; - height: 100vh; - overflow: hidden; - margin-top: 16px; -`; - -export default MainContainerStyled; - -export { TitleContainerStyled, ContentContainerStyled }; - diff --git a/frontend/src/components/Menu/MenuComponent.style.jsx b/frontend/src/components/Menu/MenuComponent.style.jsx deleted file mode 100644 index d722b33..0000000 --- a/frontend/src/components/Menu/MenuComponent.style.jsx +++ /dev/null @@ -1,82 +0,0 @@ -import styled from "styled-components"; -import { color } from "../../style/varibles"; - -//Nav -const MenuStyled = styled.nav` - position: absolute; - width: 76px; - height: 100vh; - background: ${color.pricinpal.grisOscuro}; //Same background login - z-index: 100; - animation: ${(props) => (props.hover ? "hover" : "hoveroff")} 0.5s forwards; - @keyframes hover { - from { - width: 76px; - } - to { - width: 218px; - } - } - @keyframes hoveroff { - from { - width: 218px; - } - to { - width: 76px; - } - } -`; - -//UL -const MenuListStyled = styled.ul` - margin-top: 16px; - position: relative; - display: flex; - flex-direction: column; - justify-content: center; - z-index: 100; -`; - -//LI -const MenuListItemStyled = styled.li` - cursor: pointer; - display: flex; - flex-direction: row; - margin: 12px 28px; - gap: 6px; - color: ${color.pricinpal.blanco}; - transition: all 0.1s linear; - a { - display: flex; - align-items: center; - color: ${color.pricinpal.blanco}; - gap: 12px; - text-decoration: none; - - p { - text-transform: capitalize; - font-family: "Helvetica55"; - font-size: 14px; - opacity: ${(props) => (props.hover ? "1" : "0")}; - display: ${(props) => (props.hover ? "block" : "none")}; - } - svg { - width: 18px; - height: 18px; - fill: ${color.pricinpal.blanco}; - transition: all 0.1s linear; - } - } - &:hover a p, - &:hover a svg { - color: ${color.pricinpal.naranja}; - fill: ${color.pricinpal.naranja}; - transition: all 0.1s linear; - } - @media only screen and (max-height: 790px) { - margin: 6px 28px; - } -`; - -export { MenuStyled, MenuListStyled, MenuListItemStyled }; - diff --git a/frontend/src/components/PageTitle/PageTitle.style.jsx b/frontend/src/components/PageTitle/PageTitle.style.jsx deleted file mode 100644 index d11ae30..0000000 --- a/frontend/src/components/PageTitle/PageTitle.style.jsx +++ /dev/null @@ -1,69 +0,0 @@ -import styled from "styled-components"; -import { color } from "../../style/varibles"; - -const PageTitleStyled = styled.div` - display: flex; - justify-content: space-between; - align-items: center; - flex-wrap: nowrap; -`; -const UserBtnStyled = styled.button` - display: flex; - width: 218px; - padding: 16px; - text-align: left; - background-color: ${color.pricinpal.grisOscuro}; - color: ${color.pricinpal.blanco}; - border: none; - border-radius: 5px; - font-family: "Helvetica55"; - letter-spacing: 0.5px; - font-size: 14px; - text-transform: capitalize; - align-items: center; - cursor: pointer; - img { - background-color: white; - width: 24px; - height: 24px; - object-fit: contain; - border-radius: 50%; - margin-right: 12px; - } -`; - -const UserModalStyled = styled.div` - display: ${({ modal }) => (modal ? "flex" : "none")}; - position: absolute; - background-color: white; - padding: 12px; - right: 2rem; - top: 5.5rem; - border-radius: 5px; - z-index: 999; - box-shadow: ${color.shadow.dark} ${color.gradient.bgOpacity}; -`; - -const UserModalListStyled = styled.ul` - display: flex; - flex-direction: column; -`; - -const UserModalItemStyled = styled.li` - display: flex; - justify-content: left; - color: ${color.pricinpal.grisOscuro}; - margin: 6px 0; - cursor: pointer; - svg { - margin-right: 12px; - } -`; -export { - PageTitleStyled, - UserBtnStyled, - UserModalStyled, - UserModalListStyled, - UserModalItemStyled, -}; - diff --git a/frontend/src/components/PageTitle/UserBtn/UserBtn.jsx b/frontend/src/components/PageTitle/UserBtn/UserBtn.jsx deleted file mode 100644 index 299a22e..0000000 --- a/frontend/src/components/PageTitle/UserBtn/UserBtn.jsx +++ /dev/null @@ -1,46 +0,0 @@ -import React from "react"; -import { UserBtnStyled, UserModalStyled, UserModalListStyled } from "../PageTitle.style"; - -import { AuthContext } from "../../../context/Auth/AuthContext"; -import UserItem from "./UserItem"; - -import { ReactComponent as Perfil } from "../../../assets/icons/UserModal/perfil.svg"; -import { ReactComponent as Signoff } from "../../../assets/icons/UserModal/signoff.svg"; -import ConfirmationModal from "../../ConfirmationModal/ConfirmationModal"; -import UserModal from "../../UserModal/UserModal"; - -const UserBtn = ({ user, img, modal, modalSet }) => { - const [modalConfirm, setModalConfirm] = React.useState(false); - const [modalUser, setModalUser] = React.useState(false); - const { handleLogout } = React.useContext(AuthContext); - - const handleModal = () => { - setModalConfirm(!modalConfirm); - }; - const handleModalUser = (e)=>{ - e.preventDefault() - setModalUser(!modalUser) - } - - return ( - <> - - {user - Bem Vindo, {user ? user.name : null} - - - - } onClick={handleModalUser} /> - } onClick={handleModal} /> - - - - - Deseja Sair do sistema? - - - ); -}; - -export default UserBtn; - diff --git a/frontend/src/components/UserModal/UserModal.jsx b/frontend/src/components/UserModal/UserModal.jsx deleted file mode 100644 index 3f9776c..0000000 --- a/frontend/src/components/UserModal/UserModal.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import React from "react"; -import { color } from "../../style/varibles"; -import { ModalOverlayStyled, UserModalStyled, UserBtns } from "./UserModal.style"; - -import api from "../../services/api"; -import { AuthContext } from "../../context/Auth/AuthContext"; -import { Can } from "../Can"; - -import BtnComponent from "../Base/BTN/Btn"; -import FormComponent from "../Base/Form/FormComponent"; -import InputComponent from "../Base/Form/Input/InputComponent"; -import UserModalComponent from "./UserModalImg/UserModalComponent"; - -import UserImg from "../../assets/images/User/user.jpg"; - -const UserModal = ({ modal, click }) => { - const { user } = React.useContext(AuthContext); - - const initalData = { - name: user.name, - email: user.email, - perfil:user.profile, - } - console.log(user); - - return ( - - - - - - - - - - - - - - - ); -}; - -export default UserModal; - -/*{name: 'teste', id: 2, email: 'teste@teste.com', profile: 'master', tokenVersion: 0, …} -email: "teste@teste.com" -id: 2 -name: "teste" -profile: "master" -queues: [] -tokenVersion: 0 */ \ No newline at end of file diff --git a/frontend/src/components/UserModal/UserModal.style.jsx b/frontend/src/components/UserModal/UserModal.style.jsx deleted file mode 100644 index 8b64508..0000000 --- a/frontend/src/components/UserModal/UserModal.style.jsx +++ /dev/null @@ -1,34 +0,0 @@ -import styled from "styled-components"; -import { color } from "../../style/varibles"; - -const ModalOverlayStyled = styled.div` - display: ${({ modal }) => (modal ? "flex" : "none")}; - position: absolute; - justify-content: center; - align-items: center; - width: 100%; - height: 100vh; - background-color: #00000050; - z-index: 100; - top: 0; - right: 0; -`; -const UserModalStyled = styled.div` - position: relative; - display: flex; - flex-direction: row; - margin: 0 auto; - padding: 12px; - z-index: 101; - border-radius: 5px; - background-color: ${color.pricinpal.grisOscuro}; - width: 650px; -`; -const UserBtns = styled.div` - width: 100%; - display: flex; - flex-direction: row; - justify-content: space-between; -`; -export { ModalOverlayStyled, UserModalStyled, UserBtns }; -