<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>

    <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
    <script src="/static/js/script.js"></script>
    <link href="/static/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>


<nav class="navbar navbar-expand-lg">
    <a class="navbar-brand" href="/"><i class="fas fa-database"></i> OD-Database</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            <li class="nav-item">
                <a class="nav-link {{ "active" if current_page == "website" else "" }}" href="/website/">Websites</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ "active" if current_page == "submit" else "" }}" href="/submit">Submit website</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ "active" if current_page == "contribute" else "" }}" href="/contribute">Contribute</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ "active" if current_page == "dl" else "" }}" href="/dl">Downloads</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{ "active" if current_page == "stats" else "" }}" href="/stats">Stats</a>
            </li>
        </ul>
    </div>
</nav>


{% block alert_messages %}


    {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
            <div class="container" style="margin-top: 1em">
                {% for category, message in messages %}
                    <div class="alert alert-{{ category }}">
                        <a href="#" class="close" data-dismiss="alert" aria-label="fermer">&times;</a>
                        {{ message | safe }}
                    </div>
                {% endfor %}
            </div>
        {% endif %}
    {% endwith %}
{% endblock %}

{% block body %}
{% endblock body %}

</body>
</html>