如何在原子编辑器中更改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或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指出我的原始答案没有说明在最新版本的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(和其他一些语言),您需要取消选中Core设置中的"Use Tree Sitter Parsers".