templates/front/product/product_list.html.twig line 1

Open in your IDE?
  1. {% extends 'base_front.html.twig' %}
  3. {% block body %}
  5.     <section id="products">
  6.         <div class="container-right container-video position-relative bg-black-transparent p-5">
  7.             <h2 class="black mb-3">Products <br><span>& services</span></h2>
  9.             <div class="tabs-page mt-5">
  10.                 <div class="row col-md-12">
  11.                     {% for category in allCategories %}
  12.                         {% if category.subcategories is not empty %}
  13.                             {% if not loop.first %}
  14.                                 <div class="separate"></div>
  15.                             {% endif %}
  16.                             <a href="{{ path('front_product_list', {'category_slug' : category.slug, 'subcategory_slug': category.subcategories.0.slug}) }}" {% if currentCategory.id == category.id %}class="active"{% endif %}>
  17.                                 <h3>{{ category.name }}</h3>
  18.                             </a>
  19.                         {% endif %}
  20.                     {% endfor %}
  21.                 </div>
  22.             </div>
  24.             <div class="col-md-12 mt-5 tabs-services">
  25.                 <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
  26.                     {% for subCategory in currentCategory.subCategories %}
  27.                         <li class="nav-item" role="presentation">
  28.                             <button class="nav-link {% if subCategory.id == currentSubCategory.id %}active{% endif %}"
  29.                                     id="pills-home-tab"
  30.                                     data-toggle="pill"
  31.                                     data-target="#{{ subCategory.slug }}"
  32.                                     type="button"
  33.                                     role="tab"
  34.                                     aria-controls="pills-home"
  35.                                     aria-selected="{% if subCategory.id == currentSubCategory.id %}true{% else %}false{% endif %}">{{ subCategory.name }}</button>
  36.                         </li>
  37.                     {% endfor %}
  38.                 </ul>
  39.                 <div class="tab-content" id="pills-tabContent">
  40.                     {% for subCategory in currentCategory.subCategories %}
  41.                         <div class="tab-pane fade {% if subCategory.id == currentSubCategory.id %}show active{% endif %}" id="{{ subCategory.slug }}" role="tabpanel" aria-labelledby="pills-home-tab">
  42.                         <div class="row col-md-12 mt-5 align-items-start">
  43.                             <div class="col-md-12 col-lg-12 col-xl-5 service-description" style="background-color:{{ subCategory.category.color }};">
  44.                                 <h3>DESCRIPTION</h3>
  45.                                 <p class="white">{{ subCategory.description }}</p>
  46.                             </div>
  47.                             <div class="col-lg-12 col-xl-7 service-list pt-4">
  48.                                 <div class="row">
  49.                                     {% for page in subCategory.productPages %}
  50.                                         <div class="col-lg-4 col-xl-4 mt-3">
  51.                                             <a href="{{ path('front_product_page', {'category_slug' : page.subcategory.category.slug, 'subcategory_slug': page.subcategory.slug, 'slug_page': page.slug}) }}">
  52.                                                 <div class="bg-white black square"><span>{{ page.name }}</div>
  53.                                             </a>
  54.                                         </div>
  55.                                     {% endfor %}
  56.                                 </div>
  57.                             </div>
  58.                         </div>
  59.                     </div>
  60.                     {% endfor %}
  61.                 </div>
  62.             </div>
  64.         </div>
  65.     </section>
  67. {% endblock %}