{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>IsOnzeInternAlDronken.nl ~ {{ association.city }} ~ {{ association }}</title>
    {% if not debug %}
    <!-- Piwik -->
    <script type="text/javascript">
        var _paq = _paq || [];
        _paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
        _paq.push(["setCookieDomain", "*.isonzeinterndronken.nl"]);
        _paq.push(['trackPageView']);
        _paq.push(['enableLinkTracking']);
        (function () {
            var u = "//piwik.kuro.network/";
            _paq.push(['setTrackerUrl', u + 'piwik.php']);
            _paq.push(['setSiteId', '5']);
            var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
            g.type = 'text/javascript';
            g.async = true;
            g.defer = true;
            g.src = u + 'piwik.js';
            s.parentNode.insertBefore(g, s);
        })();
    </script>
    <!-- End Piwik Code -->
    {% endif %}
    <style type="text/css">
        html {
            background: url("{% static "background2.jpg" %}");

        }

        html, body {
            height: 100%;
            font-family: OpenSans, Verdana, sans-serif;
        }

        div {
            text-align: center;
            top: 50%;
            position: relative;
            transform: translateY(-50%);
        }

        h1 {
            font-size: 60px;
            padding-top: 30px;
        }

        h2 {
            font-size: 40px;
            padding: 0px;
            margin: 0px;
        }

        h3 {
            font-size: 30px;
            padding: 0px;
            margin: 0px;
        }
        .line {
            margin-top: 2em;
            margin-bottom: 2em;

        }
    </style>
</head>
<body>
<div>
    <a href="{% url 'dronken:association_list' association.city.slug %}"><button>Back</button></a>
    <h2>{{ association|safe }}?</h2>
    <hr class="line" />
    <h2>{% if association.intern %}{{ association.intern|capfirst }}{% else %}De intern{% endif %}</h2>
    <h2>is op dit moment:</h2>
    {% if association.has_intern %}
    <h1>{{ association.get_state_display|upper }}</h1>
    <hr class="line"/>
    <p>Update de staat van {% if association.intern %}{{ association.intern|capfirst }}{% else %}de intern{% endif %}:</p>
    <form method="post">
        {% csrf_token %}
        {{ form.state }} <input type="submit" value="Update!" />
    </form>
    {% else %}
        <h1>{{ association.short_name }} heeft helemaal geen intern!</h1>
    {% endif %}
</div>
</body>
</html>