Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Make sidebar width more flexible#218

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
hugovk merged 4 commits intopython:mainfromtomasr8:sidebar-width
Feb 4, 2025
Merged

Conversation

tomasr8
Copy link
Member

@tomasr8tomasr8 commentedFeb 2, 2025
edited by github-actionsbot
Loading

Related issue:#209

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/

@AA-Turner
Copy link
Member

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

@tomasr8
Copy link
MemberAuthor

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

@AA-Turner
Copy link
Member

A width defined in % or vw units, yes.

@tomasr8
Copy link
MemberAuthor

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

@hugovk
Copy link
Member

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

python-docs-theme-previews--218 org readthedocs build_en_218_(iPhone SE)

@tomasr8tomasr8 changed the titleBump sidebar width to 260pxMake sidebar width more flexibleFeb 3, 2025
@tomasr8
Copy link
MemberAuthor

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).

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

Fixed, some of the selectors I was using were too specific.

@@ -140,6 +140,8 @@ span.pre {
}

div.sphinxsidebar {
display: flex;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Is flexbox required here?

Copy link
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

This allows me to remove the hardcodedwidth: 217px; fromdiv.sphinxsidebarwrapper

@hugovk
Copy link
Member

(There's a conflict after merging#219.)

@tomasr8
Copy link
MemberAuthor

(There's a conflict after merging#219.)

Will fix it in a bit

@hugovkhugovk merged commitb6a1724 intopython:mainFeb 4, 2025
14 checks passed
@hugovk
Copy link
Member

Thanks!

tomasr8 reacted with rocket emoji

@tomasr8tomasr8 deleted the sidebar-width branchFebruary 4, 2025 13:33
@tomasr8
Copy link
MemberAuthor

Thanks for the reviews/comments!

hugovk reacted with hooray emoji

@AA-TurnerAA-Turner mentioned this pull requestFeb 4, 2025
@hugovkhugovk mentioned this pull requestApr 3, 2025
Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment
Reviewers

@AA-TurnerAA-TurnerAA-Turner approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

3 participants
@tomasr8@AA-Turner@hugovk

[8]ページ先頭

©2009-2025 Movatter.jp