{% extends 'base.html.twig' %}

{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="{{ asset('build/css/styles.css') }}" />
{% endblock %}

{% block body %}

    <header>
        <div class="l-header">

            <a class="l-header__logo" href="{{ path('home')}}">
                <img src="{{ asset('custom/timepac_academy_logo.svg') }}" alt="logo TIMEPAC Academy"/>
            </a>

            <nav class="main-nav l-header__nav" aria-label="Main navigation">
                <div class="main-nav__column">

                    <a href="{{ path('home') ~ '#training' }}" class="main-nav__link {% block nav_courses %}{% endblock %}">{% trans %}Courses{% endtrans %}</a>
                    <a href="{{ path('lecturers') }}" class="main-nav__link {% block nav_lecturers %}{% endblock %}">{% trans %}Lecturers{% endtrans %}</a>
                    <a href="{{ path('contact') }}" class="main-nav__link {% block nav_contact %}{% endblock %}">{% trans %}Contact{% endtrans %}</a>

                </div>

                <div class="main-nav__right">
                    <div class="main-nav__dropdown">
                        <a href="#" class="main-nav__link">
                            {{ app.request.get('_locale')|upper }}
                            <span>▾</span>
                        </a>

                        <div class="main-nav__dropdown-content">
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'en'})) }}" class="{% if app.request.get('_locale') == 'en' %} active {% endif %}">EN</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'es'})) }}" class="{% if app.request.get('_locale') == 'es' %} active {% endif %}">ES</a>


                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'ca'})) }}" class="{% if app.request.get('_locale') == 'ca' %} active {% endif %}">CA</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'de'})) }}" class="{% if app.request.get('_locale') == 'de' %} active {% endif %}">DE</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'el'})) }}" class="{% if app.request.get('_locale') == 'el' %} active {% endif %}">EL</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'hr'})) }}" class="{% if app.request.get('_locale') == 'hr' %} active {% endif %}">HR</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'it'})) }}" class="{% if app.request.get('_locale') == 'it' %} active {% endif %}">IT</a>
                            <a href="{{ path(app.request.get('_route'), app.request.get('_route_params')|merge({'_locale': 'sl'})) }}" class="{% if app.request.get('_locale') == 'sl' %} active {% endif %}">SL</a>
                        </div>
                    </div>

                    {% if not is_granted('IS_AUTHENTICATED_FULLY') %}
                        <a href="{{ path('app_login') }}" class="main-nav__link {% block nav_login %}{% endblock %}">{% trans %}Login{% endtrans %}</a>
                    {% else %}
                        <a href="{{ path('app_course_index') }}" class="main-nav__link">{{ app.user.email}}</a>
                    {% endif %}

                </div>
                <a href="javascript:void(0);" class="main-nav__link iconMenu">&#9776;</a>

            </nav>

        </div>
    </header>
    {% for flash_message in app.session.flashbag.get('notice') %}
        <div class="flash-notice">
            {{ flash_message }}
        </div>
    {% endfor %}
    <main>
        {% block content %}{% endblock %}
    </main>

    {{ include('Layout/footer.html.twig')}}

{% endblock %}