清浊

这个网站使用了VuePress框架，通过vuepress-color-scheme插件来管理主题配色方案。它允许用户选择暗色模式（Dark Mode）或亮色模式（Light Mode），并根据当前浏览器的媒体查询（Media Query）来决定应用哪种主题。

以下是对代码部分的解析：

// 使用CSS变量定义背景色  
const userMode = localStorage.getItem('vuepress-color-scheme');  
  
// 如果用户未设置颜色方案，则使用默认的深色模式  
if (userMode === 'dark' ||  
(userMode !== 'light' && systemDarkMode)) {  
// 使用类名切换元素的背景颜色  
document.documentElement.classList.toggle('dark', true);  
}  

这段代码首先从本地存储中获取用户设置的主题颜色方案 vuepress-color-scheme。然后，根据 userMode 的值和系统当前的暗色模式偏好（systemDarkMode）。如果 userMode 为 dark，或者用户没有设置颜色方案且浏览器支持暗色模式，则会将文档元素的类名设置为 dark。这样，当用户在页面上进行缩放操作时，页面会根据当前浏览器的暗色模式偏好来调整其背景颜色。