<!DOCTYPE html>
<html lang="en">

<head>
    <link rel="icon" href="{{url_for('static', filename='img/logo70x70.png')}}">
    <link rel="stylesheet" href="https://bulma.io/vendor/fontawesome-free-5.15.2-web/css/all.min.css">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/bulma.min.css') }}">
    <meta charset="utf-8">
    <meta name="description" content="Tona - Lightweight tools for personal productivity">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Tona - {% block title %}{% endblock %}</title>
    {% block head %}
        <script src="{{url_for('static', filename='js/tona.js')}}"></script>
        <script src="{{url_for('static', filename='js/time_entry.js')}}"></script>
    {% endblock %}
</head>

<body>
    <header class="pl-4 pr-4">
        <nav class="navbar is-fixed-top">
            <div class="navbar-brand">
                <a class="navbar-item" href="/">
                    <!--img src="{{url_for('static', filename='img/logo.png')}}" width="112" height="28"-->
                    TONA
                </a>
                <div class="navbar-burger" data-target="tona-navbar-menu">
                <span></span>
                <span></span>
                <span></span>
                </div>
            </div>            
            <div id="tona-navbar-menu" class="navbar-menu">
                <div class="navbar-end">
                    <a class="navbar-item" href="/time-entry">
                        Timer
                    </a>
                    <a class="navbar-item" href="/project/today">
                        Project
                    </a>
                    <a class="navbar-item" href="/objective/year">
                        Objective
                    </a>
                    <a class="navbar-item" href="/habit">
                        Habit
                    </a>
                </div>
            </div>
        </nav>
    </header>
    <main class="ml-5 mr-5 mt-4 pt-6">
        <div class="columns is-mobile is-centered is-hidden">
            <div class="column has-text-centered notification is-light">
                <button class="delete"></button>
                <p id="notification-content" class="content is-small">
                {% with messages = get_flashed_messages() %}
                    {% if messages %}
                    {% for message in messages %}
                        {{ message }}
                    {% endfor %}
                    <script type="text/javascript">
                        document.addEventListener("DOMContentLoaded",Tona.Notification);
                    </script>
                    {% endif %}
                {% endwith %}
                </p>
            </div>
        </div>
        {% block content %}{% endblock %}
    </main>
    <footer class="footer mt-5">
        <div class="content has-text-centered">
          <p>
            <strong>Tona</strong> by <a href="https://github.com/sentilis">@sentilis</a>. The source code is licensed
            <a href="https://www.gnu.org/licenses/gpl-3.0.html">GPLv3</a>. Fork
            <a href="https://github.com/sentilis/tona">OSS</a>.
          </p>
        </div>
    </footer>
</body>

</html>