{% for key, product in products %}
<div class="product {{ (sliderProduct is defined and sliderProduct) ? 'pax-15' : 'col-md-4 col-sm-6 col-10' }} text-center mab-40 ">
<div class="bgc-white pax-20-lg pax-18 pat-20 pab-30 animate-link3" data-link>
<div class="d-flex he-50 justify-content-center-sm">
{% for key, phaseEvolution in getProductPhaseEvolutions(product) %}
{% set phaseEvolutionFile = getPhaseEvolutionFile(phaseEvolution, product) %}
{% if phaseEvolutionFile %}
<div class="mar-3 position-relative">
<img src="{{ asset('assets/img/hexagone-big.svg') }}" alt="hexagone"
class="he-50 {{ categoryActive.position == "1" ? "hexagone-green" : (categoryActive.position == "2" ? "hexagone-lightBlue") }}"/>
<img src="{{ phaseEvolutionFile }}"
alt="{{ phaseEvolution.title }}"
class="img-white position-absolute mawi-27 t-0 b-0 h-auto l-0 r-0 m-auto img-white"/>
</div>
{% endif %}
{% endfor %}
</div>
<div class="mab-40-sm mab-15 he-180 mawi-180 mx-auto div-img pax-0">
<img src="{{ asset(vich_uploader_asset(product, 'product1File'))|imagine_filter('medium') }}"
alt="{{ product.title }}" class="imgProduct"/>
</div>
<h4 class="fs-22 fw-600 c-204A9A aiwsyn">
<a href="{{ getProductUrl(product) }}" class="c-204A9A c-204A9A-h">
{{ product.title }}
</a>
</h4>
<div class="pax-10 pay-5 br-8 ls-custom4 text-uppercase mx-auto d-table fs-11 c-white fw-600 may-14 {{ product.isHardware ? "bgc-648EFB" : "bgc-22E0BD" }}">
{{ product.isHardware ? "hardware.title"|trans : "software.title"|trans }}
</div>
<div class="c-8E9094 lh2-19 fs-14 dpfhdx">
{{ product.intro|length > 50 ? product.intro|slice(0, 50) ~ '...' : product.intro }}
</div>
{# <div>
Voir
</div> #}
</div>
</div>
{% endfor %}