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

{% block title %}
{{ event.title }} - Évènements
{% endblock %}

{% block body %}
	<div class="event-view container">
		{% include 'base/_partials/_breadcrumb.html.twig' with { entityUrl: "evenements", entityLabel: "Évènements", categoryUrl: event.eventCategory.slug, categoryLabel: event.eventCategory.title, slugUrl: event.slug, slugLabel: event.title } %}
		<div class="header">
			<picture>
				<img src="{{ event.cover }}" alt="{{ event.title }}"/>
			</picture>
			<h1>{{ event.title }}</h1>
		</div>
		<div class="meta">
			<div class="date">
				<div>
					<span>Date de début</span>
					{{ event.start|format_date('none','d MMMM Y') }}<br>{{ event.start|format_date('none','kk ss')|replace({' ':'h'}) }}</div>
				{% if event.end %}
					<div>
						<span>Date de fin</span>
						{{ event.end|format_date('none','d MMMM Y') }}<br>{{ event.end|format_date('none','kk ss')|replace({' ':'h'}) }}</div>
				{% endif %}
			</div>
			{% if event.place %}
				<div class="place">
					<span>Lieu</span>
					{{ event.place|raw }}</div>
			{% endif %}
		</div>
		<div class="btns">
			{% if event.link %}
			<a href="{{ event.link }}" class="btn is-s is-primary is-event-link is-anim-s"><span>Lien de l'évènement</span> {{ svg('images/base/arrow_white.svg') }}</a>
			{% endif %}
			<a  {{ event.calOptions|raw }} class="btn is-s is-secondary is-event-link is-anim-s"><span>Ajouter au calendrier</span> {{ svg('images/base/arrow_white.svg') }}</a>
		</div>
		
		<article class="{% if event.menuLink %}has-sidebar{% endif %}">
			<div class="base-content content-main">
				{{ event.content|raw }}
		{% if event.quoteCategory %}
			{% include 'base/_partials/_quotes.html.twig' with {quoteCategory: event.quoteCategory} %}
		{% endif %}
			</div>
			{% if event.menuLink %}
				{% include 'base/_partials/_sidebar_menulink.html.twig' with {menuLink: event.menuLink} %}
			{% endif %}
		</article>
		<div class="flex">{% include 'base/_share.html.twig'  %}</div>
		{% include 'base/_partials/_readmore.html.twig' with { entity: event } %}

	</div>
{% endblock %}