UNPKG

vue-scrollbars

Version:

A light vue scrollbar comes from jquery.scrollbar.js

59 lines (55 loc) 2.38 kB
/*************** SIMPLE OUTER SCROLLBAR ***************/ .scrollbar-outer > .scroll-element, .scrollbar-outer > .scroll-element div{ border:none; margin:0; padding:0; position:absolute; z-index:10; } .scrollbar-outer > .scroll-element{ background-color:#ffffff; } .scrollbar-outer > .scroll-element div{ display:block; height:100%; left:0; top:0; width:100%; } .scrollbar-outer > .scroll-element.scroll-x{ bottom:0; height:12px; left:0; width:100%; } .scrollbar-outer > .scroll-element.scroll-y{ height:100%; right:0; top:0; width:12px; } .scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer{ height:8px; top:2px; } .scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer{ left:2px; width:8px; } .scrollbar-outer > .scroll-element .scroll-element_outer{ overflow:hidden; } .scrollbar-outer > .scroll-element .scroll-element_track{ background-color:#eeeeee; } .scrollbar-outer > .scroll-element .scroll-element_outer, .scrollbar-outer > .scroll-element .scroll-element_track, .scrollbar-outer > .scroll-element .scroll-bar{ -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; } .scrollbar-outer > .scroll-element .scroll-bar{ background-color:#d9d9d9; } .scrollbar-outer > .scroll-element .scroll-bar:hover{ background-color:#c2c2c2; } .scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar{ background-color:#919191; } /* scrollbar height/width & offset from container borders */ .scrollbar-outer > .scroll-content.scroll-scrolly_visible{ left:-12px; margin-left:12px; } .scrollbar-outer > .scroll-content.scroll-scrollx_visible{ top:-12px; margin-top:12px; } .scrollbar-outer > .scroll-element.scroll-x .scroll-bar{ min-width:10px; } .scrollbar-outer > .scroll-element.scroll-y .scroll-bar{ min-height:10px; } /* update scrollbar offset if both scrolls are visible */ .scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track{ left:-14px; } .scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track{ top:-14px; } .scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size{ left:-14px; } .scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size{ top:-14px; }