yii2-netdisk/web/js/darkmode_auto.js
Chenx221 d1683d4c03
前端实现夜间模式
同时调整了一些样式以匹配夜间模式下的效果
*稍后会做一个后端切换主题的功能
2024-03-08 15:26:36 +08:00

16 lines
834 B
JavaScript

window.onload = function() {
// 检查设备是否开启了夜间模式
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
// 如果开启了夜间模式,设置 data-bs-theme 属性为 'dark'
document.documentElement.setAttribute('data-bs-theme', 'dark');
// 找到所有的outline按钮
var buttons = document.querySelectorAll('.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger, .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark');
// 遍历所有的outline按钮
for (var i = 0; i < buttons.length; i++) {
// 替换 'btn-outline-*' 类为 'btn-*' 类
buttons[i].className = buttons[i].className.replace('btn-outline-', 'btn-');
}
}
};