Skip to content

svelte.dev and kit.svelte.dev docs scrollbar unclickable #13528

@ixxie

Description

@ixxie

Describe the bug

The .on-this-page navigation <aside> element has z-index: 2 and obscures the page's scrollbar. Scrolling is still possible with mouse wheel / gestures, but interacting with the scrollbar is impossible by directly clicking on it.

Changing left: calc(100vw - (var(--sidebar-width))) to left: calc(100vw - (var(--sidebar-width)) -10px) in devtools resolves the issue for me. I wanted to make a PR but I couldn't get the dev server running 🤷.

This has been a significant annoyance for me for months now. It can seem minor, but for a laptop like mine the scrolling gesture is very uncomfortable.

image

Reproduction

Browse to the Svelte docs or the SvelteKit docs with Chrome or Firefox, place your mouse on the page's scrollbar, and try to move it.

Logs

No response

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (4) x64 Intel(R) Core(TM) i7-2640M CPU @ 2.80GHz
    Memory: 1.93 GB / 7.89 GB
  Binaries:
    Node: 22.9.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.3 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.12.1 - ~\AppData\Local\pnpm\pnpm.EXE
  Browsers:
    Edge: Chromium (127.0.2651.74)

Severity

annoyance

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions