<div class="col-12 mt-3 mb-2 ml-2"> <i class="fa-light fa-thumbs-up fa-2x gris_999"></i> <span class="fs13 gris_999">Articles les plus lus cette semaine</span></div>{% if articles_plus_lus is defined and articles_plus_lus|length > 0 %} {% for article in articles_plus_lus|slice(0, 4) %} <div class="col-12 col-md-3 no-padding-x pt-3 pt-md-0"> <article class="card no_shadow no_border"> <div class="card-body bkg_gris_clair"> <div class="row align-items-center"> <div class="col-3 text-center"> {% if loop.index == 1 %} <i class="fa-sharp fa-light fa-circle-1 icon-responsive gris_999" aria-hidden="true"></i> {% elseif loop.index == 2 %} <i class="fa-sharp fa-light fa-circle-2 icon-responsive gris_999" aria-hidden="true"></i> {% elseif loop.index == 3 %} <i class="fa-sharp fa-light fa-circle-3 icon-responsive gris_999" aria-hidden="true"></i> {% elseif loop.index == 4 %} <i class="fa-sharp fa-light fa-circle-4 icon-responsive gris_999" aria-hidden="true"></i> {% endif %} </div> <div class="col-9 text-center"> <a href="{{ path('buzz_actualite_detail', { 'slug': article.titreActualite|slugify, 'id': article.id_actualite, 'codePays': codePaysWithUnderScore }) }}" title="{{ article.titreActualite }}" target="_self"> <img src="{{ article.imgAffichageEnError|default('https://photos.fusacq.com/photos_actualite/SA/70204.jpg') }}" class="img-fluid border_40" alt="{{ article.titreActualite }}" loading="lazy"> </a> </div> <div class="col-12 mt-1"> <a href="{{ path('buzz_actualite_detail', { 'slug': article.titreActualite|slugify, 'id': article.id_actualite, 'codePays': codePaysWithUnderScore }) }}" title="{{ article.titreActualite }}" target="_self"> <span class="{{ article.css_class|default('bleu_fusacq') }} article-title-size">{{ article.titreActualite }}</span> </a> </div> </div> </div> </article> </div> {% endfor %}{% endif %}