<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Argus - {%block title%}{%endblock%}</title>
    <link rel="stylesheet" href="/s/dist/styles.css">
    <link rel="shortcut icon" href="/s/argus.png" type="image/png">
    {% block javascripts %}
    <script>
        var globalFlashes = {{ get_flashed_messages(with_categories=true) | tojson | safe }};
    </script>
    {% if g.user %}
    <script>
        var gArgusCurrentUser = {{ g.user | safe_user | tojson | safe }};
    </script>
    {% endif %}
    <script src="/s/dist/fontAwesome.bundle.js"></script>
    <script type="module" src="/s/dist/main.bundle.js"></script>
    <script type="module" src="/s/dist/globalAlert.bundle.js"></script>
    <script type="module" defer src="/s/dist/notificationCounter.bundle.js"></script>
    {% endblock javascripts %}
</head>
<body class="bg-lighter">
    <div class="app d-flex flex-column min-vh-100">
        {% include "partials/nav_bar.html.j2" %}
        <div id="argusErrors">
        </div>
        <div id="argusMain" class="container-fluid">
            {% block body %}
            {% endblock %}
        </div>
        <div id="argusFooter" class="mt-auto container-fluid bg-dark text-center text-light fw-light fs-6 p-4">
        Argus
        </div>
    </div>
</body>
</html>
