fix(explorer): mobile scroll containment (#2283)

* fix(explorer): mobile scroll contaiment

* only apply scroll containment to explorer on mobile
This commit is contained in:
Emile Bangma 2026-01-20 18:37:40 +01:00 committed by GitHub
parent f346a01296
commit b4fb0e6682
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -6,6 +6,7 @@
& > :not(.sidebar.left:has(.explorer)) { & > :not(.sidebar.left:has(.explorer)) {
transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out;
} }
&.lock-scroll > :not(.sidebar.left:has(.explorer)) { &.lock-scroll > :not(.sidebar.left:has(.explorer)) {
transform: translateX(100dvw); transform: translateX(100dvw);
transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out;
@ -33,8 +34,10 @@
min-height: 1.2rem; min-height: 1.2rem;
flex: 0 1 auto; flex: 0 1 auto;
&.collapsed { &.collapsed {
flex: 0 1 1.2rem; flex: 0 1 1.2rem;
& .fold { & .fold {
transform: rotateZ(-90deg); transform: rotateZ(-90deg);
} }
@ -118,7 +121,10 @@ button.desktop-explorer {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
&.explorer-ul {
overscroll-behavior: contain; overscroll-behavior: contain;
}
& li > a { & li > a {
color: var(--dark); color: var(--dark);
@ -269,6 +275,8 @@ li:has(> .folder-outer:not(.open)) > .folder-container > svg {
.mobile-no-scroll { .mobile-no-scroll {
@media all and ($mobile) { @media all and ($mobile) {
overscroll-behavior: none; .explorer-content > .explorer-ul {
overscroll-behavior: contain;
}
} }
} }