css/sass/partials/_vendor/_nano.scss
/** initial setup **/
.kb-nano {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.kb-nano .kb-nano-content {
position: absolute;
overflow: scroll;
overflow-x: hidden;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.kb-nano .kb-nano-content:focus {
//outline: thin dotted;
}
.kb-nano .kb-nano-content::-webkit-scrollbar {
visibility: hidden;
}
.has-scrollbar .kb-nano-content::-webkit-scrollbar {
visibility: visible;
}
.kb-nano > .pane {
background: rgba(0, 0, 0, .25);
position: absolute;
width: 15px;
right: 0;
top: 0;
bottom: 0;
visibility: hidden \9; /* Target only IE7 and IE8 with this hack */
opacity: .01;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
transition: .2s;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
z-index: 20;
}
.kb-nano > .pane > .slider {
background: #eaeaea;
background: rgba(255, 255, 255, 0.9);
position: relative;
margin: 0 1px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
}
.kb-nano:hover > .pane, .pane.active, .pane.flashed {
visibility: visible \9; /* Target only IE7 and IE8 with this hack */
opacity: 0.99;
}