Question

我在ubuntu 14.04中使用原子编辑器1.0版稳定版。我的问题是，如何更改当前所选窗口选项卡的背景颜色... （表示当前标签..）通过编辑 style.less 文件？

我试过了，

.tab{ background-color:black; }

更改标签颜色，

但是，此代码仅更改了除当前选项卡颜色之外的所有选项卡颜色。

所以我的问题是，如何通过编辑style.less文件来更改atom编辑器中当前选项卡的颜色？

Answer 1

.tab-bar .tab[data-type="TextEditor"]::after {
  background-color: rgba(20,28,30,0.8);
}

我通过打开开发人员工具 Ctrl + Shift + I 找到了这个解决方案，并使用放大镜工具查找元素。

Answer 2

这些都不适合我。这是我的解决方案（Atom 1.22.1）：

.tab-bar .tab.active[data-type$="Editor"] {
 background-color: #167373;
}

Answer 3

您必须复制此代码并粘贴到styles.less文件中。

//My awesome tab
.tab-bar .tab.active[data-type="TextEditor"]::after {
background-color: black;
border-bottom: whiTe;
}

.tab-bar .tab.active[data-type$="Editor"] .title {
 background-color: black;
 z-index: 2;
 }

Answer 4

我经常打开多个窗格并在所有窗格中都有标签。 多个窗格带有多个活动标签。这里的其他答案将为＆＃34; active＆＃34;所有窗格中的选项卡，而不是专门针对您选择的选项卡。

问题是selector specificity。

这是一种专门定位您所选标签的方法，无论您打开了多少个窗格：

打开Atom命令面板（在MAC shift + cmd + p上）并搜索＆＃39; style＆＃39;。

选择＆＃39;应用程序：打开样式表＆＃39;。

的选项

添加此样式：

.pane.active {
    .tab.active {
        background-color: #00BCD4;
    }
}

保存style.less表并查看更改！

注意：在使用Atom Material UI theme时对此进行了测试，但您使用的主题并不重要。

Answer 5

在选择标签时，添加一个类=＆＃34;标签激活＆＃34;

以及样式下的style.less文件

.tab.active {
    background-color:black;
}

Answer 6

这是我对原子1.23.1的解决方案文件＆gt; Stylesheed＆gt; styles.less

.texteditor.tab.sortable.active::before, .texteditor.tab.sortable.active, .texteditor.tab.sortable.active::after {
        background-image: -webkit-linear-gradient(top, #35404a, #4A7FB2);
}

美丽的蓝色渐变。

如何在原子编辑器中更改当前活动的窗口选项卡颜色

6 个答案: