{% import "macros.html" as macros %}
<!doctype html>
<html lang="fr">
	<head>
		<meta charset="utf-8"/>
		<title>{% block title %}{% endblock title %}</title>
		<link rel="stylesheet" href="/css/base.css"/>
		{% if page.extra.leaflet or section.extra.leaflet %}<link rel="stylesheet" href="/vendor/leaflet/leaflet.css"/>{% endif %}
		<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"/>
		<meta name="viewport" content="width=device-width"/>
		{% if get_env(name="LIBREZO_WEBSITE", default="prod") == "dev" %}<meta name="robots" content="noindex,nofollow"/>{% endif %}
		{% block head %}{% endblock head %}
	</head>
	<body>
		{% if get_env(name="LIBREZO_WEBSITE", default="prod") == "dev" %}
		<div id="dev-warning">
			<p>
				Version de développement. Pour le site officiel actuel, allez sur <a href="https://librezo.fr"><b>Librezo.fr</b></a>.
			</p>
			<a href="#" onclick="document.getElementById('dev-warning').remove()">fermer</a>
		</div>
		{% endif %}
		<header>
			<a href="/">
				<picture>
					<source srcset="/img/logo-stencil-white.svg" media="(prefers-color-scheme: dark)"/>
					<source srcset="/img/logo-stencil-black.svg" media="(prefers-color-scheme: light)"/>
					<img decoding="async" id="header-logo" src="/img/logo-stencil-black.svg" alt="Librezo" aria-hidden/>
				</picture>
				<h1 class="sr-only">Librezo</h1>
			</a>
			<nav id="header-menu">
				<ul class="phone-hidden">
					<li><a href="/fonctionnement/">Fonctionnement</a></li>
					<li><a href="/services/">Services et tarifs</a></li>
					<li><a href="/qui-sommes-nous/">Qui sommes-nous</a></li>
					<li><a href="/charte/">Charte</a></li>
					<li><a href="/contact/">Contact</a></li>
				</ul>
				
				<details class="phone-only hamburger-menu">
					<summary aria-label="Menu" title="Menu">&#9776;</summary>
					<ul class="header-menu-phone">
						<li><a href="/fonctionnement/">Fonctionnement</a></li>
						<li><a href="/services/">Services et tarifs</a></li>
						<li><a href="/qui-sommes-nous/">Qui sommes-nous</a></li>
						<li><a href="/charte/">Charte</a></li>
						<li><a href="/contact/">Contact</a></li>
					</ul>
				</details>
			</nav>
		</header>
		{% block body %}{% endblock body %}
		<footer>
			<div class="footer-wrapper">
				<div class="footer-pane">
					<a href="/contact" class="footer-bigger">Contactez-nous</a>
					<ul>
						<li><a href="mailto:contact@librezo.fr">contact@librezo.fr</a></li>
						<li><a href="/rejoignez-nous">Rejoignez-nous</a></li>
					</ul>
				</div>
				<div class="footer-pane">
					<ul>
						<li><a href="/mentions-legales">Mentions légales</a></li>
						<li><a href="/rgpd">RGPD</a></li>
					</ul>
					<p>
						<a href="https://git.txmn.tk/Librezo/website">Code source du site</a> sous licence <a href="http://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC BY-SA 4.0</a><br/>
						Dessins de GRA, licence <a href="http://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC BY-SA 4.0</a><br/>
						Site conçu sans IA ;)
					</p>
				</div>
				<div class="footer-pane">
					<p>
						Librezo propose une alternative aux services en ligne en favorisant l'auto-hébergement. Avec un accompagnement sur mesure et des <a href="/logiciel-libre">solutions logicielles libres</a> installées sur votre serveur, reprendre et garder le contrôle de vos données n'a jamais été aussi facile.
					</p>
				</div>
			</div>
		</footer>
		{% if page.extra.carousel or section.extra.carousel %}<script type="text/javascript" src="/js/carousel.js"></script>{% endif %}
	</body>
</html>