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

{% block title %}Édition des Articles{% endblock %}

{% block menu %}Gestion des articles{% endblock %}

{% block stylesheets %}
	<link href="../../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link href="../../css/clean-blog.min.css" rel="stylesheet">
	<link href="../../vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
	<style>
		body {background-color: #18BFDE;}
	</style>
{% endblock %}

{% block body %}
	<div class="row">
        {# messages d'information #}
        {% for message in app.flashes('success') %}
            <div class="alert alert-success">
                {{ message }}
            </div>
        {% endfor %}
    </div>
    <div class="jumbotron">
		<div class="container">
		  {{ form_start(form) }}
		  <div class="form-row">
		    <div class="col">
		      {{ form_row(form.category) }}
		    </div>
		    <div class="col">
		      <button class="btn btn-primary">Rechercher</button>
		    </div>
		  </div>
		  {{ form_end(form) }}
		</div>
  	</div>
	{% if posts.getTotalItemCount == 0 %}
		<div class="jumbotron text-center">Aucun article publié</div>
	{% else %}
		<div><h1>Liste des articles</h1></div>
	{% endif %}

	<div class="row flex">
		{% for post in posts %}
			<div class="col-md-3">
				<div class="card">
					<div class="card-body">
						<div class="card-title"><a href="{{ path('post_show', {slug: post.slug, id: post.id})}}"><h4>{{ post.title }}</h4></a></div>
						<img src="{{ vich_uploader_asset(post.mainpicture, 'imageFile') | imagine_filter('thumb') }}" class="card-img-top" style="width: 100%; height: auto;">
					</div>
					<div class="card-footer">Créé le {{ post.created_at | localizeddate('none', 'none', null, null, 'EEEE d MMMM Y')}} </div>
				</div>
			</div>
		{% endfor %}
	</div>
	<div class="pagination">
		{{ knp_pagination_render(posts)}}
	</div>
	{% if is_granted('ROLE_ADMIN') %}
		<div class="btn btn-success col-md-3 offset-md-9">
			<a href="{{ path('post_new') }}">Créer un nouvel article</a>
		</div>
	{% endif %}
{% endblock %}

{% block javascripts %}
  <!-- Contact Form JavaScript -->
  <script src="../../js/jqBootstrapValidation.js"></script>
  <!-- Custom scripts for this template -->
  <script src="../../js/clean-blog.min.js"></script>
{% endblock %}