文件名称:next-dark-mode::new_moon:为Next.js应用启用暗模式
文件大小:1.31MB
文件格式:ZIP
更新时间:2024-05-25 07:11:56
react theme styled-components night-mode dark-theme
next-dark-mode :first_quarter_moon: 使用黑暗模式为您的Next.js应用程序设置主题 内容: 特征 自动模式 next-dark-mode可选地支持自动模式,该模式将根据其操作系统上选择的颜色模式自动切换用户的主题。 和macOS均支持根据一天中的时间设置暗或亮模式。 它是通过“ prefers-color-scheme媒体查询来实现的。 没有页面加载故障 next-dark-mode使用可配置的cookie来保持当前主题的状态,一个用于自动模式,另一个用于黑暗模式。 这可以防止本地存储方法出现常见的页面加载故障,在本地存储方法中,应用程序将加载到客户端,然后获取用户主题的状态。 您可以在Pantaley Stoyanov的此实现中看到它。 注意:该库与Next.js 9的自动部分静态导出功能不兼容,因为它必须读取getInitialProps函数中的cookie,这会使所有
【文件预览】:
next-dark-mode-main
----.prettierignore(14B)
----.gitignore(71B)
----tsconfig.json(455B)
----README.md(6KB)
----.prettierrc(116B)
----LICENSE(1KB)
----.eslintrc(92B)
----package.json(2KB)
----src()
--------index.tsx(5KB)
--------config.ts(428B)
--------darkModeContext.ts(610B)
----example()
--------intern.json(153B)
--------tsconfig.json(485B)
--------tests()
--------package.json(391B)
--------src()
--------next-env.d.ts(75B)
--------yarn.lock(120KB)
--------.eslintrc.js(80B)
----tsconfig.es6.json(133B)
----.npmignore(15B)
----yarn.lock(124KB)
----assets()
--------feature-cookies.gif(541KB)
--------feature-auto.gif(425KB)
--------next-dark-mode.gif(292KB)