Wide sidebars cause left-right code scrolling

[jlapeyre]

URL to the relevant documentation

Many, or all, tutorials are covered by this issue. Probably other docs.

Here is one example:

https://quantum.cloud.ibm.com/docs/en/tutorials/sample-based-quantum-diagonalization

Please describe the UI problem or feature request.

On some devices and browsers (well the one I use) code boxes get a horizontal scroll bar because the sidebars occupy a lot of horizontal real estate. The rest of the text reflows as it should. But the code does not. Sometimes when I am puzzling over something, I copy the code in question to an editor. Or open the notebook, which otherwise is less pleasant to read than the rendered docs.

• If the sidebars were hideable, or resizeable, the problem would occur much less often.
• If there were a lint requirement on the width of code lines, this might help.

Another reason to have hideable sidebars: I used the online doc pages in a presentation to students. The sidebars are wide and visually busy, distracting from the main text. If you are spending a few tens of seconds on one window, reducing distractions is important.

• A somewhat related, but different, issue #1019

[frankharkins]

Here's some numbers to help with decision making: Code in docs notebooks (which includes all tutorials) is currently limited to 78 characters (Ruff default is 88), although this doesn't seem to apply to comments or docstrings.

https://github.com/Qiskit/documentation/blob/9a164c1154db423b301a1e48ee2554d53959e2dd/docs/ruff.toml#L1

At their shortest width, I counted code blocks on the website to be 48 characters wide.

[abbycross]

Also related: #3780

[jlapeyre]

I confirm that the code in the example above is limited to 78 characters per line. Of course, if I change the text size in the browser, I can make this too many, or too few. In any case, there are other reasons to make the sidebars hideable, as I mentioned above.

On my phone, the same sidebar is present, and it is hideable.

Of course, even if it's decided that it's a good idea, I don't know how hard it is to change, how much of a problem it is, and for how many users. So I can't help much with triage.