teuserer/www.netz39.de
1
0
Fork 0
mirror of https://github.com/netz39/www.netz39.de.git synced 2025-01-18 20:10:12 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #59 from netz39/auto-darkmode

Browse source 
Make auto darkmode working by using "prefers-color-scheme" tag
This commit is contained in:
Max 2023-11-01 13:10:35 +01:00 committed by GitHub
commit 0df7b9dd96
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
_includes/default/head.liquid
View file

@ -2,16 +2,25 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.5, maximum-scale=5">
<!-- Theme Mode-->
<!-- Theme Mode -->
{% if site.color_theme == 'auto' %}
<script>
const isAutoTheme = true;
document.documentElement.setAttribute('data-theme', sessionStorage.getItem('theme'))
const prefersDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
const storedTheme = localStorage.getItem('theme');
if (storedTheme) {
document.documentElement.setAttribute('data-theme', storedTheme);
} else if (prefersDarkMode) {
document.documentElement.setAttribute('data-theme', 'dark');
} else {
document.documentElement.setAttribute('data-theme', 'light');
}
</script>
{% else %}
<script>
const isAutoTheme = false;
document.documentElement.setAttribute('data-theme', "{{ site.color_theme | default: 'light' }}")
document.documentElement.setAttribute('data-theme', "{{ site.color_theme | default: 'light' }}");
</script>
{% endif %}