custom/plugins/SchilderSysteme/src/Resources/views/storefront/element/cms-element-category-slider.html.twig line 1

Open in your IDE?
  1. {% set productSliderOptions = {
  2.     productboxMinWidth:'200',
  3.     slider: {
  4.         gutter: 33,
  5.         nav: false,
  6.         mouseDrag: true,
  7.         controls: true,
  8.         autoplay: false,
  9.         prevButton:".slider-controls-prev-button-#{element.id}",
  10.         nextButton:".slider-controls-next-button-#{element.id}",
  11.         controls: true,
  12.     }
  13. } %}
  15. <div class="base-slider product-slider product-slider--inspirations has-nav"
  16.      data-product-slider="true"
  17.      data-product-slider-options="{{ productSliderOptions|json_encode }}">
  19.     {% block element_product_slider_inner %}
  21.         {% block element_product_slider_element %}
  22.             <div class="product-slider-container"
  23.                  data-product-slider-container="true">
  24.                 {% for category in element.data.all %}
  25.                     <div class="product-slider-item">
  26.                         {% set url =  category_url(category) %}
  27.                         {% set categoryColor = category.customFields.custom_category_info_color %}
  29.                         {% if category.mediaId %}
  30.                             {% set mediaImage = searchMedia([category.mediaId] ,context.context) %}
  31.                             {% set singleImage = mediaImage.get(category.mediaId) %}
  32.                         {% else %}
  33.                             {% set mediaImage = null %}
  34.                             {% set singleImage = null %}
  35.                         {% endif %}
  37.                         <a class="cms-element-categories-item" href="{{ url }}" alt="{{ category.translated.name }}">
  38.                             <img src="{{ singleImage.url }}" class="cms-element-categories-item-image">
  39.                             <span class="cms-element-categories-item-text">{{ category.translated.name }}</span>
  40.                             <div class="background-container" style="background-color:{{ categoryColor }}"></div>
  41.                         </a>
  42.                     </div>
  43.                 {% endfor %}
  44.             </div>
  46.         {% endblock %}
  48.         <span class="slider-controls-button prev slider-controls-prev-button-{{ element.id }} ">
  49.      {% sw_icon 'arrow_left'  style {
  50.          'namespace': 'Tuerschild_2',
  51.      } %}                </span>
  52.         <span class="slider-controls-button next slider-controls-next-button-{{ element.id }} arrow-right-rotate">
  53.      {% sw_icon 'arrow_left'  style {
  54.          'namespace': 'Tuerschild_2',
  55.      } %}                 </span>
  57.     {% endblock %}
  58. </div>