Skip to content

Instantly share code, notes, and snippets.

@nashv
Forked from Sporif/dark-scrollbar.as.css
Last active June 16, 2018 16:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nashv/8abec4ea5fe3aa3a68041bd0a43fac0f to your computer and use it in GitHub Desktop.
Save nashv/8abec4ea5fe3aa3a68041bd0a43fac0f to your computer and use it in GitHub Desktop.
Thin, dark scrollbars for Firefox 57+ Quantum. Designed to match the dark theme. Tested on Windows 10. Requires https://gist.github.com/Sporif/db6b3440fba0b1bcf5477afacf93f875
/* remove incremental scroll buttons located at scrollbar ends.
important note:
only partially zero out height/width dimensions
to prevent entire scrollbar from disappearing
(ie, scrollbarbutton collapse results in scrollbar collapse)
*/
scrollbar[orient='vertical'] > scrollbarbutton
{
min-height: 0mm !important;
}
scrollbar[orient='horizontal'] > scrollbarbutton
{
min-width: 0mm !important;
}
/* boilerplate */
scrollbar,
scrollbar > slider,
scrollbar > slider > thumb,
scrollbar > scrollbarbutton
{
/* min-width: 2px important;
min-height: /*[[width]]*/;
}
scrollbar > slider,
scrollbar > slider > thumb,
scrollbar > scrollbarbutton
{
-moz-appearance: none !important;
}
scrollbar, scrollbar > scrollbarbutton
{
border: none !important;
background: #111!important;
width: 10px !important;
min-width: 10px !important;
}
scrollbar[orient='horizontal'] > slider > thumb
{
/* min-width: [[thumb_min_length]] */;
}
scrollbar[orient='vertical'] > slider > thumb
{
/* min-height: /*[[thumb_min_length]]*/;
}
/* scrollbar style */
scrollbar
{
border: none !important;
background: #333!important;
}
scrollbar > slider
{
border: none !important;
background: #333!important;
}
scrollbar > slider > thumb
{
border: none !important;
background: #555!important;
border: 2px solid;
border-radius: 0px;
/*border-radius: /*[[thumb_corner_radius]]*/;
}
scrollbar > slider > track
{
background: #111!important;
}
scrollbar > slider > track:active
{
background: #111!important;
}
scrollbar > slider > thumb:focus,
scrollbar > slider > thumb:hover,
scrollbar > slider > thumb:active
{
background-color: #308FE2!important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment