{% extends "base.html" %}

{% block title %}{{ '| '+ title }}{% endblock %}

{% block content %}
<div id="main-wrapper">
	{% include '_nav.html' %}
	{% include '_list-header.html'%}
	<div id="main-container">
		<div id="list-info-container">
			{% if title == 'Conferences'%}
				<p id="list-info-text">Beta’s conference of discussions and workshops will return this year including keynotes from Abeba Birhane and Kay Watson with the full programme due to be announced and tickets available from mid September.</p>
			{% endif %}

			{% if title == 'Events'%}
				<p class="list-info-text">Beta Festival will feature a variety of performances, workshops and discussions as part of this year's programme including collaborations with D.A.T.A., Base, Fire Station Artists Studios, Creative Futures Academy and Creative Sparks Fab Lab.</p>
				<p class="list-info-text">We will also present Noire, the Cannes award-winning immersive experience directed by Stéphane Foenkinos and Pierre-Alain Giraud, based on the work by Tania de Montaigne, produced by Novaya in partnership with the Centre Pompidou, co-produced with Flash Forward Entertainment (Taiwan).</p>			
			{% endif %}

			{% if title == 'Exhibitions' %}
				{% include '_ex.html' %}
			{% endif %}
		</div>

		

		{% if title == 'Conferences' or title == 'Events'%}
		<div id="list-container" class="fadeInUp-animation">
		
			{% for event in content %}
			<a href='/{{ title.lower() }}/{{ event.title }}'>
			<div class="list">
				<div class="list-image">
					<img src="{{ event.image }}" alt="{{ event.title }}" loading="lazy">
					<div class="list-image-overlay"></div>
				</div>
				<div class="list-title">{{ event.title }}</div>
				<div class="list-artists">
					<p>{{ event.artists | join(', ') }}</p>
				</div>
				<div class="list-details">
					{% if event.dates %}
					<div class="list-date">● {{ event.dates | join(', ') }}</div>
					{% endif %}
					{% if event.times %}
					<div class="list-date">● {{ event.times | join(', ')}}</div>
					{% endif %}
					
					<div class="list-date">● {{ event.location[0] }}</div>
				</div>
			</div>
			</a>
			{% endfor %}
			</div>
		{% endif %}
	</div>
</div>
<div id="container"></div>
<script type="module" src="{{ url_for('static', filename='js/list.js') }}"></script>
<script type="module" src="{{ url_for('static', filename='js/skybox.js') }}"></script>
{% endblock content %}