57 lines
1.1 KiB
CSS
57 lines
1.1 KiB
CSS
body.jetpack-subscribe-modal-open {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.jetpack-subscribe-modal {
|
|
visibility: hidden;
|
|
position: fixed;
|
|
z-index: 50000; /* Same as WP.com Action bar */
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: auto;
|
|
background-color: transparent;
|
|
transition: all 0.4s;
|
|
}
|
|
|
|
.jetpack-subscribe-modal.open {
|
|
background-color: rgba(0,0,0,0.3);
|
|
visibility: visible;
|
|
}
|
|
|
|
.jetpack-subscribe-modal__modal-content {
|
|
position: relative;
|
|
visibility: hidden;
|
|
overflow: hidden;
|
|
top: 100%;
|
|
background-color: #fefefe;
|
|
margin: 15% auto;
|
|
width: 100%;
|
|
max-width: 600px;
|
|
border-radius: 10px;
|
|
box-sizing: border-box;
|
|
transition: all 0.4s;
|
|
text-wrap: balance;
|
|
}
|
|
|
|
.jetpack-subscribe-modal.open .jetpack-subscribe-modal__modal-content {
|
|
top: 0;
|
|
visibility: visible;
|
|
}
|
|
|
|
/*
|
|
* These text-wrap properties still have limited browser
|
|
* support, but based on feedback still adding them for when
|
|
* they are supported.
|
|
*/
|
|
.jetpack-subscribe-modal__modal-content p {
|
|
text-wrap: balance;
|
|
text-wrap: pretty;
|
|
}
|
|
|
|
@media screen and (max-width: 640px) {
|
|
.jetpack-subscribe-modal__modal-content {
|
|
width: 94%;
|
|
}
|
|
}
|