Style overlay background image and add support for caption

This commit is contained in:
Michael Rose
2016-03-23 21:59:58 -04:00
parent cae92a8770
commit 974797a2b8
4 changed files with 10 additions and 6 deletions

@ -11,7 +11,7 @@
{% endif %}
<div class="page__hero{% if page.header.overlay_color or page.header.overlay_image %}--overlay{% endif %}"
style="background: {{ page.header.overlay_color | default: 'transparent' }} {% if overlay_img_path %}url('{{ overlay_img_path }}'){% endif %};"
style="{% if page.header.overlay_color %}background-color: {{ page.header.overlay_color | default: 'transparent' }};{% endif %} {% if overlay_img_path %}background-image: url('{{ overlay_img_path }}');{% endif %}"
>
{% if page.header.overlay_color or page.header.overlay_image %}
<div class="wrapper">
@ -26,8 +26,8 @@
</div>
{% else %}
<img src="{{ img_path }}" alt="{{ page.title }}" class="page__hero-image">
{% if page.header.caption %}
<span class="page__hero-caption">{{ page.header.caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
{% endif %}
{% endif %}
{% if page.header.caption %}
<span class="page__hero-caption">{{ page.header.caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
{% endif %}
</div>