{% extends 'frontend/layout.html.twig' %}

{% block content %}
	<div class="container single-template">


		<div class="page-header">
			<h1 class="page-title">
				{{event.title}}
			</h1>
		</div>
		<div class="post-meta">
			<span class="date">{{event.lieu}}</span>
			<span class="mx-1">•</span>
			<span>{{event.date | date('d/m/Y')}}</span>
			<br>
		</div>

		<div class="container aos-init aos-animate" data-aos="fade-up">
			<div class="row g-5">
				<div class="col-lg-10">
					<img src="{{ asset('dist/img/events/') }}{{event.photo}}" alt="" class="img-fluid">

					<br>
					<br>

					{{event.contenu | raw}}
				</div>

				<div class="col-lg-2">

					<div class="template-details">
						<h2>Voir plus
						</h2>
					</div>

					{% for i in 0..4 %}
						{% if events|length > i %}
							<div class="col-lg-12" style="margin-bottom: 15px;">
								<div class="post-entry-1">
									<a href="{{ path('evenement', { 'id': events[i].id }) }}"><img src="{{ asset('dist/img/events/') }}{{events[i].photo}}" alt="" class="img-fluid" style="max-width: 100%;height: auto;"></a>
									<div class="post-meta">
										<span class="date">{{events[i].lieu}}</span>
										<span class="mx-1">•</span>
										<span>{{events[i].date | date('d/m/Y')}}</span>
									</div>
									<h2 style="font-size: 14px; padding: 0; margin: 0; color: #023b6d;">
										<a href="{{ path('evenement', { 'id': events[i].id }) }}">{{events[i].title}}</a>
									</h2>
								</div>
							</div>
						{% endif %}
					{% endfor %}

				</div>
			</div>
		</div>

	</div>
{% endblock %}