repos/website
1
Fork 0
Code Issues 1 Pull requests 27 Activity

Use picture tag to support smaller hero image on small screens

Browse source
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">