This is a less disruptive version of#214
This simply increases the width of the sidebar to 260px (not set in stone, happy to discuss the appropriate value)

Two more things I considered that we could discuss but didn't include in the PR

Adding another breakpoint beyond 1024px which would further increase the sidebar width (not sure if static breakpoints are the way to go though)
Making the sidebar more flexible by only defining min/max-width and letting the contents determine the exact value. This would require a larger change to the CSS as the sidebar is currently static (it relies on a fixed margin on.bodywrapper). Though we could convert it to flexbox as well.

Feedback welcome!

📚 Documentation preview 📚:https://python-docs-theme-previews--218.org.readthedocs.build/

Bump sidebar width to 260px

0a13c64

Copy link

Member

AA-Turner commentedFeb 2, 2025

Could we do a percentage width of say 25% (so 256px at the lower bound before the sidebar disappears)?

Copy link

MemberAuthor

tomasr8 commentedFeb 2, 2025

Just to clarify, you mean to have a fixed sidebar width of 256px or some kind of dynamic sizing? The latter would require additional style changes

Copy link

Member

AA-Turner commentedFeb 2, 2025

A width defined in % or vw units, yes.

Copy link

MemberAuthor

tomasr8 commentedFeb 2, 2025

We might need some more breakpoints for that -25vw might be too much on very wide screens

Copy link

Member

hugovk commentedFeb 2, 2025

And maybe an upper bound where it's a fixed width, compare:

https://pydata-sphinx-theme.readthedocs.io/en/stable/user_guide/index.html

As it stands, this is PR good for mobile, the sidebar is always shown:

Screenshot

tomasr8 added2 commits

February 3, 2025 17:56

Use less specific selectors

7430795

Make sidebar width more flexible

dec0899

tomasr8 changed the title~~Bump sidebar width to 260px~~Make sidebar width more flexible

Feb 3, 2025

Copy link

MemberAuthor

tomasr8 commentedFeb 3, 2025

I made the sidebar more like the pydata theme Hugo shared. The width is now calculated asmin(25vw, 350px) so it is at maximum350px and at minimum256px (just before it gets hidden).