如何在原子编辑器中更改 TODO 突出显示

Question

在我看来，在原子编辑器中突出显示 TODO“标志”太弱/不引人注目。

我该如何改变呢？我不想在侧边栏中列出待办事项 (https://atom.io/packages/todo-show)。

这里比较：

在 Vim 编辑器中有很强的高亮显示（需要）：

在 Atom 编辑器中：

主要问题是，原子以这种颜色突出显示了许多其他代码字......

Answer 1

由于 GitHub 的 Atom 编辑器是围绕 HTML5 和 CSS3 构建的，因此您可以非常轻松地更改样式表，我在下面记录了如何进行此特定更改，尽管您可以将相同的原则应用于编辑：

一步一步

您需要做的第一件事是找到您要设置样式的元素的实例，在这种情况下，我创建了一个新的空文件，其中包含文本 //TODO: is too subtle。

1. 您现在需要为单词 TODO 找到合适的选择器，只需将光标放在单词 TODO 的字母之间，然后按 CtrlAltShiftP 或从command palette 中选择Editor: Log Cursor Scope。
2. 适用于该位置的选择器从顶部最不具体到底部最具体列出，在这种情况下，您希望最具体的选择器位于底部，继续并将其复制到剪贴板中。
3. 接下来您需要打开您的个人样式表，您可以通过选择“编辑”然后选择“样式表...”来完成此操作，您也可以从命令面板中选择Application: Open Your Stylesheet。
4. 滚动到样式表的底部并粘贴第 2 步中的选择器，您需要在开头添加一个句点（句号）以使其成为有效的选择器。
5. 继续添加您喜欢的样式，例如您的 VIM 样式偏好：

    atom-text-editor::shadow .type.class.todo {
      background-color: yellow;
      color: black;
      font-style: normal;
    }

6. 最后保存您的样式表并切换回您的测试文档以查看产生的更改。

感谢 zypro 指出我的原始答案没有考虑到在 recent versions of Atom 中使用 Shadow DOM。

更新：在某些时候，Atom 摆脱了 Shadow DOM。我使用的是 1.34.0 版本，它在上述样式表中包含以下条目：

atom-text-editor.editor .syntax--type.syntax--class.syntax--todo {
    background-color: yellow;
    color: black;
    font-style: normal;
}

另外，对于 Python（和其他一些语言），您需要在核心设置中取消选中“使用树保姆解析器”。