85 lines
1.6 KiB
CSS
85 lines
1.6 KiB
CSS
body.jetpack-subscribe-overlay-open {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay {
|
|
--jetpack-subscribe-overlay--background-color: var(--wp--preset--color--background, var(--wp--preset--color--base, var(--wp--preset--color--contrast, #F9F9F9)));
|
|
|
|
visibility: hidden;
|
|
position: fixed;
|
|
z-index: 50001; /* WP.com Action bar and floating subscribe button are 5000 */
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: transparent;
|
|
transition: background-color 0.4s, visibility 0.4s;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay__content {
|
|
position: relative;
|
|
visibility: hidden;
|
|
overflow: hidden;
|
|
top: 100%;
|
|
margin: 15% auto;
|
|
width: 100%;
|
|
max-width: 400px;
|
|
transition: top 0.4s, visibility 0.4s;
|
|
text-wrap: pretty;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay__close {
|
|
display: none;
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 32px;
|
|
right: 32px;
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
|
|
body.admin-bar .jetpack-subscribe-overlay__close {
|
|
top: 64px;
|
|
}
|
|
|
|
body.has-marketing-bar .jetpack-subscribe-overlay__close {
|
|
top: 81px;
|
|
}
|
|
|
|
body.admin-bar.has-marketing-bar .jetpack-subscribe-overlay__close {
|
|
top: 114px;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay__to-content {
|
|
display: none;
|
|
position: fixed;
|
|
bottom: 64px;
|
|
left: 0;
|
|
right: 0;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay.open {
|
|
background-color: var(--jetpack-subscribe-overlay--background-color);
|
|
visibility: visible;
|
|
|
|
.jetpack-subscribe-overlay__content {
|
|
top: 0;
|
|
visibility: visible;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay__close {
|
|
display: block;
|
|
}
|
|
|
|
.jetpack-subscribe-overlay__to-content {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 640px) {
|
|
.jetpack-subscribe-overlay__content {
|
|
width: 94%;
|
|
}
|
|
}
|