custom/plugins/KsGeutherTheme/src/Resources/views/storefront/component/listing/filter/filter-input-range-passung.html.twig line 1

Open in your IDE?
  1. {% block component_filter_input_range_passung %}
  2.     {% if slot.data.listing.extensions.passung.min and slot.data.listing.extensions.passung.max %}
  4.         {% set passungMin = slot.data.listing.extensions.passung.min|round(0, 'floor') %}
  5.         {% set passungMax = slot.data.listing.extensions.passung.max|round %}
  6.         {% set options = {
  7.             name: name,
  8.             label: displayName,
  9.             min: passungMin - 1,
  10.             max: passungMax,
  11.             step: 1,
  12.             unit: 'cm',
  13.         } %}
  14.         {% set filterItemId = 'filter-' ~ name ~ '-' ~ random() %}
  16.         <div class="custom-fields-filter-input filter-panel-item filter-range filter-input-range{% if not sidebar %} dropdown{% endif %}{% if feature('v6.5.0.0') %} d-grid{% endif %}"
  17.          data-filter-input-range="true"
  18.          data-filter-input-range-options=""
  19.          data-custom-fields-filter-input="true"
  20.          data-gbmed-custom-fields-filter-input-options='{{ options|json_encode }}'>
  22.         {% block component_filter_input_range_toggle %}
  23.             {# @deprecated tag:v6.5.0 - Bootstrap v5 removes `btn-block` class, use `d-grid` wrapper instead #}
  24.             <button class="filter-panel-item-toggle btn{% if sidebar and not feature('v6.5.0.0') %} btn-block{% endif %}"
  25.                     aria-expanded="false"
  26.             {% if sidebar %}
  27.                 {{ dataBsToggleAttr }}="collapse"
  28.                 {{ dataBsTargetAttr }}="#{{ filterItemId }}"
  29.             {% else %}
  30.                 {{ dataBsToggleAttr }}="dropdown"
  31.                 data-boundary="viewport"
  32.                 {{ dataBsOffsetAttr }}="0,8"
  33.                 aria-haspopup="true"
  34.             {% endif %}>
  36.             {% block component_filter_input_range_display_name %}
  37.                 {{ displayName }}
  38.             {% endblock %}
  40.             {% block component_filter_input_range_toggle_icon %}
  41.                 {% if theme_config('zen-category-filter-icon') is same as ('plus') %}
  42.                     {% sw_icon 'plus' style {
  43.                         'pack': 'solid', 'size': 'xs', 'class': 'filter-panel-item-toggle'
  44.                     } %}
  45.                 {% else %}
  46.                     {% sw_icon 'arrow-medium-down' style {'pack': 'solid', 'size': 'xs', 'class': 'filter-panel-item-toggle'} %}
  47.                 {% endif %}
  48.             {% endblock %}
  49.             </button>
  50.         {% endblock %}
  52.         {% block component_filter_input_range_dropdown %}
  53.             <div class="filter-range-dropdown filter-panel-item-dropdown{% if sidebar %} collapse{% else %} dropdown-menu{% endif %}"
  54.                  id="{{ filterItemId }}">
  56.                 {% block component_filter_input_range_container %}
  57.                     <div class="filter-input-range-container">
  59.                         {% block component_filter_input_range_slider %}
  60.                             <div class="filter-passung-slider-wrap">
  61.                                 <div class="filter-passung-slider"></div>
  62.                             </div>
  63.                         {% endblock %}
  65.                         <div class="filter-input-range-container-inner">
  66.                             {% block component_filter_input_range_min %}
  67.                                 <label class="filter-range-min">
  68.                                     {{ options.min }} {{ options.unit }}
  69.                                 </label>
  70.                             {% endblock %}
  72.                             {% block component_filter_input_range_input_label %}
  73.                                 <label class="custom-fields-filter-input-label">
  74.                                     {% block component_filter_body_height_input %}
  75.                                         <input
  76.                                                 class="custom-fields-filter-input-element form-control"
  77.                                                 name="{{ name }}"
  78.                                                 type="text"
  79.                                                 id="{{ name }}"
  80.                                                 placeholder="{{ options.min }}"
  81.                                         />
  82.                                     {% endblock %}
  84.                                     <span>{{ options.unit }}</span>
  85.                                 </label>
  86.                             {% endblock %}
  88.                             {% block component_filter_input_range_max %}
  89.                                 <label class="filter-range-max">
  90.                                     {{ options.max }} {{ options.unit }}
  91.                                 </label>
  92.                             {% endblock %}
  93.                         </div>
  95.                     </div>
  96.                 {% endblock %}
  97.             </div>
  98.         {% endblock %}
  99.     </div>
  100.     {% endif %}
  101. {% endblock %}