@auraxy/react-modal/lib/css/index.css

A react modal component

.overlay{position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.5)}.overlay.overlay-show{animation:overlay-show 0.3s ease;animation-fill-mode:both}.overlay.overlay-hidden{animation:overlay-hidden 0.3s ease;animation-fill-mode:both}@keyframes overlay-show{0%{opacity:0}100%{opacity:1}}@keyframes overlay-hidden{0%{opacity:1}99%{opacity:0}100%{height:0;overflow:hidden}}.modal{position:absolute;left:50%;top:40%;transform:translate(-50%, -50%);display:inline-block;min-width:360px;min-height:80px;color:#666;border-radius:3px;background:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.2)}.modal .header{padding:0 15px;line-height:40px}.modal .icon-close{position:absolute;right:7px;top:7px;width:30px;height:30px;color:#666;border-radius:50%;cursor:pointer}.modal .icon-close:hover{color:#333}.modal .icon-close:before{content:'';position:absolute;left:50%;top:50%;background:currentColor;transform:translate(-50%, -50%) rotate(45deg);width:1px;height:1em}.modal .icon-close:after{content:'';position:absolute;left:50%;top:50%;background:currentColor;transform:translate(-50%, -50%) rotate(45deg);width:1em;height:1px}.confirm-modal .modal-content{font-size:14px;padding:15px}.confirm-modal .footer{padding:10px 15px;text-align:right}.confirm-modal .footer .btn-ok,.confirm-modal .footer .btn-cancel{height:30px;padding:0 10px;margin:0 0 0 10px;line-height:28px;border:1px solid;border-radius:2px;outline:none;cursor:pointer}.confirm-modal .footer .btn-ok{color:#fff;border-color:#5095ff;background:#5095ff}.confirm-modal .footer .btn-cancel{color:#aaa;border-color:#ddd}.confirm-modal .footer .react-loading{display:inline-block;width:1em;height:1em;vertical-align:middle}