custom/plugins/ATNTheme/src/Resources/views/storefront/element/cms-element-text.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/element/cms-element-text.html.twig' %}
  3. {% block element_text %}
  4.     {% set config = element.fieldConfig.elements %}
  6.     {% set customId = 'cms-el-' ~ random(5) ~ element.id ~ random(5) %}
  7.     {% if 'blurred-text-box' in config.cssClass.value %}
  8.         {#  use color as fallback #}
  9.         {% set fallbackColor = theme_config('sw-color-brand-primary') %}
  10.         {% set fallbackBackground = "linear-gradient(#{fallbackColor}, #{fallbackColor})" %}
  12.         {# use background image from section as fallback #}
  13.         {% set mediaId = section.backgroundMediaId %}
  14.         {% set mediaCollection = searchMedia([mediaId], context.context) %}
  15.         {% set mediaItem = mediaCollection.get(mediaId) %}
  17.         {% if mediaItem.url %}
  18.             {% set fallbackBackground = "url('#{mediaItem.url}')" %}
  19.         {% endif %}
  21.         {# use (biggest) thumbnail as fallback #}
  22.         {% if mediaItem.thumbnails.elements %}
  23.             {% for thumbnail in mediaItem.thumbnails.elements |filter((a, b) => (a.width > b.width ? 1 : -1)) %}
  24.                 {% if loop.first and thumbnail.url %}
  25.                     {% set fallbackBackground = "url('#{thumbnail.url}')" %}
  26.                 {% endif %}
  27.             {% endfor %}
  28.         {% endif %}
  30.         {# implement fallback css #}
  31.         <style>
  32.             {{ '#' ~ customId }}::before {
  33.                 background-image: {{ fallbackBackground |raw }};
  34.             }
  35.         </style>
  36.     {% endif %}
  39.     {% set elementClasses = [config.cssClass.value, 'cms-element-' ~ element.type] %}
  41.     <div id="{{ customId }}"
  42.          class="{{ elementClasses|join(' ') }}{% if config.verticalAlign.value %} has-vertical-alignment{% endif %}">
  43.         {% block element_text_alignment %}
  44.             {{ parent() }}
  45.         {% endblock %}
  46.     </div>
  47. {% endblock %}