%PDF- %PDF-
Direktori : /home/emergentqj/actioncivile/pre-auth/.8352c036a19b0051d0217d27d25e3f4a/static/js/common/components/Modal/ |
Current File : /home/emergentqj/actioncivile/pre-auth/.8352c036a19b0051d0217d27d25e3f4a/static/js/common/components/Modal/Modal.styles.js |
import styled, { css } from "styled-components"; import Modal from "react-modal"; import { ifProp, theme } from "styled-tools"; import { Text } from "../Text"; export const StyledModal = styled(Modal)` position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: min(90%, 560px); border: 1px solid transparent; border-radius: 5px; outline: none; background: ${theme("color.neutral-container.primary")}; overflow: auto; `; export const Title = styled(Text)` margin-right: 18px; `; export const Header = styled.div` display: flex; justify-content: space-between; align-items: baseline; ${ifProp( "isBodyMaxHeight", css` padding: 24px; `, css` padding: 24px 24px 12px 24px; `, )} `; export const Footer = styled.div` display: flex; justify-content: flex-end; background: #fff; width: 100%; ${ifProp( "isBodyMaxHeight", css` border-top: 1px solid ${theme("color.neutral.tertiary")}; padding: 24px; `, css` padding: 12px 24px 24px 24px; `, )} `; export const StyledBody = styled.div` overflow-y: auto; word-break: break-word; padding: 0 24px; ${ifProp( "maxBodyHeight", css` max-height: 560px; `, )} `; export const BackButtonContainer = styled.div` margin-right: auto `;