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

Emile Bangma

2026-01-20 b4fb0e66821b8a597fb14e31dc3f59c12fef00f3

 quartz/components/styles/explorer.scss

@@ -6,6 +6,7 @@
    & > :not(.sidebar.left:has(.explorer)) {
      transition: transform 300ms ease-in-out;
    }

    &.lock-scroll > :not(.sidebar.left:has(.explorer)) {
      transform: translateX(100dvw);
      transition: transform 300ms ease-in-out;
@@ -33,8 +34,10 @@

  min-height: 1.2rem;
  flex: 0 1 auto;

  &.collapsed {
    flex: 0 1 1.2rem;

    & .fold {
      transform: rotateZ(-90deg);
    }
@@ -118,7 +121,10 @@
    list-style: none;
    margin: 0;
    padding: 0;
    overscroll-behavior: contain;

    &.explorer-ul {
      overscroll-behavior: contain;
    }

    & li > a {
      color: var(--dark);
@@ -133,12 +139,16 @@
  }

  .folder-outer {
    visibility: collapse;
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-in-out;
    transition-property: grid-template-rows, visibility;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
  }

  .folder-outer.open {
    visibility: visible;
    grid-template-rows: 1fr;
  }

@@ -265,6 +275,8 @@

.mobile-no-scroll {
  @media all and ($mobile) {
    overscroll-behavior: none;
    .explorer-content > .explorer-ul {
      overscroll-behavior: contain;
    }
  }
}