naive-ui/styles/Scrollbar.scss
2019-11-18 18:37:20 +08:00

69 lines
1.7 KiB
SCSS

/* stylelint-disable */
@import './mixins/mixins.scss';
@import './themes/vars.scss';
@include themes-mixin {
@include b(scrollbar) {
.n-scrollbar-rail__scrollbar {
@include fade-in-transition(scrollbar);
position: absolute;
cursor: pointer;
background-color: map-get($scrollbar-color, 'default');
transition: background-color .2s $default-cubic-bezier;
&:hover {
background-color: map-get($scrollbar-color, 'hover');
}
}
@include once {
position: relative;
height: 100%;
@include b(scrollbar-vertical-rail) {
position: absolute;
user-select: none;
-moz-user-select: none;
}
@include b(scrollbar-horizontal-rail) {
position: absolute;
user-select: none;
-moz-user-select: none;
}
.n-scrollbar-horizontal-rail {
left: 0;
right: 0;
bottom: 2.5px;
.n-scrollbar-rail__scrollbar {
right: 0;
}
}
.n-scrollbar-vertical-rail {
position: absolute;
right: 2.5px;
top: 0;
bottom: 0;
.n-scrollbar-rail__scrollbar {
bottom: 0;
}
}
.n-scrollbar-container {
width: 100%;
overflow: scroll;
height: 100%;
max-height: inherit;
scrollbar-width: none;
&::-webkit-scrollbar {
width: 0;
height: 0;
}
}
.n-scrollbar-content {
width: fit-content;
overflow: hidden;
min-width: 100%;
/** stylelint-disable */
width: -moz-fit-content; /* Firefox/Gecko */
width: -webkit-fit-content; /* Chrome */
/* stylelint-enable */
}
}
}
}