<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="mobile-web-app-capable" content="yes">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="theme-color" content="#48C774">
        <link rel="manifest" href="{{ url_for('static', filename='manifest.json') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/bulma.css') }}">
        <title>Offline - Valens</title>
    </head>
    <body>
        <div class="container is-max-desktop">
            <div class="columns is-flex is-vcentered is-centered is-mobile" style="height: 100vh">
                <div class="column is-two-thirds">
                    <progress class="progress is-primary" max="100"></progress>
                </div>
            </div>
        </div>
        <script>
            window.addEventListener('online', () => {
                window.location.reload();
            });

            async function checkServerConnection() {
                try {
                    const response = await fetch('.');
                    if (response.status >= 200 && response.status < 500) {
                        window.location.reload();
                        return;
                    }
                } catch {
                }
                window.setTimeout(checkServerConnection, 2000);
            }

            checkServerConnection();
        </script>
    </body>
</html>
