mirror of
https://github.com/nottinghamtec/PyRIGS.git
synced 2026-01-17 05:22:16 +00:00
Make dark theme a user level property, lazy load dark CSS
- Also now respects the colour-scheme media query - Added meta tag to tell the browser we support dark theme, allowing dark UA stylesheet if the user sends said media query - Means you only have to set it once per account rather than once per machine - Dark themed embeds!
This commit is contained in:
@@ -7,8 +7,10 @@
|
||||
lang="{% firstof LANGUAGE_CODE 'en' %}"
|
||||
class="embedded">
|
||||
<head>
|
||||
<base target="_blank" />
|
||||
<!-- Open all links in a new tab, not in the iframe -->
|
||||
<base target="_blank" /><!-- Open all links in a new tab, not in the iframe -->
|
||||
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<link rel="stylesheet" type="text/css" href="{% static 'css/dark_screen.css' %}" {% if not request.user.dark_theme %}media="(prefers-color-scheme: dark)"{% endif %}>
|
||||
|
||||
<link href="{% static 'fonts/OpenSans-Regular.tff' %}">
|
||||
|
||||
@@ -34,6 +36,11 @@
|
||||
{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
if({{ request.user.dark_theme|lower }} || window.matchMedia('(prefers-color-scheme: dark)')) {
|
||||
document.body.setAttribute('data-theme', 'dark');
|
||||
}
|
||||
</script>
|
||||
{% block js %}
|
||||
{% endblock %}
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user