vendor/shopware/storefront/Resources/views/storefront/component/listing/filter/filter-property-select.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/component/listing/filter/filter-multi-select.html.twig' %}
  3. {% if dataPluginSelectorOptions is not defined %}
  4.     {% set dataPluginSelectorOptions = {
  5.         name: name,
  6.         propertyName: propertyName,
  7.         snippets: {
  8.             disabledFilterText: 'listing.disabledFilterTooltip'|trans|sw_sanitize
  9.         }
  10.     } %}
  11. {% endif %}
  13. {% block component_filter_multi_select_list_item %}
  14.     <li class="filter-multi-select-list-item filter-property-select-list-item">
  15.         {% if displayType == 'color' or displayType == 'media' %}
  16.             {% set color = element.colorHexCode %}
  17.             {% set media = element.media.url %}
  18.             {% set name = element.translated.name %}
  19.             {% set id = element.id %}
  21.             {% block component_filter_property_select_preview %}
  22.                 <span class="filter-property-select-preview"
  23.                       title="{{ name }}"
  24.                       {% if displayType == 'color' and color %}
  25.                       style="background: {{ color }}"
  26.                       {% endif %}
  27.                       {% if displayType == 'media' and media %}
  28.                       style="background-image: url('{{ media }}')"
  29.                       {% endif %}>
  31.                     {% block component_filter_property_select_checkox_input %}
  32.                         <input type="checkbox"
  33.                                class="filter-property-select-checkbox filter-multi-select-checkbox"
  34.                                id="{{ id }}"
  35.                                data-label="{{ name }}"
  36.                                {% if displayType == 'color' and color %}
  37.                                data-preview-hex="{{ color }}"
  38.                                {% endif %}
  39.                                {% if displayType == 'media' and media %}
  40.                                data-preview-image-url="{{ media }}"
  41.                                {% endif %}>
  42.                     {% endblock %}
  44.                     {% block component_filter_property_select_preview_checkmark %}
  45.                         <span class="filter-property-select-preview-checkmark">
  46.                             {% block component_filter_property_select_preview_checkmark_icon %}
  47.                                 {% sw_icon 'checkmark' style {'pack': 'solid', 'size': 'xs'} %}
  48.                             {% endblock %}
  49.                         </span>
  50.                     {% endblock %}
  51.                 </span>
  52.             {% endblock %}
  54.             {% if not hideTitle %}
  55.                 {% block component_filter_property_select_preview_list_item_label_element %}
  56.                     <label class="filter-multi-select-item-label" for="{{ id }}">
  57.                         {% block component_filter_property_select_preview_list_item_label %}
  58.                             {{ name }}
  59.                         {% endblock %}
  60.                     </label>
  61.                 {% endblock %}
  62.             {% endif %}
  63.         {% else %}
  64.             {% block component_filter_property_select_preview_list_item %}
  65.                 {% sw_include '@Storefront/storefront/component/listing/filter/filter-multi-select-list-item.html.twig' %}
  66.             {% endblock %}
  67.         {% endif %}
  68.     </li>
  69. {% endblock %}