app/assets/stylesheets/modals/common.scss
.ReactModal__Content {
position: relative;
-webkit-user-select: none;
background-color: #fff;
.modal-title {
font-size: 1.6rem;
margin-bottom: 15px;
}
.modal-close {
@include flexCenter;
position: absolute;
top: 10px;
right: 10px;
z-index: 2;
cursor: pointer;
transition: all .3s;
width: 32px;
height: 32px;
border-radius: 50%;
&:hover {
transform: rotate(180deg);
background-color: #f5f5f5;
}
}
@include mediaMax($mobile-w) {
width: 100%;
height: 100%;
width: 100vw;
height: 100vh;
.modal-title {
margin-top: 60px;
margin-bottom: 20px;
}
.modal-close {
top: 40px;
right: 20px;
background-color: #f5f5f5;
}
}
}
// get validator img modal
.modal-ValidatorIMG {
width: 350px;
padding: 15px 30px 25px 30px;
background-color: #fff;
}
.modal-WechatLogin {
padding: 0 25px;
@include mediaMin($mobile-w) {
width: 350px;
.wechatqr-wrapper {
min-height: 550px;
}
}
.wechatqr-wrapper {
@include flexCenter;
}
iframe {
width: 100%;
}
@include mediaMax($mobile-w) {
padding-top: 70px;
// wechat login modal
.impowerBox .info,
.impowerBox .qrcode {
width: 250px;
}
}
}