ATOM(编辑)：修改现有主题并另存为新主题 [英] Atom (editor): modify existing theme and save as a new one

问题描述

我不想从头开始创建整个主题。

1. 我想使用现有主题。
2. 我想对几个元素进行一些细微的样式更改(如颜色)。
3. 我不想保存原始主题中的更改，而是保存在其副本中。

例如。

1. 我已安装Bade3 Notepad主题。
2. 我喜欢记事本++的突出显示，但我发现灰色的字符串太轻了。
3. 根据Syntax Highlighting Guide for AtomSyntax Highlighting Guide for Atom我在开发人员模式下运行了Atom。
4. 我已打开包含一些带引号的字符串的文件。
5. 右键单击某个带引号的字符串，然后选择检查元素

6. 在样式选项卡中更改

   中的颜色值

   .string.quoted.php{ 颜色：#8b8b8b； )

7. 更改将应用于实际示例代码，以便我可以调整颜色。

8. 假设我对#107000没意见

现在我希望保存此更改。

推荐答案

您可以通过个人样式表实现此目的，而无需创建或编辑主题。

1. 您的"样式表Ctrl-Shift-P并键入Application: Open Your Style Sheet。

2. 将在Atom中打开一个文件，如下所示：

   // style the background color of the tree view
   .tree-view {
     // background-color: whitesmoke;
   }
   
   // style the background and foreground colors on the atom-text-editor-element itself
   atom-text-editor {
     // color: white;
     // background-color: hsl(180, 24%, 12%);
   }
   
   // To style other content in the text editor's shadow DOM, use the ::shadow expression
   atom-text-editor::shadow {
     // Add Your Styles Here
   }
   

3. 在atom-text-editor::shadow {(第13行)和结束}(第15行)之间的区域添加您更改的样式：

   .string.quoted.php { color: #8b8b8b; }
   

4. 保存样式表并检查它是否在您的编辑器中按预期工作，无需重新加载或重新启动该编辑器。

注意：如果您在Atom设置中取消选中Use Shadow DOM复选框，并通过Ctrl-，访问，则需要将样式放在atom-text-editor {(第7行)和}(第10行)之间。尝试在启用影子DOM的情况下使用Atom，因为禁用它的选项将在将来的版本中消失。

下面是一个简短的动画，演示了我在Atom 1.8 Beta中执行此操作所采取的步骤：

这篇关于ATOM(编辑)：修改现有主题并另存为新主题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！