{% import "macros.html" as macros %}
<!DOCTYPE html>
<html lang="cs">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>{% block title %}{{ config.title }}{% endblock %}</title>
	<link rel="stylesheet" type="text/css" href="{{ get_url(path="/style.css") }}">
	<link rel="stylesheet" type="text/css" href="{{ get_url(path="/icons/remixicon-4.0.0.css") }}">
</head>
<body>
	<nav>
		<div class="wrap">
			<a href="{{ config.base_url }}"><img src="{{ get_url(path="/img/logo.svg") }}" class="logo"></a>
			<ul>
				{{ macros::nav_items() }}
			</ul>
			<div id="mobile-nav-button"></div>
		</div>
		<div class="mobile-nav">
			<ul>
				{{ macros::nav_items() }}
			</ul>
		</div>
	</nav>

	{% block content %}
	{% endblock %}

	<footer>
		<p>&copy; {{ now() | date(format="%Y") }} {{ config.title }}</p>
	</footer>

	{% block script %}
	{% endblock %}
	<script>
		document.querySelector("#mobile-nav-button").addEventListener("click", function() {
			document.body.classList.toggle("mobile-nav-open");
		});
	</script>
</body>
</html>

