1.1.0 • Published 7 years ago
m-react-modal v1.1.0
Usage
npm i m-react-modal
import Modal from 'm-react-modal'
<Modal
status={this.state.modifyStatus}
onHide={() => this.setState({ modifyStatus: false })}
>
<h1>I am a react modal</h1>
</Modal>
Optional
<Modal {...opts}>
<h1>I am a react modal</h1>
</Modal>
opts:
y: '50px'
modalClassName: ''
layerClassName: ''
contentClassName: ''
layerStl: {
position: 'fixed',
background: 'rgba(0,0,0,0.12)',
zIndex: 9,
height: '100%',
width: '100%',
transition: 'opacity 0.3s',
WebkitTransition: 'opacity 0.3s',
visibility: 'hidden',
opacity: 0,
top: 0,
left: 0,
cursor: 'pointer',
}
contentStl: {
boxShadow: '0 5px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.4)',
top: 0,
position: 'fixed',
width: '50%',
background: '#fff',
margin: '0 auto',
left: 0,
right: 0,
padding: '15px',
borderRadius: '4px',
zIndex: 10,
visibility: 'hidden',
opacity: 0,
maxHeight: '80%',
overflowY: 'auto',
transition: 'all 0.3s',
WebkitTransition: 'all 0.3s',
}