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

{% block title %}Accueil
{% endblock %}
{% block stylesheets %}
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css"/>
{% endblock %}

{% block body %}
	<div class="container">
		{{ form(form) }}

			{% for annonce in annonces %}
				<div class="grix xs2 sm3 gutter-0 card">
					<div class="primary flex vcenter fx-center">
						<img src="{{ ('uploads/images/annonces/offres' ~ annonce.images[0].name)|imagine_filter('square') }}" alt="{{ annonce.title }}">
					</div>
					<div class="col-sm2">
						<div class="card-header">
							<a href="{{ path('offer_detail', {slug: annonce.slug})}}">{{ annonce.title }}</a>
						</div>
						<div class="card-content">
							<p>Catégorie :
								{{ annonce.categories.name }}</p>
							<p>
								{{ annonce.content|striptags|u.truncate(50, '...') }}
							</p>
							<div class="txt-red">
								{% if is_granted("ROLE_USER") %}
									{% set isFavorite = false %}
									{% for favoris in annonce.favoris %}
										{% if favoris.id == app.user.id %}
											{% set isFavorite = true %}
										{% endif %}
									{% endfor %}
									{% if isFavorite %}
										<a href="{{ path('annonces_retrait_favoris', {id: annonce.id}) }}">
											<i class="fas fa-heart"></i>
										</a>
									{% else %}
										<a href="{{ path('annonces_ajout_favoris', {id: annonce.id}) }}">
											<i class="far fa-heart"></i>
										</a>
									{% endif %}

								{% else %}
									<i class="far fa-heart"></i>
								{% endif %}

							</div>
						</div>
					</div>
				</div>
			{% endfor %}
		</div>
	{% endblock %}