fix(scrollbars): use standard CSS for scrollbars (#697)
Also use correct SCSS escaping everywhere, and fix a missing semicolon. Fixes #691
This commit is contained in:
parent
7f1ec6036d
commit
58f9c09bb8
|
@ -1,6 +1,10 @@
|
||||||
html {
|
html {
|
||||||
scrollbar-face-color: $scrollbar-face;
|
// Firefox with scrollbar config changes as of 2018-11
|
||||||
scrollbar-track-color: $scrollbar-track;
|
scrollbar-face-color: #{$scrollbar-face};
|
||||||
|
scrollbar-track-color: #{$scrollbar-track};
|
||||||
|
// Firefox nightly as of 2018-11, new standard version
|
||||||
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
|
||||||
|
scrollbar-color: #{$scrollbar-face $scrollbar-track};
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
|
@ -9,22 +13,22 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: $scrollbar-face;
|
background: #{$scrollbar-face};
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background: $scrollbar-face-hover;
|
background: #{$scrollbar-face-hover};
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:active {
|
::-webkit-scrollbar-thumb:active {
|
||||||
background: $scrollbar-face-active;
|
background: #{$scrollbar-face-active};
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-track:hover, ::-webkit-scrollbar-track:active {
|
::-webkit-scrollbar-track, ::-webkit-scrollbar-track:hover, ::-webkit-scrollbar-track:active {
|
||||||
background: $scrollbar-track
|
background: #{$scrollbar-track};
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar-corner {
|
::-webkit-scrollbar-corner {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue