custom/plugins/EmovaWbTheme/src/Resources/views/storefront/element/cms-element-image.html.twig line 1

Open in your IDE?
  1. {% block element_image %}
  2.     {% set config = element.fieldConfig.elements %}
  4.     <div class="cms-element-{{ element.type }}{% if config.verticalAlign.value %} has-vertical-alignment{% endif %}">
  5.         {% block element_product_slider_alignment %}
  6.             {% if config.verticalAlign.value %}
  7.                 <div class="cms-element-alignment{% if config.verticalAlign.value == "center" %} align-self-center{% elseif config.verticalAlign.value == "flex-end" %} align-self-end{% else %} align-self-start{% endif %}">
  8.             {% endif %}
  9.                 {% block element_image_inner %}
  10.                     {% set imageElement %}
  11.                         {% block element_image_container %}
  12.                             {% if element.data.media.url %}
  13.                                 <div class="cms-image-container is-{{ element.translated.config.displayMode.value }}"
  14.                                     {% if element.translated.config.minHeight.value and element.translated.config.displayMode.value == "cover" %} style="min-height: {{ element.translated.config.minHeight.value }};"{% endif %}>
  15.                                     {% if element.data.media.fileName!="Empty" %}
  16.                                     <div class="almarenaRegular" style="z-index: 1; color: white; position: absolute; width: 100%; text-align: right; padding: 10px; font:normal normal normal 14px/24px">ENERGIE SO EINFACH</div>
  17.                                     {% block element_image_media %}
  18.                                         {% set attributes = {
  19.                                             'class': 'cms-image',
  20.                                             'alt': (element.data.media.translated.alt ?: ''),
  21.                                             'title': (element.data.media.translated.title ?: '')
  22.                                         } %}
  24.                                         {% if element.translated.config.displayMode.value == 'cover' or element.translated.config.displayMode.value == 'contain' %}
  25.                                             {% set attributes = attributes|merge({ 'data-object-fit': element.translated.config.displayMode.value }) %}
  26.                                         {% endif %}
  28.                                         {% sw_thumbnails 'cms-image-thumbnails' with {
  29.                                             media: element.data.media
  30.                                         } %}
  31.                                     {% endblock %}
  32.                                     {% endif %}
  33.                                 </div>
  34.                             {% endif %}
  35.                         {% endblock %}
  36.                     {% endset %}
  38.                     {% if element.translated.config.url.value %}
  39.                         <a href="{{ element.translated.config.url.value }}"
  40.                            class="cms-image-link"
  41.                            {% if element.translated.config.newTab.value %}target="_blank" rel="noopener"{% endif %}>
  42.                             {{ imageElement }}
  43.                         </a>
  44.                     {% else %}
  45.                         {{ imageElement }}
  46.                     {% endif %}
  47.                 {% endblock %}
  48.             {% if config.verticalAlign.value %}
  49.                 </div>
  50.             {% endif %}
  51.         {% endblock %}
  52.     </div>
  53. {% endblock %}