templates/frontend/category/_leftSidebar.html.twig line 1

Open in your IDE?
  1. {% trans_default_domain 'store' %}
  4. <!-- START OF SIDEBAR MENU: FILTERS LIST ON DESKTOP -->
  5. <div class="column is-one-quarter is-hidden-touch">
  6.     <div class="columns">
  7.         <div class="column" v-cloak>
  9.         <div style="display: none">
  10.             {{ form_row(form.query) }}
  11.         </div>
  12.             {% set isFilters = 1 %}
  13.             {% if disabledFilters is defined and disabledFilters == 1 %}
  14.                 {% set isFilters = 0 %}
  15.             {% endif %}
  16.             <!-- START OF ACCORDION -->
  17.             <sb-accordion inline-template v-cloak active="1">
  18.                 <section class="sidebar-accordion" style="margin-top:12px;">
  20.                     {% if isFilters %}
  21.                         <!-- START OF ACCORDION -->
  22.                         <sb-accordion inline-template v-cloak active="1">
  23.                             <section class="sidebar-accordion">
  25.                                 <!-- START OF ACCORDION TITLE -->
  26.                                 <div class="level" @click="toggleAccordion">
  27.                                     <div class="level-left">
  28.                                         <div class="level-item">
  29.                                             <span class="has-text-weight-bold is-16px">
  30.                                                 {{ 'sendTime'|trans }}
  31.                                             </span>
  32.                                         </div>
  33.                                     </div>
  34.                                     <div class="level-right">
  36.                                     </div>
  37.                                 </div>
  38.                                 <!-- END OF ACCORDION TITLE -->
  40.                             </section>
  41.                         </sb-accordion>
  42.                         <!-- END OF ACCORDION -->
  44.                         <!-- START OF ACCORDION CONTENT -->
  45.                         <nav v-if="unfold">
  46.                             <div class="divider"></div>
  47.                             <div>
  48.                             {{ form_widget(form.availability) }}
  49.                             </div>
  50.                             <div style="clear: both"></div>
  51.                         </nav>
  52.                         <!-- END OF ACCORDION CONTENT -->
  53.                     {% endif %}
  55.                     <hr class="hr">
  57.                     <!-- START OF ACCORDION TITLE -->
  58.                     <div class="level" @click="toggleAccordion" style="margin-top:20px;">
  59.                         <div class="level-left">
  60.                             <div class="level-item">
  61.                                 <span class="has-text-weight-bold is-16px">
  62.                                     {{ 'rooms'|trans }}
  63.                                 </span>
  64.                             </div>
  65.                         </div>
  66.                         <div class="level-right">
  67.                             <span class="icon">
  68.                                 <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  69.                             </span>
  70.                         </div>
  71.                     </div>
  73.                     <nav v-if="unfold">
  74.                         {% set catCounter = 0 %}
  75.                         {% for category in categories %}
  76.                             {% set catCounter = catCounter + 1 %}
  77.                             <sb-accordion-group {% if category.id == app.request.attributes.get('id') or (app.request.attributes.get('id') in category.getChildrenIds) %}activesub="1" {% else %}activesub="0"{% endif %} catid="{{ category.id }}" {% if catCounter > 3 %}v-if="showMore"{% endif %} inline-template v-cloak>
  78.                                 <div>
  79.                                     <div class="level" @click="toggleSubcategories">
  80.                                         <div class="level-left">
  81.                                             <div class="level-item">
  82.                                                 <span class="has-text-weight-semibold make-it-block" style="font-size:0.9rem;">
  83.                                                     <a {% if category.id == app.request.attributes.get('id') %}class="active" {% endif %} href="{{ path('category', {'id':category.id, 'slug':category.slug, 'av24h':app.request.attributes.get('av24h')}) }}">
  84.                                                         {{ category.name }}
  85.                                                     </a>
  86.                                                 </span>
  87.                                             </div>
  88.                                         </div>
  89.                                         <div class="level-right">
  90.                                             <span class="icon">
  91.                                                 <i :class="[ 'fas', showSubcategories ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  92.                                             </span>
  93.                                         </div>
  94.                                     </div>
  96.                                     <ul v-if="showSubcategories">
  97.                                         {% for child in category.childrens %}
  98.                                             {% set visibleCat = 1 %}
  99.                                             {% set nbProd = child.langParams[0].nbProducts %}
  100.                                             {% for langParam in child.langParams %}
  101.                                                 {% if langParam.language.getLocaleShort == app.request.locale %}
  102.                                                     {% set visibleCat = langParam.visible %}
  104.                                                     {% if langParam.nbProducts and langParam.nbProducts is not null %}
  105.                                                         {% set nbProd = langParam.nbProducts %}
  106.                                                     {% endif %}
  107.                                                 {% endif %}
  108.                                             {% endfor %}
  109.                                             {% if visibleCat %}
  110.                                                 <li><a {% if child.id == app.request.attributes.get('id') %}class="active" active="1" {% else %}active="0"{% endif %}href="{{ path('category', {'id':child.id, 'slug':child.slug, 'av24h':app.request.attributes.get('av24h')}) }}">{{ child.name }}</a>
  111.                                                     <span class="has-text-grey-light">({{ nbProd }})</span>
  112.                                                 </li>
  113.                                             {% endif %}
  114.                                         {% endfor %}
  115.                                     </ul>
  116.                                 </div>
  117.                             </sb-accordion-group>
  118.                         {% endfor %}
  120.                         <span class="wiecej-pomieszczen has-text-weight-semibold"
  121.                               @click="toggleMore"
  122.                               v-if="showMore == false">
  123.                             {{ 'moreRooms'|trans }}...
  124.                         </span>
  125.                         <span class="wiecej-pomieszczen has-text-weight-semibold"
  126.                               @click="toggleMore"
  127.                               v-else>
  128.                             {{ 'lessRooms'|trans }}...
  129.                         </span>
  130.                     </nav>
  131.                     <!-- END OF ACCORDION CONTENT -->
  133.                 </section>
  134.             </sb-accordion>
  135.             <!-- END OF ACCORDION -->
  137.             <hr class="hr">
  139.             <!-- START OF ACCORDION -->
  140.             <sb-accordion inline-template v-cloak active="1">
  141.                 <section class="sidebar-accordion">
  143.                     <!-- START OF ACCORDION TITLE -->
  144.                     <div class="level" @click="toggleAccordion">
  145.                         <div class="level-left">
  146.                             <div class="level-item">
  147.                                 <span class="has-text-weight-bold is-16px">
  148.                                     {{ 'furnituteTypes'|trans }}
  149.                                 </span>
  150.                             </div>
  151.                         </div>
  152.                         <div class="level-right">
  153.                             <span class="icon">
  154.                                 <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  155.                             </span>
  156.                         </div>
  157.                     </div>
  158.                     <!-- END OF ACCORDION TITLE -->
  160.                     <!-- START OF ACCORDION CONTENT -->
  161.                     <nav v-if="unfold">
  162.                         <ul>
  163.                             {% for furnitureType in furnitureTypes|slice(0,5) %}
  164.                                 <li>
  165.                                     <a {% if app.request.attributes.get('furnitureTypeId') == furnitureType.id %} class="active" {% endif %} href="{{ path('furnitureType', {'furnitureTypeId':furnitureType.id, 'customFilter':app.request.attributes.get('customFilter'), 'slug':furnitureType.slug}) }}">
  166.                                         {{ furnitureType.name }}
  167.                                     </a>
  168.                                     <span class="has-text-grey-light">({{ furnitureType.langParams[0].nbProducts }})</span>
  169.                                 </li>
  170.                             {% endfor %}
  172.                             <div v-if="showMore">
  173.                                 {% for furnitureType in furnitureTypes|slice(5,100) %}
  174.                                     <li>
  175.                                         <a {% if app.request.attributes.get('furnitureTypeId') == furnitureType.id %} class="active" {% endif %} href="{{ path('furnitureType', {'furnitureTypeId':furnitureType.id, 'customFilter':app.request.attributes.get('customFilter'), 'slug':furnitureType.slug}) }}">
  176.                                             {{ furnitureType.name }}
  177.                                         </a>
  178.                                         <span class="has-text-grey-light">({{ furnitureType.langParams[0].nbProducts }})</span>
  179.                                     </li>
  180.                                 {% endfor %}
  181.                             </div>
  182.                         </ul>
  184.                         <span class="has-text-weight-semibold more-furniture-types"
  185.                               @click="toggleMore"
  186.                               v-if="showMore == false">
  187.                             {{ 'moreFurnitureTypes'|trans }}...
  188.                         </span>
  189.                         <span class="has-text-weight-semibold"
  190.                               @click="toggleMore"
  191.                               v-else>
  192.                             {{ 'lessFurnitureTypes'|trans }}...
  193.                         </span>
  194.                     </nav>
  195.                     <!-- END OF ACCORDION CONTENT -->
  197.                 </section>
  198.             </sb-accordion>
  199.             <!-- END OF ACCORDION -->
  202.             {% if isFilters %}
  203.                 <hr class="hr">
  205.                 <!-- START OF ACCORDION -->
  206.                 <sb-accordion inline-template v-cloak active="1">
  207.                     <section class="sidebar-accordion">
  209.                         <!-- START OF ACCORDION TITLE -->
  210.                         <div class="level" @click="toggleAccordion">
  211.                             <div class="level-left">
  212.                                 <div class="level-item">
  213.                                     <span class="has-text-weight-bold is-16px">
  214.                                         {{ 'priceFilter'|trans }}
  215.                                     </span>
  216.                                 </div>
  217.                             </div>
  218.                             <div class="level-right">
  219.                                 <span class="icon">
  220.                                     <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  221.                                 </span>
  222.                             </div>
  223.                         </div>
  224.                         <!-- END OF ACCORDION TITLE -->
  226.                         <!-- START OF ACCORDION CONTENT -->
  227.                         <nav v-if="unfold">
  228.                             <div class="field is-horizontal  zakres-cen">
  229.                                 <div class="field-body price-left">
  230.                                     {{ form_widget(form.priceFrom) }}
  231.                                 </div>
  232.                                 <div class="kreska">&mdash;</div>
  233.                                 <div class="field-body price-right">
  234.                                     {{ form_widget(form.priceTo) }}
  235.                                 </div>
  236.                             </div>
  237.                         </nav>
  238.                         <!-- END OF ACCORDION CONTENT -->
  239.                     </section>
  240.                 </sb-accordion>
  241.                 <!-- END OF ACCORDION -->
  243.                 <hr class="hr">
  245.                 <!-- START OF ACCORDION -->
  246.                 <sb-accordion inline-template v-cloak active="1">
  247.                     <section class="sidebar-accordion">
  249.                         <!-- START OF ACCORDION TITLE -->
  250.                         <div class="level" @click="toggleAccordion">
  251.                             <div class="level-left">
  252.                                 <div class="level-item">
  253.                                     <span class="has-text-weight-bold is-16px">
  254.                                         {{ 'producer'|trans }}
  255.                                     </span>
  256.                                 </div>
  257.                             </div>
  258.                             <div class="level-right">
  259.                                 <span class="icon">
  260.                                     <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  261.                                 </span>
  262.                             </div>
  263.                         </div>
  264.                         <!-- END OF ACCORDION TITLE -->
  266.                         <!-- START OF ACCORDION CONTENT -->
  267.                         <nav v-if="unfold">
  268.                             <div class="field is-horizontal producer-select" style="margin-top:20px;">
  269.                                 {{ form_widget(form.productProducer) }}
  270.                             </div>
  271.                         </nav>
  272.                         <!-- END OF ACCORDION CONTENT -->
  273.                     </section>
  274.                 </sb-accordion>
  275.                 <!-- END OF ACCORDION -->
  277.                 <hr class="hr">
  279.                 <!-- START OF ACCORDION -->
  280.                 <sb-accordion inline-template v-cloak active="1">
  281.                     <section class="sidebar-accordion">
  283.                         <!-- START OF ACCORDION TITLE -->
  284.                         <div class="level" @click="toggleAccordion">
  285.                             <div class="level-left">
  286.                                 <div class="level-item">
  287.                                     <span class="has-text-weight-bold is-16px">
  288.                                         {{ 'colors_available'|trans }}
  289.                                     </span>
  290.                                 </div>
  291.                             </div>
  292.                             <div class="level-right">
  293.                                 <span class="icon">
  294.                                     <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  295.                                 </span>
  296.                             </div>
  297.                         </div>
  298.                         <!-- END OF ACCORDION TITLE -->
  300.                         <!-- START OF ACCORDION CONTENT -->
  301.                         <nav v-if="unfold">
  302.                             <div class="field is-horizontal color-select" style="margin-top:20px;">
  303.                                 {{ form_widget(form.color) }}
  304.                             </div>
  305.                         </nav>
  306.                         <!-- END OF ACCORDION CONTENT -->
  307.                     </section>
  308.                 </sb-accordion>
  309.                 <!-- END OF ACCORDION -->
  311.                 <hr class="hr">
  313.                 <!-- START OF ACCORDION -->
  314.                 <sb-accordion class="ergonomyElement" inline-template v-cloak {% if searchData.ergonomy is defined and searchData.ergonomy|length %}active="1"{% endif %}>
  315.                     <section class="sidebar-accordion">
  317.                         <!-- START OF ACCORDION TITLE -->
  318.                         <div class="level" @click="toggleAccordion">
  319.                             <div class="level-left">
  320.                                 <div class="level-item">
  321.                                     <span class="has-text-weight-bold is-16px ergonomy-title-label">
  322.                                         {{ 'ergonomy'|trans }}
  323.                                     </span>
  324.                                 </div>
  325.                             </div>
  326.                             <div class="level-right">
  327.                                 <span class="icon">
  328.                                     <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  329.                                 </span>
  330.                             </div>
  331.                         </div>
  332.                         <!-- END OF ACCORDION TITLE -->
  334.                         <!-- START OF ACCORDION CONTENT -->
  335.                         <nav v-if="unfold">
  336.                             <div class="divider"></div>
  337.                             {{ form_widget(form.ergonomy) }}
  338.                         </nav>
  339.                         <!-- END OF ACCORDION CONTENT -->
  341.                     </section>
  342.                 </sb-accordion>
  343.                 <!-- END OF ACCORDION -->
  344.                 <hr class="hr ergonomyElement">
  345.                 <!-- START OF ACCORDION -->
  346.                 <sb-accordion class="functionsElement" inline-template v-cloak {% if searchData.functions is defined and searchData.functions|length %}active="1"{% endif %}>
  347.                     <section class="sidebar-accordion">
  349.                         <!-- START OF ACCORDION TITLE -->
  350.                         <div class="level" @click="toggleAccordion">
  351.                             <div class="level-left">
  352.                                 <div class="level-item">
  353.                                     <span class="has-text-weight-bold is-16px">
  354.                                         {{ 'functions'|trans }}
  355.                                     </span>
  356.                                 </div>
  357.                             </div>
  358.                             <div class="level-right">
  359.                                     <span class="icon">
  360.                                         <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  361.                                     </span>
  362.                             </div>
  363.                         </div>
  364.                         <!-- END OF ACCORDION TITLE -->
  366.                         <!-- START OF ACCORDION CONTENT -->
  367.                         <nav v-if="unfold">
  368.                             <div class="divider"></div>
  369.                             {{ form_widget(form.functions) }}
  370.                         </nav>
  371.                         <!-- END OF ACCORDION CONTENT -->
  373.                     </section>
  374.                 </sb-accordion>
  375.                 <!-- END OF ACCORDION -->
  377.                 <hr class="hr functionsElement">
  378.                 <!-- START OF ACCORDION -->
  379.                 <sb-accordion class="executionElement" inline-template v-cloak {% if searchData.execution is defined and searchData.execution|length %}active="1"{% endif %}>
  380.                     <section class="sidebar-accordion">
  382.                         <!-- START OF ACCORDION TITLE -->
  383.                         <div class="level" @click="toggleAccordion">
  384.                             <div class="level-left">
  385.                                 <div class="level-item">
  386.                                     <span class="has-text-weight-bold is-16px">
  387.                                         {{ 'execution'|trans }}
  388.                                     </span>
  389.                                 </div>
  390.                             </div>
  391.                             <div class="level-right">
  392.                                 <span class="icon">
  393.                                     <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  394.                                 </span>
  395.                             </div>
  396.                         </div>
  397.                         <!-- END OF ACCORDION TITLE -->
  399.                         <!-- START OF ACCORDION CONTENT -->
  400.                         <nav v-if="unfold">
  401.                             <div class="divider"></div>
  402.                             {{ form_widget(form.execution) }}
  403.                         </nav>
  404.                         <!-- END OF ACCORDION CONTENT -->
  406.                     </section>
  407.                 </sb-accordion>
  408.                 <!-- END OF ACCORDION -->
  409.                 <hr class="hr executionElement">
  410.                 <!-- START OF ACCORDION -->
  411.                 <sb-accordion inline-template v-cloak active="1">
  412.                     <section class="sidebar-accordion">
  413.                         <nav>
  414.                             <div class="divider"></div>
  415.                             <div class="field is-horizontal">
  416.                                 <button id="submitButton" type="submit" style="background:#ef1b2b" class="button is-link is-large is-fullwidth">{{ 'search'|trans }}</button>
  417.                             </div>
  418.                         </nav>
  420.                     </section>
  421.                 </sb-accordion>
  422.                 <!-- END OF ACCORDION -->
  424.             {% endif %}
  425.         </div>
  426.     </div>
  427. </div>
  428. <!-- END OF SIDEBAR MENU: FILTERS LIST ON DESKTOP -->
  429. <!-- START OF PRODUCT LIST -->
  430. <div class="column is-three-quarters-desktop is-full-tablet  has-side-padding">
  432.     <!-- START OF PRODUCT LIST CONTROLS -->
  434.     <nav class="level is-mobile add-bottom">
  436.         <!-- START OF LEFT SIDE OF CONTROLS -->
  437.         <div class="level-left">
  438.             <!-- FEATURE not for now -->
  439.             <!-- <span class="icon">
  440.                 <i class="fas fa-bars"></i>
  441.             </span> -->
  442.             <div class="level-item">
  443.                 <div class="field is-horizontal">
  445.                     <div class="field-label has-text-weight-bold is-16px">
  446.                         <label for="sort" class="label sortujj">{{ 'sorting'|trans }}</label>
  447.                     </div>
  449.                     <div class="field-body">
  450.                         <div class="field">
  451.                             <span class="select">
  452.                                 {{ form_widget(form.sorting, {'attr':{'id':'sort'}}) }}
  453.                             </span>
  454.                         </div>
  455.                     </div>
  457.                     <div class="field-label has-text-weight-bold is-16px">
  459.                     </div>
  461.                     <div class="field-body">
  462.                         <div class="field">
  463.                             <span class="select">
  464.                                 <select class="productsPerPage">
  465.                                     <option value="15" {% if productsPerPage is defined and productsPerPage == 15 %} selected="selected" {% endif %}>15 {{ 'products_on_page'|trans }}</option>
  466.                                     <option value="30" {% if productsPerPage is defined and productsPerPage == 30 %} selected="selected" {% endif %}>30 {{ 'products_on_page'|trans }}</option>
  467.                                     <option value="45" {% if productsPerPage is defined and productsPerPage == 45 %} selected="selected" {% endif %}>45 {{ 'products_on_page'|trans }}</option>
  468.                                 </select>
  469.                             </span>
  470.                         </div>
  471.                     </div>
  472.                 </div>
  473.             </div>
  475.         </div>
  476.         <!-- END OF LEFT SIDE OF CONTROLS -->
  478.         <!-- START OF CENTER OF CONTROLS -->
  479.         <!-- END OF CENTER OF CONTROLS -->
  481.         <!-- START OF RIGHT SIDE OF CONTROLS -->
  482.         <div class="level-right">
  483.             <div class="level-item">
  484.                 {{ knp_pagination_render(products) }}
  485.             </div>
  486.         </div>
  487.         <!-- END OF RIGHT SIDE OF CONTROLS -->
  488.     </nav>
  489.     <!-- END OF PRODUCT LIST CONTROLS -->
  491.     {% if isFilters %}
  492.     <!-- START OF FILTERS LIST ON MOBILE DEVICES  -->
  493.     <filters-list inline-template v-cloak>
  495.         <div class="is-hidden-desktop">
  496.             <nav class="level is-mobile" @click="toggleFiltersList" style="margin-bottom: 20px;">
  497.                 <div class="level-item" style="padding:15px; border: 1px solid #d4d8e1; font-weight: 600;">
  498.                     {{ 'filterResults'|trans }}
  499.                     <span class="icon">
  500.                         <i :class="[ 'fas', unfold ? 'fa-caret-up' : 'fa-caret-down' ]"></i>
  501.                     </span>
  502.                 </div>
  503.             </nav>
  505.             <div class="columns" v-if="unfold">
  507.                 <ul class="column is-one-third-tablet">
  509.                     <span class="has-text-weight-bold is-16px">
  510.                         {{ 'rooms'|trans }}
  511.                     </span>
  513.                     <div style="margin-left:22px; margin-top:5px;">
  514.                         {% set catCounter = 0 %}
  515.                         {% for category in categories %}
  516.                             {% set catCounter = catCounter + 1 %}
  517.                                 <div class="has-text-weight-semibold">
  518.                                     <a {% if category.id == app.request.attributes.get('id') %}class="active" {% endif %} href="{{ path('category', {'av24h':app.request.attributes.get('av24h'), 'id':category.id, 'slug':category.slug}) }}">
  519.                                         {{ category.name }}
  520.                                     </a>
  521.                                 </div>
  522.                             {% if category.id == app.request.attributes.get('id') %}
  523.                                 <ul style="margin-left:20px;">
  524.                                     {% for child in category.childrens %}
  525.                                         <li><a {% if child.id == app.request.attributes.get('id') %}class="active" active="1" {% else %}active="0"{% endif %}href="{{ path('category', {'av24h':app.request.attributes.get('av24h'), 'id':child.id, 'slug':child.slug}) }}">{{ child.name }}</a>
  526.                                             <span class="has-text-grey-light">({{ child.langParams[0].nbProducts }})</span>
  527.                                         </li>
  528.                                     {% endfor %}
  529.                                 </ul>
  530.                             {% endif %}
  531.                         {% endfor %}
  532.                     </div>
  534.                     <div class="divider"></div>
  536.                     <span class="has-text-weight-bold is-16px">
  537.                         {{ 'furnituteTypes'|trans }}
  538.                     </span>
  540.                     <div style="margin-left:22px; margin-top:5px;">
  542.                         {% for furnitureType in furnitureTypes %}
  543.                             <div class="has-text-weight-semibold">
  544.                                 <a {% if app.request.attributes.get('furnitureTypeId') == furnitureType.id %} class="active" {% endif %} href="{{ path('furnitureType', {'customFilter':app.request.attributes.get('customFilter'), 'furnitureTypeId':furnitureType.id, 'slug':furnitureType.slug}) }}">
  545.                                     {{ furnitureType.name }}
  546.                                 </a>
  547.                             </div>
  548.                         {% endfor %}
  549.                     </div>
  552.                 {#
  553.                 <div class="column is-one-third-tablet">
  554.                         <span class="has-text-weight-bold is-16px">
  555.                             Kolory obszycia
  556.                         </span>
  558.                     <label class="checkbox">
  559.                         <input type="checkbox">
  560.                         Czerwony<span class="has-text-grey-light">(20)</span>
  561.                     </label>
  563.                     <label class="checkbox">
  564.                         <input type="checkbox">
  565.                         Pomarańczowy<span class="has-text-grey-light">(20)</span>
  566.                     </label>
  568.                     <label class="checkbox">
  569.                         <input type="checkbox">
  570.                         Żółty / Złoty<span class="has-text-grey-light">(20)</span>
  571.                     </label>
  573.                     <label class="checkbox">
  574.                         <input type="checkbox">
  575.                         Zielony<span class="has-text-grey-light">(20)</span>
  576.                     </label>
  578.                     <label class="checkbox">
  579.                         <input type="checkbox">
  580.                         Turkusowy<span class="has-text-grey-light">(20)</span>
  581.                     </label>
  583.                     <label class="checkbox">
  584.                         <input type="checkbox">
  585.                         Niebieski<span class="has-text-grey-light">(20)</span>
  586.                     </label>
  588.                     <label class="checkbox">
  589.                         <input type="checkbox">
  590.                         Fioletowy<span class="has-text-grey-light">(20)</span>
  591.                     </label>
  593.                     <label class="checkbox">
  594.                         <input type="checkbox">
  595.                         Różowy<span class="has-text-grey-light">(20)</span>
  596.                     </label>
  598.                     <label class="checkbox">
  599.                         <input type="checkbox">
  600.                         Biały<span class="has-text-grey-light">(20)</span>
  601.                     </label>
  603.                     <label class="checkbox">
  604.                         <input type="checkbox">
  605.                         Szary<span class="has-text-grey-light">(20)</span>
  606.                     </label>
  608.                     <label class="checkbox">
  609.                         <input type="checkbox">
  610.                         Brązowy<span class="has-text-grey-light">(20)</span>
  611.                     </label>
  613.                     <label class="checkbox">
  614.                         <input type="checkbox">
  615.                         Czarny<span class="has-text-grey-light">(20)</span>
  616.                     </label>
  617.                 </div>
  618.                 #}
  619.                 <div class="divider2"></div>
  621.                     <div class="column">
  623.                         <span class="has-text-weight-bold is-16px">
  624.                             {{ 'sendTime'|trans }}
  625.                         </span>
  627.                         <div class="field is-horizontal">
  628.                             <div class="field-body price-left" style="margin-left:15px;">
  629.                                 {{ form_widget(form.availabilityMobile) }}
  630.                             </div>
  631.                         </div>
  633.                         <div class="divider"></div>
  634.                         <span class="has-text-weight-bold is-16px">
  635.                             {{ 'priceFilter'|trans }}
  636.                         </span>
  638.                             <div class="divider"></div>
  640.                         <div class="field is-horizontal" style="margin-left:15px;">
  641.                             <div class="field-body price-left">
  642.                                 {{ form_widget(form.priceFromMobile) }}
  643.                             </div>
  644.                             <div style="text-align: center">
  645.                                 &mdash;
  646.                             </div>
  647.                             <div class="field-body price-left">
  648.                                 {{ form_widget(form.priceToMobile) }}
  649.                             </div>
  650.                         </div>
  652.                         <div class="divider"></div>
  653.                         <span class="has-text-weight-bold is-16px">
  654.                             {{ 'producer'|trans }}
  655.                         </span>
  657.                         <div class="divider"></div>
  659.                         <div class="field is-horizontal" style="margin-left:15px;">
  660.                             <div class="field-body price-left">
  661.                                 {{ form_widget(form.productProducerMobile) }}
  662.                             </div>
  663.                         </div>
  665.                         <div class="divider"></div>
  666.                         <span class="has-text-weight-bold is-16px">
  667.                             {{ 'colors_available'|trans }}
  668.                         </span>
  670.                         <div class="divider"></div>
  672.                         <div class="field is-horizontal" style="margin-left:15px;">
  673.                             <div class="field-body price-left">
  674.                                 {{ form_widget(form.colorMobile) }}
  675.                             </div>
  676.                         </div>
  677.                     </div>
  679.                 <div class="column is-one-third-tablet">
  680.                     <span class="has-text-weight-bold is-16px">
  681.                         {{ 'ergonomy'|trans }}
  682.                     </span>
  684.                     <div style="margin-left:15px; margin-top:5px;">
  685.                         {{ form_widget(form.ergonomyMobile) }}
  686.                     </div>
  688.                 </div>
  690.                 <div class="column is-one-third-tablet">
  691.                     <span class="has-text-weight-bold is-16px">
  692.                         {{ 'functions'|trans }}
  693.                     </span>
  694.                     <div style="margin-left:15px; margin-top:5px;">
  695.                         {{ form_widget(form.functionsMobile) }}
  696.                     </div>
  697.                 </div>
  699.                 <div class="column is-one-third-tablet">
  700.                 <span class="has-text-weight-bold is-16px">
  701.                     {{ 'execution'|trans }}
  702.                 </span>
  703.                     <div style="margin-left:15px; margin-top:5px;">
  704.                         {{ form_widget(form.executionMobile) }}
  705.                     </div>
  706.                 </div>
  707.                 <button id="submitButtonMobile" style="background:#ef1b2b" type="submit" class="button is-link is-large is-fullwidth">{{ 'search'|trans }}</button>
  709.             </div>
  710.         </div>
  711.     </filters-list>
  712.     <!-- END OF FILTERS LIST ON MOBILE DEVICES  -->
  713.     {% else %}
  714.         {% do form.availability.setRendered %}
  715.         {% do form.availabilityMobile.setRendered %}
  716.         {% do form.functions.setRendered %}
  717.         {% do form.functionsMobile.setRendered %}
  718.         {% do form.ergonomy.setRendered %}
  719.         {% do form.ergonomyMobile.setRendered %}
  720.         {% do form.execution.setRendered %}
  721.         {% do form.executionMobile.setRendered %}
  722.         {% do form.priceToMobile.setRendered %}
  723.         {% do form.priceTo.setRendered %}
  724.         {% do form.priceFromMobile.setRendered %}
  725.         {% do form.priceFrom.setRendered %}
  726.         {% do form.productProducer.setRendered %}
  727.         {% do form.productProducerMobile.setRendered %}
  728.         {% do form.color.setRendered %}
  729.         {% do form.colorMobile.setRendered %}
  730.     {% endif %}