d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-21 07:26:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat/theme-switch

Browse Source
This commit is contained in:
tangly1024.com
2023-06-19 19:03:09 +08:00
parent 133fdd7c77
commit a042dc859a
28 changed files with 353 additions and 385 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
lib/theme.js
View File

@@ -1,6 +1,7 @@
import cookie from 'react-cookies'
import BLOG from '@/blog.config'
import { isBrowser, getQueryVariable } from './utils'
import { getQueryParam, getQueryVariable } from './utils'
import dynamic from 'next/dynamic'
/**
* 所有主题枚举
@@ -16,6 +17,62 @@ export const ALL_THEME = [
'simple'
]
/**
* 加载主题文件
* @param {*} router
* @returns
*/
export const getLayoutByTheme = (router) => {
const theme = getQueryParam(router.asPath, 'theme') || BLOG.THEME
let Layout = null
// 根据路由 pages的文件名加载主题文件
switch (router.pathname) {
case '/':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutIndex`), { ssr: true })
break
case '/page/[page]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutPage`), { ssr: true })
break
case '/archive':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutArchive`), { ssr: true })
break
case '/search':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutSearch`), { ssr: true })
break
case '/search/[keyword]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutSearch`), { ssr: true })
break
case '/search/[keyword]/page/[page]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutSearch`), { ssr: true })
break
case '/404':
Layout = dynamic(() => import(`@/themes/${theme}/Layout404`), { ssr: true })
break
case '/tag':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutTagIndex`), { ssr: true })
break
case '/tag/[tag]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutTag`), { ssr: true })
break
case '/tag/[tag]/page/[page]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutTag`), { ssr: true })
break
case '/category':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutCategoryIndex`), { ssr: true })
break
case '/category/[category]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutCategory`), { ssr: true })
break
case '/category/[category]/page/[page]':
Layout = dynamic(() => import(`@/themes/${theme}/LayoutCategory`), { ssr: true })
break
default:
Layout = dynamic(() => import(`@/themes/${theme}/LayoutSlug`), { ssr: true })
break
}
return Layout
}
/**
* 初始化主题 , 优先级 query > cookies > systemPrefer
* @param isDarkMode
@@ -34,24 +91,6 @@ export const initDarkMode = (isDarkMode, updateDarkMode) => {
document.getElementsByTagName('html')[0].setAttribute('class', isDarkMode ? 'dark' : 'light')
}
/**
* 初始化主题， 优先级 query > cookies > blog.config.js
* @param {*} theme
* @param {*} changeTheme
*/
export const initTheme = (theme, changeTheme) => {
if (isBrowser()) {
// const queryTheme = getQueryVariable('theme') || loadThemeFromCookies() || BLOG.THEME
const queryTheme = getQueryVariable('theme') || BLOG.THEME
let currentTheme = theme
if (queryTheme !== theme && ALL_THEME.indexOf(queryTheme) > -1) {
currentTheme = queryTheme
}
changeTheme(currentTheme)
saveThemeToCookies(currentTheme)
}
}
/**
* 是否优先深色模式， 根据系统深色模式以及当前时间判断
* @returns {*}