deal with browsers that don't support hiding scrollbars (somewhat)
This commit is contained in:
parent
2e10c1b0a3
commit
f4447eb3a0
1 changed files with 18 additions and 16 deletions
20
src/App.scss
20
src/App.scss
|
@ -27,14 +27,10 @@ body {
|
|||
}
|
||||
}
|
||||
|
||||
// Apply Custom scrollbars
|
||||
// ## Custom scrollbars
|
||||
// Only show custom scrollbars on devices which
|
||||
// have a cursor/pointer to operate them
|
||||
@media (any-pointer: fine) {
|
||||
// Body should have background to scrollbar otherwise it will use white (body color?)
|
||||
body {
|
||||
background: var(--bg);
|
||||
scrollbar-color: var(--btn) var(--bg);
|
||||
}
|
||||
|
||||
* {
|
||||
scrollbar-color: var(--btn) transparent;
|
||||
|
||||
|
@ -96,6 +92,10 @@ body {
|
|||
}
|
||||
// stylelint-enable selector-pseudo-class-no-unknown
|
||||
}
|
||||
// Body should have background to scrollbar otherwise it will use white (body color?)
|
||||
html {
|
||||
scrollbar-color: var(--selectedMenu) var(--wallpaper);
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
|
@ -225,8 +225,9 @@ nav {
|
|||
margin-left: calc(var(--___paddingIncrease) * -1);
|
||||
padding-left: calc(var(--___paddingIncrease) + var(--___columnMargin) / 2);
|
||||
|
||||
// Only show custom scrollbars on devices which
|
||||
// have a cursor/pointer to operate them
|
||||
// On browsers that don't support hiding scrollbars we enforce "show scrolbars" mode
|
||||
// might implement old style of hiding scrollbars later if there's demand
|
||||
@supports (scrollbar-width: none) or (-webkit-text-fill-color: initial) {
|
||||
&:not(.-show-scrollbar) {
|
||||
scrollbar-width: none;
|
||||
margin-right: calc(var(--___paddingIncrease) * -1);
|
||||
|
@ -237,6 +238,7 @@ nav {
|
|||
width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.panel-heading.-sticky {
|
||||
top: calc(var(--columnGap) / -2);
|
||||
|
|
Loading…
Reference in a new issue