{% extends "base.twig" %}

{% block header %}
	<header>

		<div class="logo">
			<a class="logo__link" href="{{ exhibitionsPage.url }}" target="_self" aria-label="Go to {{ site.title }}'s exhibitions page">
				<svg class="logo__icon" aria-hidden="true" viewBox="0 0 3814 1912" xmlns="http://www.w3.org/2000/svg">
					<g transform="matrix(1, 0, 0, -1, 1426.537109, 1153.771606)">
						<path style="fill:none;stroke-width:93.54299927;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m 0,0 c -290.833,17.312 -697.633,-243.443 -961.355,-441.732 -463.22,-348.289 -491.716,-401.405 -327.464,98.265 42.11,128.104 133.935,713.436 134.825,1065.798 1.49,589.899 147.634,423.095 319.826,16.386 C -107.247,-978.225 558.099,-596.729 789.55,-160.404 800.123,-140.473 836,-55 836,-55 c 0,0 25.705,-95.875 94.192,-196.312 C 1081.909,-473.805 1640,-308 1770,-260 c 53.364,19.704 261,-145 571,-221"/>
						<path style="fill:none;stroke-width:8.50399971;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" d="m 0,0 c -290.833,17.312 -697.633,-243.443 -961.355,-441.732 -463.22,-348.289 -491.716,-401.405 -327.464,98.265 42.11,128.104 133.935,713.436 134.825,1065.798 1.49,589.899 147.634,423.095 319.826,16.386 C -107.247,-978.225 558.099,-596.729 789.55,-160.404 800.123,-140.473 836,-55 836,-55 c 0,0 25.705,-95.875 94.192,-196.312 C 1081.909,-473.805 1640,-308 1770,-260 c 53.364,19.704 261,-145 571,-221"/>
					</g>
				</svg>
			</a>
		</div>

	</header>
{% endblock %}

{% block main %}

	<section class="splide" aria-label="{{ site.title }}'s artwork gallery">

		<div class="splide__track">
			<ul class="splide__list">
				{% for image in images %}
					<li class="splide__slide" data-logo-color="{{ image.logo_color }}">
						<img class="splide__image" src="{{ image.url }}" srcset="{{ image.srcset() }}" alt="{{ image.alt_text }}">
					</li>
				{% endfor %}
			</ul>
		</div>
		
	</section>

{% endblock %}