react-modal-dialog icon indicating copy to clipboard operation
react-modal-dialog copied to clipboard

How to remove the close icon from the modal

Open gauravbj11 opened this issue 7 years ago • 2 comments

I did not found any property to remove the close icon from modal

gauravbj11 avatar Jul 17 '17 05:07 gauravbj11

Not the best way here, but you can make it through CSS with an additional className.

JS:

<ModalContainer>
    <ModalDialog className="modal-dialog">
        // ...
    </ModalDialog>
</ModalContainer>

CSS:

.modal-dialog > a {
    display: none;
}

Also, you can customize it.

CSS:

.modal-dialog > a {
    top: -20px !important;
    left: auto !important;
    right: -20px !important;
}

.modal-dialog > a > svg > circle {
    fill: #13aeff !important;
}

Alexis-Bize avatar Sep 21 '17 14:09 Alexis-Bize

Same is you want to customize the modal dialog

.modal-dialog {
  padding: 0px !important;  /* !important is needed */
}
.modal-dialog >a {
    display: none;
}

PD. should this issue be close?

e-osuna-g avatar Sep 21 '17 22:09 e-osuna-g