keeweb/app/styles/common/_scroll.scss

53 lines
1.2 KiB
SCSS

.scroller {
overflow-y: scroll;
height: 100%;
&::-webkit-scrollbar {
width: 0;
}
&__bar-wrapper {
pointer-events: none;
position: absolute;
z-index: 3;
top: 10px;
bottom: 10px;
right: 1px;
width: 7px;
}
&__bar {
position: absolute;
z-index: 1;
width: 7px;
border-radius: 3px;
pointer-events: auto;
-webkit-app-region: no-drag;
}
}
@media screen and (-moz-windows-theme) {
.scroller {
@-moz-document url-prefix() {
margin-right: 0 !important;
padding-right: 0 !important;
}
}
}
@mixin scrollbar-on-hover {
.scroller__bar-wrapper {
> .scroller__bar {
background-color: transparent;
transition: background-color $base-duration $base-timing;
}
}
&:hover .scroller__bar-wrapper {
> .scroller__bar {
transition: background-color $slow-transition-out;
background-color: rgba(136, 136, 136, 0.2);
&:hover {
transition: background-color $slow-transition-in;
background-color: rgba(136, 136, 136, 0.8);
}
}
}
}