Next主题更改引用blockquote以及内嵌代码code的颜色

发表于 更新于 分类于 ， Waline： 阅读次数： 本文字数： 577 阅读时长 ≈ 1 分钟
Next版本：7.8.0

  因为设置了背景，所以往往有统一颜色的需求，此时占比较大的引用和代码的颜色较为明显，如果采用默认颜色会比较难看。在相同Next主题和版本下，可以这样设置：

  • 块引用

  首先cd到..\next\source\css\_common\scaffolding找到base.styl文件，打开ctrl+F搜索blockquote，对代码进行如下编辑：

1
2
3
4
5
6
7
8
9
10
11
12
blockquote {
  background: #d0a7020d;
  border-left: 4px solid #d0a702;
  color: var(--blockquote-color);
  margin: 0;
  padding: 0 15px;

  cite::before {
    content: '-';
    padding: 0 5px;
  }
}

其中background是引用块的背景颜色，border-left即左边粗竖线的颜色，对#后面改成自己喜欢的颜色后重新部署即可。

  • 内嵌代码

  cd到..\next\source\css\_variables找到base.styl文件，打开找到code-background，同样将后面的颜色进行修改即可。

  由于我还没有设置图床，就不放图片演示了😶

  最后，如果版本不一致，也可以用开发者工具找到源代码进行修改。