diff options
author | 2018-06-16 19:38:51 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:52 +0300 | |
commit | 445f9d694df84bf6a4aedbeae47f8df7baa55c29 (patch) | |
tree | cae8b1c26b2345795a2f62530a2c13e81ae9293c /vnext/src/components/Modal.js | |
parent | 5bc9a7cc3f45697d7d0c0913b6971fedd87f096b (diff) |
Modal component
Diffstat (limited to 'vnext/src/components/Modal.js')
-rw-r--r-- | vnext/src/components/Modal.js | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/vnext/src/components/Modal.js b/vnext/src/components/Modal.js new file mode 100644 index 00000000..296f7911 --- /dev/null +++ b/vnext/src/components/Modal.js @@ -0,0 +1,45 @@ +import React from 'react'; +import PropTypes from 'prop-types'; + +import Icon from './Icon'; + +class Modal extends React.Component { + render() { + // Render nothing if the "show" prop is false + if (!this.props.show) { + return null; + } + + // The gray background + const backdropStyle = { + position: 'fixed', + top: 0, + bottom: 0, + left: 0, + right: 0, + backgroundColor: 'rgba(0,0,0,0.3)', + padding: 50 + }; + + return ( + <div id="dialogt" style={backdropStyle}> + <div id="dialogw"> + <div id="dialog_header"> + <div id="dialogc" onClick={this.props.onClose}> + <Icon name="ei-close" size="s" /> + </div> + </div> + {this.props.children} + </div> + </div> + ); + } +} + +Modal.propTypes = { + onClose: PropTypes.func.isRequired, + show: PropTypes.bool, + children: PropTypes.node +}; + +export default Modal;
\ No newline at end of file |