<div class="div-search-product">
<h4> Articles Récents</h4>
{#
<div class="div-form-search">
<div class="search-title">
<span>RECHERCHER PAR</span>
</div>
<div class="trait divider"></div>
<form method="POST" class="form-search-product">
<div class="div-label-input-search">
<label for="category">Categories</label>
<select name="category" id="category">
<option value="">Tous</option>
<option value="voiture">Voiture</option>
<option value="moto">Moto</option>
<option value="camion">Camion</option>
<option value="bateau">Bateau</option>
<option value="avion">Avion</option>
</select>
</div>
<div class="div-label-input-search">
<label for="brand">Marque :</label>
<select name="brand" id="brand">
<option value="">-- Sélectionner une marque --</option>
<option value="ford">Ford</option>
<option value="toyota">Toyota</option>
<option value="bmw">BMW</option>
<option value="honda">Honda</option>
<option value="nissan">Nissan</option>
</select>
</div>
<div class="div-label-input-search">
<label for="condition">Type d'occasion :</label>
<select name="condition" id="condition">
<option value="">-- Sélectionner un type d'occasion --</option>
<option value="neuf">Neuf</option>
<option value="occasion">Occasion</option>
<option value="certifie">Certifié</option>
<option value="reconditionne">Reconditionné</option>
<option value="garantie">Garanti</option>
</select>
</div>
<div class="div-label-input-search">
<label for="model">Modèle :</label>
<select name="model" id="model">
<option value="">-- Sélectionner un modèle --</option>
<option value="mustang">Mustang</option>
<option value="corolla">Corolla</option>
<option value="serie3">Série 3</option>
<option value="civic">Civic</option>
<option value="sentra">Sentra</option>
</select>
</div>
<div class="div-button-submit-search">
<button type="submit" class="ui button" id="button-submit-search">Rechercher</button>
</div>
</form>
</div>
#}
<div class="divider-evenement"></div>
{{ render(url('sylius_shop_partial_product_index_latest', {'count': 6, 'template': '@SyliusShop/Homepage/_list.html.twig'})) }}
</div>
<style>
/*.form-search-product{*/
/* display: flex;*/
/* flex-direction: row;*/
/* justify-content: space-between;*/
/* align-items: end;*/
/* height: fit-content;*/
/*}*/
/*!*.div-search-product{*!*/
/*!* margin-top: 4rem;*!*/
/*!*}*!*/
/*.div-search-product h4, #div-service h2{*/
/* font-size: var(--lg-fz);*/
/* font-weight: bold;*/
/* text-transform: uppercase;*/
/* color: black;*/
/* position: relative;*/
/* width: fit-content;*/
/* padding: 1.5rem 0 !important;*/
/* margin-bottom: 0 !important;*/
/* margin-top: 4rem;*/
/* margin-left: auto;*/
/* margin-right: auto;*/
/*}*/
/*!*I want a before after to make a border in the left 50% bottom of #div-collection h2*!*/
/*.div-search-product h4::before,#div-service h2::before,*/
/*.div-search-product h4::after, #div-service h2::after*/
/*{*/
/* content: "";*/
/* position: absolute;*/
/* width: 50%;*/
/* height: 5px;*/
/* background-color: #E35E31;*/
/* bottom: 0;*/
/* left: 25%;*/
/*}*/
/*.div-form-search{*/
/* !*height: 300px;*!*/
/* width: 100%;*/
/* background-color: black;*/
/* padding: 2rem 3rem 3rem 3rem;*/
/* margin: 4rem 0;*/
/*}*/
/*.search-title{*/
/* width: 100%;*/
/* color: white;*/
/* font-size: var(--sm-fz);*/
/*}*/
/*.div-label-input-search{*/
/* display: flex;*/
/* flex-direction: column;*/
/* justify-content: center;*/
/* align-items: start;*/
/* color: white;*/
/* gap: 1rem;*/
/*}*/
/*.div-label-input-search label{*/
/* font-size: var(--sm-fz) - 0.2rem;*/
/* font-weight: bold;padding-left: 0.5rem;*/
/*}*/
/*.trait.divider{*/
/* width: 100%;*/
/* height: 1px;*/
/* background-color: white;*/
/* margin: 1rem 0;*/
/* opacity: 0.3;*/
/*}*/
/*.div-label-input-search select{*/
/* width: 270px;*/
/* height: 50px;*/
/* border: none;*/
/* padding: 1rem;*/
/*}*/
/*#button-submit-search{*/
/* padding: 1rem;*/
/* background-color: #E35E31;*/
/* color: white;*/
/* border-radius: 0;*/
/* height: 50px;*/
/*}*/
/*.div-button-submit-search{*/
/* display: flex;*/
/* !*justify-content: center;*!*/
/* align-items: end;*/
/* height: 100%;*/
/*}*/
/*.divider-evenement {*/
/* width: 100%;*/
/* height: 4rem;*/
/* background-color: transparent;*/
/*}*/
</style>