半夜糊 PandaBangumi 的时候被 Typecho 的后台亮得晃眼，遂让 Codex 编写了一个夜间模式插件。

效果对比图
效果对比图

项目地址：Typecho-Plugin-DarkMode

安装

先进入Typecho 的插件文件夹：

usr/plugins/

然后克隆并重命名仓库：

git clone https://github.com/mikusaa/Typecho-Plugin-DarkMode.git DarkMode

进入 Typecho 后台的「控制台 → 插件」，找到 DarkMode 并启用即可。

插件安装要求：

  • Typecho 1.3.0 及以上（其他版本未测试）；
  • PHP 8.2 及以上；
  • 支持 prefers-color-scheme 的现代浏览器；
  • 在线更新需要 PHP cURL 扩展，以及 DarkMode 插件目录的写入权限。

功能

目前插件支持：

  • 全后台夜间外观
  • 跟随设备、浅色和深色三种模式（默认「跟随设备」）
  • 一键更新

实现方式没什么特别的，JavaScript 根据浏览器外观偏好给页面打上对应标记，再由 CSS 覆盖 Typecho 原有的后台样式，并不会修改 Typecho 核心文件。

更新功能则是参考了 APlayer。我看总共也没几个文件，直接拉取 GitHub 仓库，更新起来比较方便。

使用

按钮我放在了右上角，点击即可切换。

想不到什么比较契合 Typecho 的样式，就设计成这样了。

演示

大多数页面效果都差不太多，这里拎几个重点给大家看看。

后台主页

撰写文章

网站外观

基本设置

官方的提示横幅会额外闪一下，在夜间模式下特别扎眼。我让 Codex 一并干掉了。

最后

有什么 bug 可以在这里留言，或是 GitHub 仓库发 issue，我会让 AI 加班加点修掉！