templates/front/boutique/cours/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Cours{% endblock %}
  5. {% block main %}
  7.     {# {% for produit in produits %}
  8.         {% if produit.visible %}
  9.             <div>
  10.                 <a href="{{ path('app_front_produit_detail', { 'name': produit.name }) }}">
  11.                     {{ produit.title }}
  12.                     {{ produit.accroche }}
  13.                     <img class="b-imgtxt__img" src="{{ asset('uploads/medias/' ~ produit.media.path)| imagine_filter('bloc_text_image') }}" alt="">
  14.                     {{ produit.prixHtDivise }}
  15.                     {{ produit.produitEtat }}
  16.                 </a>
  17.             </div>
  18.         {% endif %}
  19.     {% endfor %} #}
  21.     <main class="container">
  22.         <div class="row py-4">
  24.             <aside class="col-3">
  25.                 <div class="card p-2">
  27.                     <label class="h3">Filtres</label>
  28.                     <select class="form-select mb-2" aria-label="Default select example">
  29.                         <option selected>Coach</option>
  30.                         <option value="1">One</option>
  31.                         <option value="2">Two</option>
  32.                         <option value="3">Three</option>
  33.                     </select>
  34.                     <select class="form-select mb-2" aria-label="Default select example">
  35.                         <option selected>Skills</option>
  36.                         <option value="1">One</option>
  37.                         <option value="2">Two</option>
  38.                         <option value="3">Three</option>
  39.                     </select>
  40.                     <select class="form-select mb-2" aria-label="Default select example">
  41.                         <option selected>Date</option>
  42.                         <option value="1">One</option>
  43.                         <option value="2">Two</option>
  44.                         <option value="3">Three</option>
  45.                     </select>
  46.                     <select class="form-select mb-2" aria-label="Default select example">
  47.                         <option selected>Durée</option>
  48.                         <option value="1">One</option>
  49.                         <option value="2">Two</option>
  50.                         <option value="3">Three</option>
  51.                     </select>
  53.                     <a href="#" class="btn btn-primary"><span class="fas fa-filter"></span> Filtrer</a>
  54.                 </div>
  55.             </aside>
  57.             <section class="col-9">
  58.                 <div class="d-flex">
  60.                     <h1 class="fs-4">15 cours pour «speedrun»</h1>
  62.                     <div class="ms-auto me-4">
  63.                         <select class="form-select" aria-label="Default select example">
  64.                             <option selected>Trier par</option>
  65.                             <option value="1">One</option>
  66.                             <option value="2">Two</option>
  67.                             <option value="3">Three</option>
  68.                         </select>
  69.                     </div>
  71.                     <ul class="pagination">
  72.                         <li class="page-item active" aria-current="page">
  73.                             <span class="page-link">1</span>
  74.                         </li>
  75.                         <li class="page-item"><a class="page-link" href="#">2</a></li>
  76.                         <li class="page-item"><a class="page-link" href="#">3</a></li>
  77.                     </ul>
  79.                 </div>
  81.                 <div class="row">
  82.                             
  83.                     {% for cour in cours %}
  84.                         <div class="col-4 mb-4">
  85.                             <a class="text-decoration-none text-black card h-100" href="{{ path('app_front_cours_detail', { 'name': cour.name }) }}">
  86.                                 <img class="card-img-top" alt="…" src="{{ asset('uploads/medias/' ~ cour.media)| imagine_filter('img_listing_produit') }}">
  87.                                 <div class="card-body h-100">
  88.                                     <h5 class="card-title">{{ cour.title }}</h5>
  89.                                     <span class="badge bg-secondary mb-2">{{ cour.duree }} mn</span>
  90.                                     <p class="card-text">{{ cour.accroche }}</p>
  92.                                     <div class="m-2">
  93.                                         {% for skill in cour.skills %}
  94.                                             {% if loop.index is odd %}
  95.                                                 <span class="badge bg-secondary">{{ skill.title }}</span>
  96.                                             {% else %}
  97.                                                 <span class="badge bg-primary">{{ skill.title }}</span>
  98.                                             {% endif %}
  99.                                         {% endfor %}
  100.                                     </div>
  101.                                 </div>
  102.                                 <div class="d-flex justify-content-between align-items-center card-footer">
  103.                                     <p class="btn btn-primary">{{ cour.prixHtDivise }} €</p>
  104.                                 </div>
  105.                             </a>
  106.                         </div>
  107.                     {% endfor %}
  109.                 </div>
  110.                 <div class="d-flex">
  111.                     <ul class="pagination ms-auto">
  112.                         <li class="page-item active" aria-current="page">
  113.                             <span class="page-link">1</span>
  114.                         </li>
  115.                         <li class="page-item"><a class="page-link" href="#">2</a></li>
  116.                         <li class="page-item"><a class="page-link" href="#">3</a></li>
  117.                     </ul>
  118.                 </div>
  119.             </section>
  120.         </div>
  121.     </main>
  123. {% endblock %}