blob: c4778363d57d65519cd33f8e8e1a5c9b57403632 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
import * as _ from 'lodash';
import * as React from 'react';
import { ColorOption, overlayBlack, styled } from '../../style/theme';
import { Container } from './container';
import { Flex } from './flex';
import { Icon } from './icon';
export interface OverlayProps {
className?: string;
onClose?: () => void;
zIndex?: number;
}
const PlainOverlay: React.StatelessComponent<OverlayProps> = ({ children, className, onClose }) => (
<Flex className={className}>
<Container position="absolute" top="0px" right="0px">
<Icon height={18} width={18} color={ColorOption.white} icon="closeX" onClick={onClose} padding="2em 2em" />
</Container>
<Container width="100%" height="100%">
{children}
</Container>
</Flex>
);
export const Overlay = styled(PlainOverlay)`
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: ${props => props.zIndex}
background-color: ${overlayBlack};
`;
Overlay.defaultProps = {
zIndex: 100,
};
Overlay.displayName = 'Overlay';
|