liebling/partials/hero.hbs
2019-10-03 17:07:33 +02:00

32 lines
847 B
Handlebars

{{!--
If the template in question has a background image, then we render responsive image styles
for it, and apply those styles to the <header> tag.
--}}
{{#if background}}
{{#contentFor "herobackground"}}
<style>
.m-hero__picture {
background-image: url({{img_url background size='xl'}});
}
@media(max-width: 1000px) {
.m-hero__picture {
background-image: url({{img_url background size='l'}});
}
}
@media(max-width: 600px) {
.m-hero__picture {
background-image: url({{img_url background size='m'}});
}
}
</style>
{{/contentFor}}
<header class="m-hero with-picture" data-aos="fade">
<div class="m-hero__picture in-post {{#is "post"}}in-post{{/is}}"></div>
{{else}}
<header class="m-hero no-picture {{#is "post"}}in-post{{/is}}" data-aos="fade">
{{/if}}