Advertisement
csako

Floating Scrollbar Win10 style

Feb 4th, 2019
169
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.23 KB | None | 0 0
  1. @namespace url(http: //www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);\
  2. :not(select):not(hbox) > scrollbar {\
  3.  -moz-appearance: none!important;\
  4.  position: relative!important;\
  5.  box-sizing: border-box!important;\
  6.  background-color: transparent !important;\
  7.  background-image: none !important;\
  8.  z-index: 2147483647 !important;\
  9.  padding: 0px !important;\
  10.  display: flex!important;\
  11.  justify-content: flex-end !important;\
  12.  pointer-events: auto !important;\
  13.  width: auto!important;\
  14. }\
  15. :not(select):not(hbox) > scrollbar thumb {\
  16.  -moz-appearance: none!important;\
  17.  border-radius: 0px!important;\
  18.  background-color: rgba(100, 100, 100, 0) !important;\
  19.  pointer-events: auto !important;\
  20. }\
  21. :not(select):not(hbox) > scrollbar[orient = "vertical"] {\
  22.  width: 16px!important;\
  23.  -moz-margin-start: -16px !important;/*margin to fill the whole render window with content and overlay the scrollbars*/\
  24. }\
  25. :not(select):not(hbox) > scrollbar[orient = "horizontal"] {\
  26.  height: 16px!important;\
  27.  margin-top: -16px !important;\
  28. }\
  29. :not(select):not(hbox) > scrollbar[orient = "vertical"] thumb {\
  30.  border-left: 2px solid rgba(90, 90, 90, 0.75);\
  31.  min-height: 16px !important;\
  32.  transform: translate(12px, 0px) !important;\
  33.  transition: transform 0.1s linear;\
  34. }\
  35. :not(select):not(hbox) > scrollbar[orient = "horizontal"] thumb {\
  36.  border-top: 2px solid rgba(90, 90, 90, 0.75) !important;\
  37.  min-width: 16px !important;\
  38.  transform: translate(0px, 12px) !important;\
  39.  transition: transform 0.1s linear !important;\
  40. }\
  41. :not(select):not(hbox) > scrollbar:hover {\
  42.  background-color: rgba(90, 90, 90, 0.15) !important;\
  43. }\
  44. :not(select):not(hbox) > scrollbar:hover thumb {\
  45.  background-color: rgba(100, 100, 100, 0.5)!important;\
  46.  border-left: 0px !important;\
  47.  border-top: 0px !important;\
  48.  transform: translate(0px, 0px) !important;\
  49.  transition: transform 0.1s linear !important;\
  50. }\
  51. :not(select):not(hbox) > scrollbar thumb:hover {\
  52.  background-color: rgba(100, 100, 100, 0.8)!important;\
  53. }\
  54. :not(select):not(hbox) > scrollbar thumb:active {\
  55.  background-color: rgba(110, 110, 110, 1)!important;\
  56. }\
  57. :not(select):not(hbox) > scrollbar scrollbarbutton, :not(select):not(hbox) > scrollbar gripper {\
  58.  display: none !important;\
  59. }\
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement