{% extends "base.twig" %}

{% block header %}
	<header>

		<div class="logo">
			<a class="logo__link logo--fixed-right" href="{{ homePage.url }}" target="_self" aria-label="Go to {{ site.title }}'s gallery 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:currentColor;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:currentColor;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>

		<div class="sidebar sidebar--fixed">
			<nav class="sidebar__nav" aria-label="Menu">
				{% if exhibitions is not empty %}
					<ul class="sidebar__nav-menu">
						{% for exhibition in exhibitions %}
								<li class="sidebar__nav-item">
									{% if exhibition.external_link == 'false' %}
										<a class="sidebar__nav-link sidebar__nav-link--iframe" href="{{ exhibition.url }}" target="exhibition" data-background="{{ exhibition.background_color }}">{{ exhibition.title }}</a>
									{% else %}
										<a class="sidebar__nav-link sidebar__nav-link--blank" href="{{ exhibition.url }}" target="_blank">{{ exhibition.title }}</a>
									{% endif %}
								</li>
						{% endfor %}
					</ul>
				{% endif %}
			</nav>
			<div class="sidebar__social">
				<a class="sidebar__social-link" href="{{ instagram }}" target="_blank" aria-label="Go to {{ site.title }}'s Instagram profile">
					<svg class="sidebar__instagram-icon" aria-hidden="true" viewBox="0 0 128 128" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
						<path d="M 128 0 L 0 0 L 0 128 L 128 128 L 128 0 Z M 119.874 119.874 L 8.126 119.874 L 8.126 8.126 L 119.874 8.126 L 119.874 119.874 Z"/>
						<path d="M64,93c16,0,29-13,29-29S80,35,64,35S35,48,35,64S48,93,64,93z M64,43c11.6,0,21,9.4,21,21s-9.4,21-21,21s-21-9.4-21-21 S52.4,43,64,43z"/>
						<rect height="10" width="10" x="98" y="20"/>
					</svg>
				</a>
				<a class="sidebar__social-link" href="mailto:{{ email }}" target="_blank" aria-label="Write an email to {{ site.title }}">
					<svg class="sidebar__email-icon" aria-hidden="true" viewBox="0 0 48 48" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
						<path d="M 0 48 L 0 0 L 48 0 L 48 48 L 0 48 Z M 24 24.35 L 3.1 7.126 L 3.1 44.5 L 44.9 44.5 L 44.9 7.126 L 24 24.35 Z M 24 20.35 L 44.9 3.5 L 3.1 3.5 L 24 20.35 Z M 3.1 7.126 L 3.1 3.5 L 3.1 7.126 Z"/>
					</svg>
				</a>
			</div>
		</div>

	</header>
{% endblock %}

{% block main %}
	<main>

		<section class="exhibition-section">

			<iframe class="exhibition" name="exhibition" src=""></iframe>

		</section>

	</main>
{% endblock %}