{% load static i18n %}
{% comment %}
SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %}
<!DOCTYPE html>
<html lang="en" class="position-relative h-100">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>
        {% block title %}{{ title }}{% endblock title %} - {{ request.site.name }}
    </title>
    <meta name="description" content="{% trans "The ENS Paris-Saclay BDE note." %}">

    {# Favicon #}
    <link rel="apple-touch-icon" sizes="180x180" href="{% static "favicon/apple-touch-icon.png" %}">
    <link rel="icon" type="image/png" sizes="32x32" href="{% static "favicon/favicon-32x32.png" %}">
    <link rel="icon" type="image/png" sizes="16x16" href="{% static "favicon/favicon-16x16.png" %}">
    <link rel="manifest" href="{% static "favicon/site.webmanifest" %}">
    <link rel="mask-icon" href="{% static "favicon/safari-pinned-tab.svg" %}" color="#5bbad5">
    <link rel="shortcut icon" href="{% static "favicon/favicon.ico" %}">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="msapplication-config" content="{% static "favicon/browserconfig.xml" %}">
    <meta name="theme-color" content="#ffffff">
    {% if no_cache %}
        <meta name="turbolinks-cache-control" content="no-cache">
    {% endif %}

    {# Bootstrap CSS #}
    <link rel="stylesheet"
          href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
          integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
          crossorigin="anonymous">
    <link rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

    {# JQuery, Bootstrap and Turbolinks JavaScript #}
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha384-vk5WoKIaW/vJyUAd9n/wmopsmNhiy+L2Z+SBxGYnUkunIxVxAv/UtMOhba/xskxh"
            crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
            integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
            crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
            integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
            crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js"
            crossorigin="anonymous"></script>

    {# Si un formulaire requiert des données supplémentaires (notamment JS), les données sont chargées #}
    {% if form.media %}
        {{ form.media }}
    {% endif %}

    {% block extracss %}{% endblock %}
</head>
<body class="d-flex w-100 h-100 flex-column">
<main class="mb-auto">
    <div class="container-fluid my-3" style="width: 100%;">
        {% block contenttitle %}<h1>{{ title }}</h1>{% endblock %}
        {% block content %}
            <p>Default content...</p>
        {% endblock content %}
    </div>
</main>

<footer class="bg-light mt-auto py-2">
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm">
                <form action="{% url 'set_language' %}" method="post"
                      class="form-inline">
                    <span class="text-muted mr-1">
                        Tombola Saper[list]popette <span style="color: red;">♦</span>️♠️<span style="color: red;">♥</span>️♣
                    </span>
                    {% csrf_token %}
                    <noscript>
                        <input type="submit">
                    </noscript>
                </form>
            </div>
            <div class="col-sm text-right">
                <a href="#" class="text-muted">Retour en haut</a>
            </div>
        </div>
    </div>
</footer>

{% block extrajavascript %}
{% endblock extrajavascript %}
</body>
</html>