{# Main App layout #}
<!DOCTYPE html>
<html lang="en">
<head>
    {% block head %}
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>{% block title %}{% endblock %} - PROTOTYPE</title>

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
    {% endblock %}
</head>
<body class="blue-grey lighten-5">
    <nav class="grey darken-4 nav-extended" role="navigation">
        <div class="nav-wrapper container">
            <a id="logo-container" href="{{ url_for('dashboard.dashboard') }}" class="brand-logo">Experimentum</a>
            <ul class="right hide-on-med-and-down">
                <li><a class="grey-text text-darken-1" href="https://github.com/PascalKleindienst/experimentum">Github source</a></li>
                <li><a class="grey-text text-darken-1" href="https://github.com/PascalKleindienst/experimentum/issues">Issues</a></li>
                <li><a class="grey-text text-darken-1" href="https://pascalkleindienst.github.io/experimentum/index.html">Documentation</a></li>
            </ul>

            <ul id="nav-mobile" class="sidenav">
                <li><a class="grey-text text-darken-1" href="https://github.com/PascalKleindienst/experimentum">Github source</a></li>
                <li><a class="grey-text text-darken-1" href="https://github.com/PascalKleindienst/experimentum/issues">Issues</a></li>
                <li><a class="grey-text text-darken-1" href="https://pascalkleindienst.github.io/experimentum/index.html">Documentation</a></li>
            </ul>
            <a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
        </div>
        <div class="nav-content white grey-text text-darken-2">
            {% block nav_content %}{% endblock %}
        </div>
    </nav>

    <div id="content" class="container">{% block content %}{% endblock %}</div>

    {% block scripts %}
    <script src="https://code.jquery.com/jquery-latest.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
    <script>M.AutoInit();</script>
    <script src="{{ url_for('static', filename='app.js')}}" type="module"></script>
    {% endblock %}
</body>
</html>