diff options
| -rw-r--r-- | _config.yml | 4 | ||||
| -rw-r--r-- | _includes/extensions/theme-toggle.html | 29 |
2 files changed, 25 insertions, 8 deletions
diff --git a/_config.yml b/_config.yml index f8d98f7..5833722 100644 --- a/_config.yml +++ b/_config.yml @@ -78,6 +78,10 @@ yat: # Custom color as below: # theme_color: "#882250" +# Night mode, default is "auto", "auto" is for auto nightshift (19:00 - 07:00), +# "mannual" is for mannual toggle, and "on/off" is for always on/off. +# night_mode: "auto" + # If you want to link only specific pages in your header, uncomment # this and add the path to the pages in order as they should show up # header_pages: diff --git a/_includes/extensions/theme-toggle.html b/_includes/extensions/theme-toggle.html index 7976e21..d426f65 100644 --- a/_includes/extensions/theme-toggle.html +++ b/_includes/extensions/theme-toggle.html @@ -9,6 +9,10 @@ </label> </div> +{%- assign name = 'night_mode' -%} +{%- include functions.html func='get_value' default='auto' -%} +{%- assign night_mode = return -%} + <script> (function() { var sw = document.getElementById('theme-switch'); @@ -24,7 +28,7 @@ try { data = JSON.parse(data ? data : ''); } catch(e) { - data = { nightShift: null, autoToggleAt: 0 }; + data = { nightShift: false, autoToggleAt: 0 }; saveThemeData(data); } return data; @@ -72,19 +76,28 @@ }; } - var data = autoThemeToggle(); - // Listen the theme toggle event sw.addEventListener('change', function(event) { handleThemeToggle(event.target.checked); }); - // Toggle theme by local setting - if (data.toggleAt > themeData.autoToggleAt) { - themeData.autoToggleAt = data.toggleAt; - handleThemeToggle(data.nightShift); - } else { + var nightModeOption = '{{ night_mode }}'; + nightModeOption = nightModeOption.toLowerCase(); + + if (nightModeOption == 'auto') { + var data = autoThemeToggle(); + + // Toggle theme by local setting + if (data.toggleAt > themeData.autoToggleAt) { + themeData.autoToggleAt = data.toggleAt; + handleThemeToggle(data.nightShift); + } else { + handleThemeToggle(themeData.nightShift); + } + } else if (nightModeOption == 'mannual') { handleThemeToggle(themeData.nightShift); + } else { + handleThemeToggle(nightModeOption == 'on'); } })(); </script> |