repos
/
website
1
Fork 0
Code Issues 1 Pull Requests 26 Activity

Use picture tag to support smaller hero image on small screens

This commit is contained in:
Jake Howard 2023-06-13 09:31:45 +01:00
parent 2f396bc158
commit 0917e39e40
Signed by: jake
GPG Key ID: 57AFB45680EDD477
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
website/common/templates/wagtail_base.html
View File

@ -11,7 +11,13 @@
{% endblock %}
{% block main_content %}
{% if page.hero_image_url %}<img class="hero" src="{{ page.hero_image_url }}" decoding="async" alt="" />{% endif %}
{% if page.hero_image_url %}
<picture>
{% if page.list_image_url %}<source srcset="{{ page.list_image_url }}" media="(max-width: 800px)" />{% endif %}
<img class="hero" src="{{ page.hero_image_url }}" decoding="async" alt="" />
</picture>
{% endif %}
{% if page.get_view_restrictions.exists %}
<section class="notification is-danger" id="view-restriction-banner">