<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="application-name" content="{{ app_name | capitalize }}">
    <meta name="referrer" content="origin">
    <meta name="darkreader-lock" content="">
    <meta name="theme-color" content="{% if theme_color %} {{ theme_color }} {% else %} #31748f {% endif %}">
    <meta name="theme-color-orig" content="{% if theme_color %} {{ theme_color }} {% else %} #31748f {% endif %}">
    <meta name="twitter:card" content="summary">
    <meta property="og:site_name" content="{{ instance_name }}">
    <title>{{ title | capitalize }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="icon" href="/favicon.ico?{{ timestamp }}">
    <link rel="manifest" href="/manifest.json?{{ timestamp }}">
    <link rel="prefetch" href="/static-assets/badges/info.png?{{ timestamp }}">
    <link rel="prefetch" href="/static-assets/badges/not-found.png?{{ timestamp }}">
    <link rel="prefetch" href="/static-assets/badges/error.png?{{ timestamp }}">
    <link rel="stylesheet" href="/static-assets/instance.css?{{ timestamp }}">
    <link rel="modulepreload" href="/assets/{{ client_entry.file }}">

    {% for css in client_entry.css %}
        <link rel="stylesheet" href="assets/{{ css }}">
    {% endfor %}

    <meta name="description" content="{% if description %}{{ description }}{% else %}Magnetar, an open source social media platform{% endif %}">

    {% if not robots %}
    <meta name="robots" content="noindex">
    {% endif %}

    <meta property="og:title" content="{{ title | capitalize }}">
    <meta property="og:description" content="{% if description %}{{ description }}{% else %}Magnetar, an open source social media platform{% endif %}">
    <meta property="og:image" content="{% if image %}{{ image }}{% else %}/static-assets/favicon.png{% endif %}">
    <meta property="og:image:alt" content="{% if image_alt %}{{ image_alt }}{% else %}The instance's logo{% endif %}">

    <style>
        {{ style_css | safe }}
    </style>

    <script>
        var VERSION = "{{ version }}";
        var CLIENT_ENTRY = "{{ client_entry.file }}";
        var _HOST = "{{ instance_host }}";

        {% if base_url %}
            var _REMOTE_URL = "{{ base_url | safe }}";
        {% endif %}
    </script>

    <script>
        {{ boot_js | safe }}
    </script>
</head>
<body>
    <noscript>
        Please turn on JavaScript to run {{ title | capitalize }}.
    </noscript>
    <div id="splash">
        <div id="splashIcon">
            {% if splash_icon %}
            <img id="splashIcon" src="{{ splashIcon }}" alt="{{ instance_name }} splash icon">
            {% else %}
            <div class="loadButterfly">
                <svg
                    class="loadButterflyWingLeft"
                    width="128"
                    height="128"
                    version="1.1"
                    viewBox="0 0 132.29 132.29"
                    xmlns="http://www.w3.org/2000/svg">
                    <defs>
                        <linearGradient
                            id="left-wing-gradient"
                            gradientUnits="userSpaceOnUse"
                            x1="0"
                            y1="132.29"
                            x2="132.29"
                            y2="0">
                            <stop offset="0%" stop-color="var(--butterfly-wl-0)"/>
                            <stop offset="100%" stop-color="var(--butterfly-wl-1)"/>
                        </linearGradient>
                    </defs>
                    <path
                        d="m69.68 67.053-16.078-1.6896-29.054 6.7403-15.672 10.996-0.12846 11.477 11.469 7.3293 20.661 9.219 10.9-7.602 0.0656 8.203 10.532 7.894 19.116 2.389 16.046-8.952-2.2676-13.201-7.7352-12.772-0.134-0.1705z"
                        fill="url(#left-wing-gradient)"
                    />
                </svg>
                <svg
                    class="loadButterflyWingRight"
                    width="128"
                    height="128"
                    version="1.1"
                    viewBox="0 0 132.29 132.29"
                    xmlns="http://www.w3.org/2000/svg">
                    <defs>
                        <linearGradient
                            id="right-wing-gradient"
                            gradientUnits="userSpaceOnUse"
                            x1="0"
                            y1="132.29"
                            x2="132.29"
                            y2="0">
                            <stop offset="0%" stop-color="var(--butterfly-wr-0)"/>
                            <stop offset="100%" stop-color="var(--butterfly-wr-1)"/>
                        </linearGradient>
                    </defs>
                    <path
                        d="m92.532 8.4622-12.705 14.323-9.9988 28.101-0.1483 16.167 17.719 19.86 0.1565 0.1518 11.809 9.1357 12.859 3.7536 10.718-14.924-0.204-19.263-6.646-11.36-8.142-0.9981 8.79-9.9657-6.81-21.574-5.98-12.229z"
                        fill="url(#right-wing-gradient)"
                    />
                </svg>
            </div>
            {% endif %}
        </div>
        <div id="splashText">
            Loading <b>{{ instance_name }}</b>...
            <br>
            ({{ title ~ " " ~ version }})
        </div>
        <div id="splashSpinner">
            <svg class="spinner bg" viewBox="0 0 152 152" xmlns="http://www.w3.org/2000/svg">
                <g transform="matrix(1,0,0,1,12,12)">
                    <circle cx="64" cy="64" r="64" style="fill:none;stroke:currentColor;stroke-width:24px;"/>
                </g>
            </svg>
            <svg class="spinner fg" viewBox="0 0 152 152" xmlns="http://www.w3.org/2000/svg">
                <g transform="matrix(1,0,0,1,12,12)">
                    <path d="M128,64C128,28.654 99.346,0 64,0C99.346,0 128,28.654 128,64Z" style="fill:none;stroke:currentColor;stroke-width:24px;"/>
                </g>
            </svg>
        </div>
    </div>
    <div class="content">

    </div>
</body>
</html>