更改原子文本编辑器窗格滚动条颜色

更改原子文本编辑器窗格滚动条颜色

本文介绍了更改原子文本编辑器窗格滚动条颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我刚刚从崇高的文本转向原子,并试图应用我平常的主题。不幸的是我使用的主题(



我试着用!important 语句将相同的 :: - webkit-scrollbar CSS放入原子文本编辑器,但没有运气。

解决方案

你很近,你必须在 .scrollbars - 可见 - 总是

  .scrollbars-visible-always {
:: - webkit-scrollbar {
background-color:#262626;

& -track {}

& -thumb {
背景颜色:#404040;

&:window-inactive {
background-color:rgb(116,115,105);
}
}

& -corner {
background-color:#262626;
}
}
}


I have just switched to atom from sublime text and tried to apply my usual themes. Unluckily the theme that I use (spacegray eighties sublime port) does not incorporate the correct theme for the scrollbars. I managed to fix the look of the scrollbars in the tree-view panel. However, I cannot apply the same to the atom-text-editor for some reason. My styles.less is the following:

atom-text-editor {
  // Apply same scrollbar color fix.
}

// Scrollbar color fix for SpaceGray
::-webkit-scrollbar {
  background-color: #262626;

  &-track {}

  &-thumb {
    background-color: #404040;

    &:window-inactive {
      background-color: rgb(116, 115, 105);
    }
  }

  &-corner {
    background-color: #262626;
  }
}

And here a preview of my problem:

I tried putting the same ::-webkit-scrollbar CSS into the atom-text-editor with !important statements, but with no luck.

解决方案

You were close, you have to wrap your styles inside .scrollbars-visible-always:

.scrollbars-visible-always {
  ::-webkit-scrollbar {
    background-color: #262626;

    &-track {}

    &-thumb {
      background-color: #404040;

      &:window-inactive {
        background-color: rgb(116, 115, 105);
      }
    }

    &-corner {
      background-color: #262626;
    }
  }
}

这篇关于更改原子文本编辑器窗格滚动条颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-21 08:33