reactjs / reactjs/react.dev

Cannot access entire official React JS Docs without scroll

Open
#641 2 comments 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
11.8k
Forks
7.9k
Avg merge
1d 11h
Merged PRs (30d)
11

Description

Cannot access the entire reactjs docs (via reactjs.org/docs) without scroll.

There are two scrollable areas in the reactjs docs - the left side with the explanation and code examples and the right (sidebar) with links to the rest of the docs. I cannot scroll down the right side to access say the entire advanced guides list if I do not have a scroll in my mouse (or touchpad).
The browser scrollbar only maps to the left (explanation) side.

Ideally, this can be seen on any maximised browser window on any 13 inch laptop with default display settings. Just visit https://reactjs.org/docs/ .

The issue does not exist on very large screens as the entire list on right navigation sidebar is seen and the issue also is not present on mobile devices as a responsive design takes over which hides the right sidebar and only makes it appear on a new menu button that appears.

Current Workaround:

Minimise browser window width to access the responsive mobile view and use the scrollbar then.
Or zoom out in your browser window to minimise the view enough to see the entire list and then access what you need.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue at https://reactjs.org/docs/ in a maximized browser on a 13-inch laptop or equivalent viewport, then inspect the documentation layout and right navigation sidebar. Done means the full sidebar can be reached with standard browser scrolling on desktop, while preserving the existing responsive behavior on mobile.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
accessibility, documentation
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.