// eslint-disable-next-line @next/next/no-document-import-in-page
import BLOG from '@/blog.config'
import Document, { Head, Html, Main, NextScript } from 'next/document'
// 预先设置深色模式的脚本内容
const darkModeScript = `
(function() {
const darkMode = localStorage.getItem('darkMode')
const prefersDark =
window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
const defaultAppearance = '${BLOG.APPEARANCE || 'auto'}'
let shouldBeDark = darkMode === 'true' || darkMode === 'dark'
if (darkMode === null) {
if (defaultAppearance === 'dark') {
shouldBeDark = true
} else if (defaultAppearance === 'auto') {
// 检查是否在深色模式时间范围内
const date = new Date()
const hours = date.getHours()
const darkTimeStart = ${BLOG.APPEARANCE_DARK_TIME ? BLOG.APPEARANCE_DARK_TIME[0] : 18}
const darkTimeEnd = ${BLOG.APPEARANCE_DARK_TIME ? BLOG.APPEARANCE_DARK_TIME[1] : 6}
shouldBeDark = prefersDark || (hours >= darkTimeStart || hours < darkTimeEnd)
}
}
// 立即设置 html 元素的类
document.documentElement.classList.add(shouldBeDark ? 'dark' : 'light')
})()
`
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
{/* 预加载字体 */}
{BLOG.FONT_AWESOME && (
<>
)}
{/* 预先设置深色模式，避免闪烁 */}
)
}
}
export default MyDocument