modal-react-greg-lal-p14
v0.1.4
Published
HRnet modal for P14-wealth health project
Downloads
2
Readme
HRnet modal for P14-wealth health project
This is a reusable react modal, developed during 14th front-end developer training project
installation
npm i modal-react-greg-lal-p14
How it works?
- import the plugin inyour project :
import Modal from "modal-react-greg-lal-p14"
- render it in your component
< >
<Modal showModal={ } closeModal={ } message=" " />
< />
showModal => parameter to display modal
cloModal => parameter to close modal (for exemple by clicking on cross)
message => message to display in modal
- modify the style
.modal{
width: 100%;
height: 100%;
/*background-color: red;*/
position: absolute;
top: 0;
left: 0
}
.modal-content{
position: absolute;
top: 50%;
right: 40%;
display: flex;
flex-direction: row-reverse;
justify-content:space-between;
width: 400px;
height: 60px;
background-color: #93AD18;
border-radius: 15px;
box-shadow: 2px 2px #5A6F06;
}
.modal-close-icon{
margin: 5px 15px;
}
.message{
margin:auto;
align-self: center;
}