Web: Login: fix modal style

This commit is contained in:
Viktor Fomin 2022-03-09 11:43:08 +03:00
parent df920f7b4e
commit 947115a6ca

View File

@ -6,7 +6,6 @@ import { providersData } from "@appserver/common/constants";
import styled from "styled-components"; import styled from "styled-components";
import { ReactSVG } from "react-svg"; import { ReactSVG } from "react-svg";
import { getProviderTranslation } from "@appserver/common/utils"; import { getProviderTranslation } from "@appserver/common/utils";
import { isMobile } from "react-device-detect";
const ProviderRow = styled.div` const ProviderRow = styled.div`
width: 100%; width: 100%;
@ -37,10 +36,13 @@ const ProviderRow = styled.div`
const Modal = styled(ModalDialog)` const Modal = styled(ModalDialog)`
.modal-dialog-aside { .modal-dialog-aside {
transform: translateX( transform: translateX(${(props) => (props.visible ? "0" : "480px")});
${(props) => (props.visible ? "0" : props.isMobile ? "325px" : "480px")} width: 480px;
);
width: ${(props) => (props.isMobile ? "325px" : "480px")}; @media (max-width: 375px) {
width: 325px;
transform: translateX(${(props) => (props.visible ? "0" : "480px")});
}
} }
`; `;
@ -61,7 +63,6 @@ const MoreLoginModal = (props) => {
visible={visible} visible={visible}
onClose={onClose} onClose={onClose}
removeScroll={true} removeScroll={true}
isMobile={isMobile}
> >
<ModalDialog.Header>{t("Authorization")}</ModalDialog.Header> <ModalDialog.Header>{t("Authorization")}</ModalDialog.Header>
<ModalDialog.Body> <ModalDialog.Body>