entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 9 Releases Wiki Activity

misc: add IE11 support for page pictures (#30496)

This commit is contained in:
Frédéric Péters 2019-02-08 16:04:31 +01:00
parent 8e3947976d
commit ce1bdd355c
3 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
static/includes/_nav.scss
View File

@ -458,17 +458,17 @@ div.menucell {
}
@if $nav-after-image == true {
@supports (background-image: var(--page-picture)) {
body.has-picture nav::after {
content: "";
display: block;
width: 100%;
height: $nav-after-image-height;
background: transparent center center no-repeat;
background-image: var(--page-picture);
background-size: cover;
position: relative;
top: -0.5rem;
}
body.has-picture nav::after {
content: "";
display: block;
width: 100%;
height: $nav-after-image-height;
background-color: transparent;
background-image: var(--page-picture);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
top: -0.5rem;
}
}

6
static/saint-chamond/_custom.scss
View File

@ -258,9 +258,7 @@ div.cancel-button {
}
@media screen and (max-width: $nav-mobile-limit) {
@supports (background-image: var(--page-picture)) {
body.has-picture nav::after {
height: 200px;
}
body.has-picture nav::after {
height: 200px;
}
}

10
templates/combo/page_template.html
View File

@ -35,6 +35,16 @@
:root {
--page-picture: url("{{site_base}}{{page.picture.url}}");
}
{% block msie_css_page_picture %}
{# IE11 doesn't support CSS variable and supports() API, so we set it here and
themes that do need a different CSS will have to redefine the
msie_css_page_picture block. #}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
body.has-picture nav::after {
background-image: url("{{site_base}}{{page.picture.url}}");
}
}
{% endblock %}
</style>
{% endif %}
{% endblock %}