Atom编辑器中的渐变滚动条

Question

我想自定义我的Atom编辑器，这样当父滚动条没有与光标悬停时，所有滚动条都会淡出。为了实现这一点，我在styles.less样式表中添加了以下几行：

atom-text-editor.editor {
.horizontal-scrollbar, .vertical-scrollbar {
opacity: 0.2;
transition: opacity 250ms;
}
.scroll-view:hover .horizontal-scrollbar {
opacity: 1;
}
.scroll-view:hover .vertical-scrollbar {
opacity: 1;
}
}

这对于主编辑器视图非常适用。当存在两个或多个窗格时，悬停文件的滚动条将以全色显示，而其他窗格将淡出。不幸的是，这只适用于文件，而不适用于树视图。我该如何调整上面的代码以包括树状视图的滚动条以及文件的滚动条？我使用的是Atom材质UI主题。

Answer 1

通过向styles.less添加以下代码来解决此问题

// fading scrollbars when pane not hovered
.pane:not(:hover) {
::-webkit-scrollbar {
&-thumb {
background-color: rgba(68, 169, 249, 0.3);
}
}
}