templates/bundles/SyliusShopBundle/Product/index.html.twig line 55

Open in your IDE?
  1. {% extends '@SyliusShop/layout.html.twig' %}
  3. {% block content %}
  4.     <div class="header-image">
  5.         <img class="img-header-destock" src="{{ asset('header-image.png', 'shop') }}" alt="cover">
  6.         <img class="img-header-responsive" src="{{ asset('header-image-responsive.png', 'shop') }}" alt="cover">
  8.         <div class="text-header">
  9.                 {% if slug == null %}
  10.                     <h1>Boutique</h1>
  11.                     <ul>
  12.                         {% for taxons in taxons %}
  13.                             <li class="link-taxons-header"><a href="{{ path('sylius_shop_product_index', {slug : taxons.code}) }}">{{ taxons.translations.toArray()['fr_FR'].name }}</a></li>
  14.                         {% endfor %}
  15.                     </ul>
  16.                 {% elseif slug.code == 'categories' %}
  18.                     <h1>Boutique</h1>
  19.                     <ul>
  20.                         {% for taxons in taxons %}
  21.                             <li class="link-taxons-header"><a href="{{ path('sylius_shop_product_index', {slug : taxons.code}) }}">{{ taxons.translations.toArray()['fr_FR'].name }}</a></li>
  22.                         {% endfor %}
  23.                     </ul>
  24.                 {% else %}
  25.                     <div class="title-header">
  26.                         <h1>{{ slug.translations.toArray()['fr_FR'].name }}</h1>
  27.                         {% set ancestors = slug.ancestors|reverse %}
  28.                         <a href="{{ path('sylius_shop_product_index', {slug : ancestors[0].code}) }}">
  29.                             <svg width="39" height="29" viewBox="0 0 39 29" fill="none" xmlns="http://www.w3.org/2000/svg">
  30.                                 <path d="M14.75 0.25L18.075 3.69375L9.64375 12.125L38.5 12.125V16.875L9.64375 16.875L18.075 25.3063L14.75 28.75L0.499995 14.5L14.75 0.25Z" fill="white"/>
  31.                             </svg>
  32.                         </a>
  33.                     </div>
  34.                     <ul>
  35.                         {% for taxon in taxons %}
  36.                             {% if taxon.code == slug.code %}
  38.                             {% else %}
  39.                                 <li class="link-taxons-header"><a href="{{ path('sylius_shop_product_index', {slug : taxon.code}) }}">{{ taxon.translations.toArray()['fr_FR'].name }}</a></li>
  40.                             {% endif %}
  41.                         {% endfor %}
  42.                     </ul>
  43.                 {% endif %}
  44.         </div>
  45.     </div>
  46.     <div class="container-h" id="container-category-page">
  47.         {% include '@SyliusShop/Product/Index/_header.html.twig' %}
  49.         <div class="ui stackable grid">
  50.             <div class="four wide column" id="filtre-container">
  51.                 <div class="header-filter-responsive">
  52.                     <h3 class="title-category-page">Boutique</h3>
  53.                     <i class="x icon" id="close-icon-filter"></i>
  54.                 </div>
  55.                 {% include '@SyliusShop/Product/Index/_sidebar.html.twig' %}
  56.                 <form method="POST" action="{{ path('sylius_shop_product_index', {slug : 'categories'}) }}" class="form_category_index">
  57.                 {% include '@SyliusShop/Product/Index/pricebar.html.twig' %}
  58.                 {% include '@SyliusShop/Product/Index/colorbar.html.twig' %}
  59.                 {% include '@SyliusShop/Product/Index/sizebar.html.twig' %}
  60. {#                {% include '@SyliusShop/Product/Index/statebar.html.twig' %}#}
  61. {#                {% include '@SyliusShop/Product/Index/brandbar.html.twig' %}#}
  62. {#                {% include '@SyliusShop/Product/Index/vendortypebar.html.twig' %}#}
  63. {#                {% include '@SyliusShop/Product/Index/locationbar.html.twig' %}#}
  65.                     <button type="submit" class="submit-button-filter">Rechercher</button>
  66.                 </form>
  67.             </div>
  68.             <div class="twelve wide column" id="main-index-product">
  69.                 {% include '@SyliusShop/Product/Index/_main.html.twig' %}
  70.             </div>
  71.         </div>
  72.     </div>
  73.     <script>
  75.       function toggleDiv(divClass, toggleBtnClass) {
  76.         // Sélectionnez la div avec la classe donnée
  77.         const div = document.querySelector(`.${divClass}`);
  79.         // Sélectionnez le bouton à basculer avec la classe donnée
  80.         const toggleBtn = document.querySelector(`.${toggleBtnClass}`);
  82.         // Ajoutez un gestionnaire d'événements au clic sur le bouton à basculer
  83.         // toggleBtn.addEventListener('click', () => {
  84.           // Changez le style de la div pour la masquer ou l'afficher
  85.           div.style.display = (div.style.display === 'none') ? 'block' : 'none';
  87.           // Changez le texte du bouton à basculer en fonction de l'état de la div
  88.           toggleBtn.textContent = (div.style.display === 'none') ? '+' : '-';
  89.         // });
  90.       }
  91.     </script>
  94. {% endblock %}