{% block css %}
<link type="text/css" rel="stylesheet" href="/themes/default/css/menu.css">
{% for button in menu %}
{% if button.icon %}
<link type="text/css" rel="stylesheet" href="/themes/default/css/icons/{{ button.icon|replace({' ': '-'}) }}.css">
{% endif %}
{% endfor %}
{% endblock %}

{% block body %}
<nav id="menu">
	{% for button in menu %}
	<a href='{{ button.urn }}' onclick="return core.loader.load('{{ button.urn }}');" type="button" class="unselectable"
		title="{{ button.name }}"
		style="order: {{ button.position }};{% for target, color in button.color %} --unsafe-{{ target }}: {{ color|e }};{% endfor %}">
		{% if button.icon %}
		<i class="icon {{ button.icon }}"></i>
		{% endif %}
		<span>{{ button.name }}</span>
		{% if button.image.storage %}
		<img src="{{ button.image.storage }}" alt="{{ button.name }}" ondrugstart="return false;">
		{% endif %}
	</a>
	{% endfor %}
</nav>
{% endblock %}

{% block js %}
<script type="text/javascript" src="/js/menu.js"></script>
{% endblock %}
