{% set styles=[
    'https://fonts.googleapis.com/css2?family=Kanit',
    'https://fonts.googleapis.com/css2?family=Asap',
    'https://meyerweb.com/eric/tools/css/reset/reset.css',
    'https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css',
    baseUrl~'icofont/icofont.css',
    baseUrl~'styles/card.css',
    baseUrl~'styles/colors.css',
    baseUrl~'styles/form.css',
    baseUrl~'styles/main.css',
    baseUrl~'styles/nav.css',
    baseUrl~'styles/table.css',
]|merge(styles|default([])) %}

{% set scripts=[
    baseUrl~'scripts/ajaxForm.js',
]|merge(scripts|default([])) %}

{% set page=page|default('N/A') %}
{% set returnPath=returnPath|default([]) %}

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" lang="fr">
<title>Activity Manager{% if pageName is defined %} - {{ pageName }}{% endif %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% for style in styles %}
<link rel="stylesheet" href="{{ style }}">
{% endfor %}
{% for script in scripts %}
<script src="{{ script }}" defer></script>
{% endfor %}
</head>
<body>
	<nav>
		<p class="nav-category">Accueil</p>
		<li>{% include '_includes/html/component/navLink.html.twig' with {route: 'main_home', icon: 'icofont-home', name: 'Accueil'} %}</li>
		<p class="nav-category">Activités</p>
		<li>{% include '_includes/html/component/navLink.html.twig' with {route: 'activity_activities', icon: 'icofont-listing-box', name: 'Activités'} %}</li>
		<p class="nav-category">Environnement</p>
		<li>{% include '_includes/html/component/navLink.html.twig' with {route: 'actor_actors', icon: 'icofont-people', name: 'Acteurs'} %}
		</li>
	</nav>
	<header>
		<h1>
			{% for link in returnPath %}
			<a href="{{ link.url }}" title="{{ link.title|default('retour') }}">{{ link.label|default('retour') }}</a>
			/
			{% endfor %}
			{{ page }}
		</h1>
	</header>
	<div class="container">
		<div class="row">
			{% block pageContent %}
			{% endblock %}
		</div>
	</div>
	<div id="alert-area" class="alert-area"></div>
</body>
</html>