<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        {% include '_layout/meta.twig' %}
        <link href="/vendor/fontawesome/css/all.min.css" type="text/css" rel="stylesheet">
        <link href="{{ globals.assets.mszcss|default() }}" type="text/css" rel="stylesheet">
{% if site_background is defined %}
        <style>
            :root {
                --background-width: {{ site_background.width }}px;
                --background-height: {{ site_background.height }}px;
                --background-image: url('{{ site_background_url|raw }}');
            }
        </style>
{% endif %}
{% if site_logo is defined %}
        <style>
            :root {
                --site-logo: url('{{ site_logo }}');
            }
        </style>
{% endif %}
    </head>
    <body class="main{% if site_background is defined %} {{ site_background.classNames('main--bg-%s')|join(' ') }}{% endif %}"
        style="{% if global_accent_colour is defined %}--accent-colour: {{ global_accent_colour }}{% endif %}" id="container">

{% block main_header %}
{% include '_layout/header.twig' %}
{% endblock %}

        <div class="main__wrapper">
{% if globals.active_ban_info is not null %}
            <div class="warning warning--red">
                <div class="warning__content">
                    <p>You have been banned {% if globals.active_ban_info.isPermanent %}<strong>permanently</strong>{% else %}for <strong title="{{ globals.active_ban_info.expiresTime|date('r') }}">{{ globals.active_ban_info.remainingString }}</strong>{% endif %} since <strong><time datetime="{{ globals.active_ban_info.createdTime|date('c') }}" title="{{ globals.active_ban_info.createdTime|date('r') }}">{{ globals.active_ban_info.createdTime|time_format }}</time></strong>.</p>
                    {% if globals.active_ban_info.hasPublicReason %}
                        <p>Reason: {{ globals.active_ban_info.publicReason }}</p>
                    {% endif %}
                </div>
            </div>
{% endif %}

{% block content %}
            <div class="container" style="margin: 2px 0; padding: 2px 5px;">
                This page is empty, populate it.
            </div>
{% endblock %}
        </div>

{% block main_footer %}
{% include '_layout/footer.twig' %}
{% endblock %}

        <script type="text/javascript">
            window.addEventListener('DOMContentLoaded', function() { Misuzu(); });
        </script>
        <script src="/vendor/highlightjs/highlight.min.js" type="text/javascript"></script>
        <script src="{{ globals.assets.mszjs|default() }}" type="text/javascript"></script>
    </body>
</html>
