Hexo安装暗黑模式

安装暗黑模式

插件地址 npm直接安装插件npm install hexo-next-darkmode,同时在hexo配置文件添加

# close NexT's darkmode
darkmode: false

# Darkmode JS
# For more information: https://github.com/rqh656418510/hexo-next-darkmode, https://github.com/sandoche/Darkmode.js
darkmode_js:
  enable: true
  bottom: '64px' # default: '32px'
  right: 'unset' # default: '32px'
  left: '32px' # default: 'unset'
  time: '0.5s' # default: '0.3s'
  mixColor: 'transparent' # default: '#fff'
  backgroundColor: 'transparent' # default: '#fff'
  buttonColorDark: '#100f2c' # default: '#100f2c'
  buttonColorLight: '#fff' # default: '#fff'
  isActivated: false # default false
  saveInCookies: true # default: true
  label: '🌓' # default: ''
  autoMatchOsTheme: true # default: true
  libUrl: # Set custom library cdn url for Darkmode.js

备案图片换行问题

公安备案图片换行了,奇丑无比.折磨了我一个通宵,试了各个插件,甚至把hexo都重装了

今天开始调试样式,一个一个试,才发现有一个.darkmode-ignore样式导致了图片换行

于是找到了罪魁祸首,hexo-next-darkmode

编辑hexo-next-darkmode\lib\darkmode.css文件,把下面一段去掉

/* fix picture centered */
img, .darkmode-ignore {
  display: flex !important;
}

在作者github提出建议

https://github.com/rqh656418510/hexo-next-darkmode/issues/4

可爱的作者把问题代码修改为

/* fix icp image display */
.beian img {
  display: inline-block !important;
}

并升级了版本.可爱的备案图标又在中间了!

但是这治标不治本,仅仅只针对备案图标.我还是把darkmode-ignore给改掉了

最终还是卸载了

导致很多其他图片独占一行的问题,把人烦死了.