<!DOCTYPE html>
<html lang="fr">
    <head>
        <title>AEMO Fribourg {% block title %}{% endblock %}</title>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        {% include 'bootstrap_headers.html' %}

        <link rel="stylesheet" type="text/css" href="{% static 'admin/css/dashboard.css' %}">
        <link rel="stylesheet" type="text/css" href="{% static 'admin/css/widgets.css' %}">
        <link rel="stylesheet" type="text/css" href="{% static 'css/tablesort.css' %}">
        <link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
        <link rel="icon" type="image/png" href="{% static 'favicon.png' %}" sizes="16x16">
        {% block extrastyle %}{% endblock %}

        <script src="{% url 'javascript-catalog' %}"></script>
        <script src="{% static 'admin/js/core.js' %}" defer></script>
        <script src="{% static 'admin/js/calendar.js' %}" defer></script>
        <script src="{% static 'js/DateTimeShortcuts.js' %}" defer></script>
        <script src="{% static 'js/tablesort.min.js' %}" defer></script>
        <script src="{% static 'js/sorts/tablesort.number.min.js' %}" defer></script>
        <script src="{% static 'js/autosize.min.js' %}" defer></script>
        <script src="{% static 'js/main.js' %}" defer></script>
        {% block extra_javascript %}{% endblock %}
        {{ form.media }}
    </head>
    <body>
        <div class="top-container">
            {% block header %}
            <header>
                <figure class="mb-0">
                    <img id="logo-cr" src="{% static 'img/logo-cr.svg' %}">
                    <img id="bandeau-cr" src="{% static 'img/bandeau_rouge.png' %}">
                </figure>
            </header>
            {% include 'user_bar.html' %}
            {% endblock %}
            {% block top-navigation %}
            <nav class="container-fluid border-bottom">
                <div class="row bg-light">
                    <div class="col-sm-6">
                        {% block nav-left %}
                        {% if user.is_authenticated %}
                            <nav id="menu_crne" class="navbar navbar-expand-lg">
                                <ul class="navbar-nav py-2">
                                    <li class="nav-item">
                                        <a href="{% url 'home' %}" class="btn btn-sm btn-outline-secondary" role="button">Accueil</a>
                                    </li>
                                    {% if source %}
                                        {% include 'aemo/menu_principal.html' %}
                                    {% else %}
                                        {% include 'admin/menu_principal.html' %}
                                    {% endif %}
                                </ul>
                            </nav>
                        {% endif %}
                        {% endblock %}
                    </div>
                    <div class="col-sm-6 ps-0 text-end pt-2">
                        {% block boutons_droite %}{% endblock %}
                    </div>
                </div>
            </nav>
            {% endblock %}

            {% block messages %}
                {% if messages %}
                    <div class="mt-3">
                        <div class="col-xl-10 offset-xl-1">
                            <ul class="list-unstyled messages">
                                {% for message in messages %}
                                    <li class="alert {{ message.tags }}">{{ message|linebreaksbr|capfirst }}</li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                {% endif %}
            {% endblock messages %}

            {% block above-content %}{% endblock %}
            <section class="mt-3 main-content container-fluid">
              <div class="row">
                <div class="col-xl-10 offset-lg-1">
                    {% block content %}{% endblock %}
                    {% block pagination %}
                        {% include 'pagination.html' %}
                    {% endblock %}
                </div>
              </div>
            </section>

            <footer>
                <div class="footer text-center p-4 border-top pl-0 pr-0">
                    Fondation Transit
                </div>
            </footer>
        </div>

    <!-- Fenêtre pour l’édition d’objets en fenêtre modale -->
    <div id="popup0" class="modal" role="dialog">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title"></h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body"></div>
        </div>
      </div>
    </div>

    <!-- simple modal for images -->
    <div id="imgModal" class="modal modal-image">
      <span id="modalClose">&times;</span>
      <img class="modal-content" id="img01">
      <div id="caption"></div>
    </div>
    </body>
</html>
