如何更改代码块提供的默认颜色?

您可以单独定位代码语言并覆盖自动语言检测,就像上面的帖子所提到的那样。

如果您想单独定位 Swift,可以使用 .language-swift 类。更具体地说…… code.hljs.language-swift。您可以在 CSS 中更改 Swift 的颜色。

我检查了这一点,似乎这接近 Xcode 主题。但我们将更改这两种颜色,使其更适合您的截图代码颜色。

这些颜色存在的问题是它们在黑暗模式下难以阅读。这就是为什么在 highlight.js 演示页面 上它有白色背景,我认为这就是 Discourse 对语言使用默认通用颜色组合的原因。如果我没记错的话,过去曾有一些关于在黑暗模式下难以阅读等的报告……


要将其更改为仅 Swift,您需要创建一个新的主题组件或将其添加到现有组件中。注意:这些颜色在黑暗模式下也会使用(白色背景等),因此如果您想要黑暗模式下不同的颜色,则需要创建新的颜色定义 dark-light-choose()

通用 / CSS

code.hljs.language-swift {
  background: #fff;
  color: #000;

  .xml .hljs-meta {
    color: silver;
  }

  .hljs-comment,
  .hljs-quote {
    color: #007400;
  }

  .hljs-attribute,
  .hljs-keyword,
  .hljs-literal,
  .hljs-name,
  .hljs-selector-tag,
  .hljs-tag {
    color: #aa0d91;
  }

  .hljs-template-variable,
  .hljs-variable {
    color: #3f6e74;
  }

  .hljs-code,
  .hljs-meta .hljs-string,
  .hljs-string {
    color: #c41a16;
  }

  .hljs-link,
  .hljs-regexp {
    color: #0e0eff;
  }

  .hljs-bullet,
  .hljs-number,
  .hljs-symbol,
  .hljs-title {
    color: #2b75a6;
  }

  .hljs-meta,
  .hljs-section {
    color: #643820;
  }

  .hljs-built_in,
  .hljs-class .hljs-title,
  .hljs-params,
  .hljs-title.class_,
  .hljs-type {
    color: #442fa1;
  }

  .hljs-attr {
    color: #836c28;
  }

  .hljs-subst {
    color: #000;
  }

  .hljs-formula {
    background-color: #eee;
    font-style: italic;
  }

  .hljs-addition {
    background-color: #baeeba;
  }

  .hljs-deletion {
    background-color: #ffc8bd;
  }

  .hljs-selector-class,
  .hljs-selector-id {
    color: #9b703f;
  }

  .hljs-doctag,
  .hljs-strong {
    font-weight: 700;
  }

  .hljs-emphasis {
    font-style: italic;
  }
}

之前

之后

5 个赞