1
0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00
joplin/packages/app-desktop/gui/Dialog.tsx

43 lines
829 B
TypeScript

import styled from 'styled-components';
const DialogModalLayer = styled.div`
z-index: 9999;
display: flex;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.6);
align-items: flex-start;
justify-content: center;
overflow: hidden;
`;
const DialogRoot = styled.div`
background-color: ${props => props.theme.backgroundColor};
padding: 16px;
box-shadow: 6px 6px 20px rgba(0,0,0,0.5);
margin: 20px;
min-height: fit-content;
display: flex;
flex-direction: column;
border-radius: 10px;
`;
interface Props {
renderContent: Function;
className?: string;
onClose?: Function;
}
export default function Dialog(props: Props) {
return (
<DialogModalLayer className={props.className}>
<DialogRoot>
{props.renderContent()}
</DialogRoot>
</DialogModalLayer>
);
}