如何修改 Sym 代码高亮主题

  1. 在文件 ./gulpfile.js 中搜索 ./src/main/webapp/js/lib/highlight.js-9.6.0/styles/
  2. 把后面的 xxx.css 修改为目录 ./src/main/webapp/js/lib/highlight.js-9.6.0/styles 下你中意的主题文件名,如 dark.css
  3. 打开 dark.css
    找到 .hljs {,记录下背景色的色值 #444
    找到 .hljs, .hljs-subst {,记录下字体颜色色值 #ddd ,将其对应的拷贝到 ./src/main/webapp/scss/_common.scss 文件中 pre > code 元素下。如:

     pre > code {
         padding: 0.5em;
         color: #ddd;
         background-color: #444;
         background-image: url(../images/code-bg.png);
         background-size: 20px 20px;
         border-radius: 5px;
     }
    
  4. 根目录下运行 gulp 命令

  5. 全局搜索 highlight.js-9.6.0/styles/ 把后面的 xxx.css 替换为你中意的主题文件名,如 dark.css