Add 2nd kind of scrollbar mixin
Square corners vs round, good for dropdownspull/10616/head
parent
6783248eb0
commit
ec6bc815a7
|
@ -41,6 +41,35 @@ $scrollbar-offset: 3px;
|
|||
@mixin custom-scrollbar($trackColor, $handleColor) {
|
||||
&::-webkit-scrollbar {
|
||||
width: $scrollbar-width;
|
||||
|
||||
&-button {
|
||||
background-color: $trackColor;
|
||||
}
|
||||
&-track {
|
||||
background-color: $trackColor;
|
||||
}
|
||||
&-track-piece {
|
||||
background-color: $trackColor;
|
||||
border: $scrollbar-offset solid $trackColor;
|
||||
border-radius: ($scrollbar-width / 2);
|
||||
}
|
||||
&-thumb {
|
||||
background-color: $handleColor;
|
||||
border: $scrollbar-offset solid $trackColor;
|
||||
border-radius: ($scrollbar-width / 2);
|
||||
}
|
||||
&-corner {
|
||||
background-color: $trackColor;
|
||||
}
|
||||
}
|
||||
&::-webkit-resizer {
|
||||
background-color: $trackColor;
|
||||
}
|
||||
}
|
||||
@mixin custom-scrollbar-round($trackColor, $handleColor) {
|
||||
&::-webkit-scrollbar {
|
||||
width: $scrollbar-width;
|
||||
border-top-right-radius: $radius;
|
||||
border-bottom-right-radius: $radius;
|
||||
|
||||
&-button {
|
||||
|
@ -48,6 +77,7 @@ $scrollbar-offset: 3px;
|
|||
}
|
||||
&-track {
|
||||
background-color: $trackColor;
|
||||
border-top-right-radius: $radius;
|
||||
border-bottom-right-radius: $radius;
|
||||
}
|
||||
&-track-piece {
|
||||
|
|
Loading…
Reference in New Issue