theme/templates/blocks/B04_image/B04_image.default.html.twig line 1

Open in your IDE?
  1. {# BLOCK IMAGE #}
  2. {% import 'blocks\\macros.html.twig' as macros %}
  3. {% if fields.image != '' %}
  4.     <section {% if settings.is_animated|default %}data-aos="{{ settings.animation_type|default("fade")}}"{% endif %} {% if settings.extra_block_id|default %} id="{{ settings.extra_block_id|default}}" {% endif %} class="block-image {{ settings.extra_class|default }}" style="{{ macros.getStyles(settings) }}" {{ macros.getBlockDataAttributes(_context) }}>
  5.         {% if settings.fullwidth|default(0) != 1 %}<div class="container"><div class="{{ fields.align }}">{% endif %}
  6.         <picture>
  7.             {% set extension = fields.image|default|extension %}
  8.             {% if extension == 'svg' or  extension == 'gif' %}
  9.                 <img loading="lazy" src="{{CDN_URL|default}}{{ fields.image }}" alt="{{fields.image_alt|default}}" title="{{fields.image_title|default}}" class="{% if settings.fullwidth|default(0) %}w-100{% else %}img-fluid{% endif %}">
  10.             {% else %}
  11.                 {% if fields.type|default == 'small' %}
  12.                     {# no source #}
  13.                 {% elseif fields.type|default == 'medium' %}
  14.                     <source media="(min-width: 390px)" srcset="{{ (fields.image|imagine_filter('medium'))|replace({' ':'%20'}) }}">
  15.                 {% elseif fields.type|default == 'full' %}
  16.                     {% if settings.fullwidth|default(0) %}
  17.                         <source media="(min-width: 2520px)" srcset="{{ (fields.image|imagine_filter('compress'))|replace({' ':'%20'}) }}">
  18.                     {% endif %}
  19.                     <source media="(min-width: 992px)" srcset="{{ (fields.image|imagine_filter('full'))|replace({' ':'%20'}) }}">
  20.                     <source media="(min-width: 390px)" srcset="{{ (fields.image|imagine_filter('medium'))|replace({' ':'%20'}) }}">
  21.                 {% else %}
  22.                     <source media="(min-width: 992px)" srcset="{{ (fields.image|imagine_filter('big'))|replace({' ':'%20'}) }}">
  23.                     <source media="(min-width: 390px)" srcset="{{ (fields.image|imagine_filter('medium'))|replace({' ':'%20'}) }}">
  24.                 {% endif %}
  25.                 <img loading="lazy" src="{{(fields.image|imagine_filter('small'))|replace({' ':'%20'}) }}" alt="{{fields.image_alt|default}}" title="{{fields.image_title|default}}" class="{% if settings.fullwidth|default(0) %}w-100{% else %}img-fluid{% endif %}" style="{% if settings.border_radius|default %}border-radius: {{ settings.border_radius|default(0) }};{% endif %}">
  26.             {% endif %}
  27.         </picture>
  28.         {% if settings.fullwidth|default(0) != 1 %}</div></div>{% endif %}
  29.     </section>
  30. {% endif %}
  31. {# @END BLOCK IMAGE #}