slint/docs/reference/_templates/layout.html

{% extends "!layout.html" %}

{% block extrahead %}
<!-- Custom styles and script to prevent FOUC in Safari only -->
<style>
    body.safari-hidden {
        visibility: hidden;
        /* Hide body until the theme is applied in Safari */
    }
</style>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);

        if (isSafari) {
            document.body.classList.add('safari-hidden');  // Hide body in Safari

            const savedTheme = localStorage.getItem('theme') || 'light';  // Default to light theme
            document.documentElement.setAttribute('data-theme', savedTheme);
            document.body.style.visibility = 'visible';  // Make visible once theme is applied
        }
    });
</script>
{% endblock extrahead %}

{% block scripts_end %}
    {{ super() }}
{% endblock %}