{% extends 'base.html.twig' %}

{% block carousel %}{% endblock %}
  

{% block content %}

<h1>Nos meilleurs ventes</h1>
<p>Découvrez les articles les plus vendus.</p>
 <div class="row">
      {% for product in products %}
        <div class="col-md-3">
          {% include 'product/single_product.html.twig' %}
        </div>
      {% endfor %}
    </div><!-- /.row -->


    <!-- START THE FEATURETTES -->

    <hr class="featurette-divider">

    <div class="row featurette">
      <div class="col-md-7">
        <h2 class="featurette-heading fw-normal lh-1">Une équipe de professionnels <span class="text-muted">au grand savoir-faire</span></h2>
        <p class="lead">Some great placeholder content for the first featurette here. Imagine some exciting prose here.</p>
      </div>
      <div class="col-md-5">
          <img src="{{ asset('assets/img/first.jpg') }}" alt="Un savoir faire Français">
        </div>
    </div>

    <hr class="featurette-divider">

    <div class="row featurette">
      <div class="col-md-7 order-md-2">
        <h2 class="featurette-heading fw-normal lh-1">Venez à notre rencontre dans nos différentes<span class="text-muted">boutique en France.</span></h2>
        <p class="lead">Another featurette? Of course. More placeholder content here to give you an idea of how this layout would work with some actual real-world content in place.</p>
      </div>
      <div class="col-md-5 order-md-1">
          <img src="{{ asset('assets/img/second.jpg') }}" alt="Un savoir faire Français">
         </div>
    </div>

{% endblock %}