{% 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 festival_general_info %}
				{% if title == 'Conferences'%}
					{{ festival_general_info.textConference | safe }}
				{% endif %}

				{% if title == 'Events'%}
					{{ festival_general_info.textEvent | safe }}
				{% endif %}

				{% if title == 'Exhibitions' %}
					{% for ex in exhibition_info %}
					<div class="exh-container">
						<a href="exhibitions/{{	ex.url }}"><h1>{{ ex.title }}</h1></a>
							{{ ex.description | safe }}
						<div class="exh-info">
							<p>Date: {{ ex.start_date }} -> {{ ex.end_date }}</p>
							<p>Location: {{ ex.location }}</p>
						</div>
					</div>
					{% endfor %}
				{% endif %}
			{% 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 %}