GamerNoTitle/Valora

[Feature/简体中文]: 黑夜模式

GamerNoTitle opened this issue · 0 comments

请选择建议的方向

网页外观

请描述你的建议,如果有思维导图等示意图也可以附上

RT,具体不写了,我懒
放下预想的代码

<script>
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
  // 用户首选黑夜模式
  document.documentElement.classList.add('dark-mode');
} else {
  // 用户首选浅色模式
  document.documentElement.classList.remove('dark-mode');
}
</script>
<script>
const toggleSwitch = document.querySelector('.toggle-switch');
toggleSwitch.addEventListener('click', () => {
  document.documentElement.classList.toggle('dark-mode');
  // 将用户的偏好设置存储到 localStorage
  localStorage.setItem('preferredTheme', document.documentElement.classList.contains('dark-mode') ? 'dark' : 'light');
});
</script>
<style>
.dark-mode {
  --color-background: #000;
  --color-text: #fff;
}
body {
  background-color: var(--color-background);
  color: var(--color-text);
}
</style>

如果你能够提供一下联系到你的方式,我将会不胜感激;当然不填也是可以的!

No response