From 8fdca49e1d63db1075a23958ff23189818a49d6c Mon Sep 17 00:00:00 2001 From: muqiuhan Date: Thu, 13 Mar 2025 09:18:34 +0000 Subject: deploy: 11fd5b5345c11055a7c18e9b2c0baa4d2787fe15 --- js/theme-switch.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 js/theme-switch.js (limited to 'js/theme-switch.js') diff --git a/js/theme-switch.js b/js/theme-switch.js new file mode 100644 index 00000000..4dddd304 --- /dev/null +++ b/js/theme-switch.js @@ -0,0 +1,31 @@ +document.addEventListener('DOMContentLoaded', () => { + const themeSwitch = document.getElementById('theme-switch-btn'); + const prefersDarkScheme = window.matchMedia('(prefers-color-scheme: dark)'); + + // 检查本地存储中的主题设置 + const currentTheme = localStorage.getItem('theme'); + if (currentTheme === 'dark') { + document.body.classList.add('dark-theme'); + themeSwitch.querySelector('i').classList.replace('icon-moon', 'icon-sun'); + } else if (currentTheme === 'light') { + document.body.classList.remove('dark-theme'); + } else if (prefersDarkScheme.matches) { + document.body.classList.add('dark-theme'); + themeSwitch.querySelector('i').classList.replace('icon-moon', 'icon-sun'); + } + + // 切换主题 + themeSwitch.addEventListener('click', (e) => { + e.preventDefault(); + + if (document.body.classList.contains('dark-theme')) { + document.body.classList.remove('dark-theme'); + localStorage.setItem('theme', 'light'); + themeSwitch.querySelector('i').classList.replace('icon-sun', 'icon-moon'); + } else { + document.body.classList.add('dark-theme'); + localStorage.setItem('theme', 'dark'); + themeSwitch.querySelector('i').classList.replace('icon-moon', 'icon-sun'); + } + }); +}); \ No newline at end of file -- cgit v1.2.3