<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}Python Package Index (demo){% endblock %}</title>

    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic,600,600italic,700,700italic|Source+Code+Pro:500">

    <link rel="stylesheet"
          href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
          integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

    <link rel="stylesheet" href="/static/css/site.css"/>
    <link rel="stylesheet" href="/static/css/nav.css"/>

    {% block additional_css %}{% endblock %}
</head>
<body>

<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse navbar-expand-md">
    <a class="navbar-brand" href="/"><img src="/static/img/pypi-logo.svg"/></a>

    <button class="navbar-toggler navbar-toggle" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <div class="navbar-toggler-icon">
            <div class="nav-expand-line"></div>
            <div class="nav-expand-line"></div>
            <div class="nav-expand-line"></div>
        </div>
    </button>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item"><a class="nav-link" href="#">Donate</a></li>
            <li class="nav-item"><a class="nav-link" href="#">Help</a></li>

            {% if user_id %}
                <li class="nav-item"><a class="nav-link" href="/account">Account</a></li>
                <li class="nav-item"><a class="nav-link" href="/account/logout" id="last_nav_link">Logout</a></li>
            {% else %}
                <li class="nav-item"><a class="nav-link" href="/account/login">Login</a></li>
                <li class="nav-item"><a class="nav-link" href="/account/register" id="last_nav_link">Register</a></li>
            {% endif %}

        </ul>
    </div>
</nav>

<div class="main_content">
    {% block main_content %}{% endblock %}
</div>

<footer>
    <div class="copyright">
        This is a fake site built during a course.<br>
        It's meant to model / simulate the real <a href="https://pypi.org">pypi.org</a><br>
        <br>
        Copyright &copy; <a href="https://training.talkpython.fm">Talk Python Training</a>.
    </div>
</footer>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
        crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
        integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
        crossorigin="anonymous"></script>
<script
        src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
        integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
        crossorigin="anonymous"></script>

{% block additional_js %}{% endblock %}

</body>
</html>