{% extends 'base.html.twig' %}
{% block title %}Accueil{% endblock %}
{% block main %}
<section class="hero mb-4" style="background-image: url(https://picsum.photos/1920/600);">
<div class="container p-5">
<h1 class="text-center text-white mb-5" style="text-shadow:0 0 1em black;">VEEKiNG<br>eSport marketplace</h1>
<div class="row">
<div class="col">
<select class="form-select" aria-label="Default select example">
<option selected>Critère principal</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
<div class="col">
<select class="form-select" aria-label="Default select example">
<option selected>Critère secondaire</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
<div class="col">
<button type="button" class="btn btn-secondary w-100">Rechercher</button>
</div>
</div>
</div>
</section>
<section class="container mb-4">
<div class="row gx-5">
<div class="col-md-4">
<div class="card h-100">
<div class="card-header" style="height:230px;">
<a href="#" class="btn btn-outline-primary w-100 mb-1">Cours en ligne</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Coach sportif</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Diététicien</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Accompagner les parents</a>
</div>
<div class="card-body">
<h5 class="card-title">Progression</h5>
<p class="card-text">Améliorer sa performance à travers des cours techniques, physiques et de
préparation mentale.Impeliquos a volo vero omniae raturem exped estio</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card h-100">
<div class="card-header" style="height:230px;">
<a href="#" class="btn btn-outline-primary w-100 mb-1">Achat / Vente</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Accessoires</a>
<div class="btn-group mb-1 w-100" role="group" aria-label="Basic example">
<a href="#" class="btn btn-outline-primary col">Neuf</a>
<a href="#" class="btn btn-outline-primary col">Occasion</a>
<a href="#" class="btn btn-outline-primary col">Reconditionné</a>
</div>
</div>
<div class="card-body">
<h5 class="card-title">Matériel</h5>
<p class="card-text">Changer ou personnaliser son espace de jeu avec du matériel neuf, d’occasion ou
reconditionné.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card h-100">
<div class="card-header" style="height:230px;">
<a href="#" class="btn btn-outline-primary w-100 mb-1">Les ateliers de la rentrée</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Prochains événements</a>
<a href="#" class="btn btn-outline-primary w-100 mb-1">Proposer un événement</a>
</div>
<div class="card-body">
<h5 class="card-title">Evenementiel</h5>
<p class="card-text">Anniversaire, EVG/EVJ, séminaires, team building, manifestations culturelles...
autour du Esport.</p>
</div>
</div>
</div>
</div>
</section>
{% set evenement = evenement[0] %}
<section class="bg-light">
<div class="container pt-5">
<h2>Prochaine évenement</h2>
<div class="row p-5">
<img src="{{ asset('uploads/medias/' ~ evenement.media)| imagine_filter('img_listing_produit') }}" alt="" class="col-xl-6">
<div class="col-xl-6">
<div class="card h-100">
<div class="card-body">
<h3 class="card-title">{{ evenement.title }}</h3>
<p class="card-text">{{ evenement.accroche }}</p>
</div>
<div class="card-footer text-muted">
{% if evenement.publishedAt and evenement.unPublishedAt is not null %}
{% if evenement.publishedAtTime is not null and evenement.unPublishedAtTime is not null %}
{% include "front/boutique/evenements/include/evenement/_date_debut_date_fin_heure_debut_heure_fin.html.twig" with {'evenement': evenement} %}
{% else %}
{% include "front/boutique/evenements/include/evenement/_date_debut_date_fin.html.twig" with {'evenement': evenement} %}
{% endif %}
{% else %}
{% if evenement.unPublishedAtTime is null %}
{% include "front/boutique/evenements/include/evenement/_date_debut_heure_debut.html.twig" with {'evenement': evenement} %}
{% elseif evenement.publishedAtTime is not null and evenement.unPublishedAtTime is not null %}
{% include "front/boutique/evenements/include/evenement/_date_debut_heure_debut_heure_fin.html.twig" with {'evenement': evenement} %}
{% endif %}
{% endif %}
</div>
</div>
</div>
</div>
</div>
</section>
<section class="container pt-5">
<h2>Les bonnes affaires du moment</h2>
<div class="row p-5">
<div class="col">
<div class="card h-100">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p class="card-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</div>
{% for produit in produits %}
{% if produit.visible %}
<div class="col">
<div class="card h-100">
<img class="card-img-top" alt="…" src="{{ asset('uploads/medias/' ~ produit.media)| imagine_filter('img_listing_produit') }}">
<div class="card-body">
<h2 class="card-title fs-5">{{ produit.title }}</h2>
<p class="card-text">{{ produit.accroche }}</p>
</div>
<div class="card-footer text-muted">
<stroke>{{ produit.produitEtat }}</stroke>
<strong>{{ produit.prixHtDivise }} €</strong>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
</section>
<section class="bg-light">
<div class="container pt-5">
<h2>Coach mit en avant</h2>
<div class="row p-5">
<div class="col">
<div class="card h-100">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p class="card-text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</div>
{% for coach in coaches %}
<div class="col">
<div class="card h-100">
<img class="card-img-top" alt="…" src="{{ asset('uploads/medias/' ~ coach.imgProfil)| imagine_filter('img_listing_produit') }}">
<div class="card-body">
<h2 class="card-title fs-5">{{ coach.title }} {{ coach.prenom }} ({{ coach.pseudo }})</h2>
<p class="card-text">{{ coach.accroche }}</p>
</div>
<div class="card-footer text-muted">
Coach depuis le {{ coach.anciennetee|format_datetime('short', 'none', locale='fr') }}
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
<section class="container">
<div class="p-5">
<div class="row gx-2">
<div class="col-md-6">
<img class="w-100" src="https://picsum.photos/660?random=1" alt="">
</div>
<div class="col-md-6">
<div class="row gx-2 mb-2">
<div class="col-md-6">
<img class="w-100" src="https://picsum.photos/660?random=2" alt="">
</div>
<div class="col-md-6">
<img class="w-100" src="https://picsum.photos/660?random=3" alt="">
</div>
</div>
<div class="row gx-2">
<div class="col-md-6">
<img class="w-100" src="https://picsum.photos/660?random=4" alt="">
</div>
<div class="col-md-6">
<img class="w-100" src="https://picsum.photos/660?random=5" alt="">
</div>
</div>
</div>
</div>
</div>
</section>
{% endblock %}