Skip to content

Remove horizontal header bar and improve responsive layout for PyTorch docs#223

Merged
svekars merged 21 commits intopytorch_sphinx_theme2from
redo-horizon-bar
Jan 30, 2026
Merged

Remove horizontal header bar and improve responsive layout for PyTorch docs#223
svekars merged 21 commits intopytorch_sphinx_theme2from
redo-horizon-bar

Conversation

@svekars
Copy link
Contributor

@svekars svekars commented Jan 23, 2026

This PR removes the horizontal header bar (LF header) and introduces a cleaner wider layout that uses white space more efficiently.

Header & Navigation:

  • Disabled the horizontal header bar (show_lf_header = False)
  • Added a new "Go to pytorch.org" link in the navbar (desktop) and mobile sidebar for navigation back to the main site
  • Created custom navbar-logo.html that displays PyTorch logo by default while allowing sites to override with custom logos
  • Custom header.html template to properly inject the pytorch.org link and handle mobile/desktop logo visibility

Layout Improvements:

  • Made header container full-width (max-width: 100%) with consistent padding
  • Reduced sidebar widths (15% with min-width constraints) to give more space to main content
  • Added proper content alignment when primary sidebar is hidden, aligning with navbar items
  • Improved padding for sidebars with proper responsive breakpoints

Mobile Responsiveness:

  • Added dedicated mobile logo that appears next to hamburger menu
  • Version/version-switcher now appears in mobile sidebar instead of header
  • Custom sidebar-primary.html ensures consistent navigation on mobile
  • pytorch.org link appears in mobile sidebar navigation

Search Improvements:

  • Hidden the "Hide Search Matches" button that Sphinx displays
  • Removed search highlighting from footer and sidebars (only shows in main content)

CSS Variables:

  • Added --pst-sidebar-secondary override for smaller secondary sidebar
  • Added --navbar-brand-width variable that ensures that when there's no primary sidebar, the content doesn't just flush to the left edge but instead aligns visually with the navbar items above it.

Fixed right sidebar border continuity:

  • Problem: The vertical border in the right sidebar was breaking between multiple .sidebar-secondary-item sections because pydata-sphinx-theme applies the border to each item individually.
  • Solution: Moved border-left from individual .sidebar-secondary-item elements to the parent .sidebar-secondary-items wrapper, creating a single continuous border that spans all sections.

This PR removes the horizontal header bar (LF header)
and introduces a cleaner wider layout that uses white space
more efficiently.

- Disabled the horizontal header bar (show_lf_header = False)
- Added a new "Go to pytorch.org" link in the navbar (desktop)
  and mobile sidebar for navigation back to the main site
- Created custom navbar-logo.html that displays PyTorch logo
  by default while allowing sites to override with custom logos
- Custom header.html template to properly inject the pytorch.org
  link and handle mobile/desktop logo visibility

- Made header container full-width (max-width: 100%) with consistent
  padding
- Reduced sidebar widths (15% with min-width constraints) to give more
  space to main content
- Added proper content alignment when primary sidebar is hidden,
  aligning with navbar items
- Improved padding for sidebars with proper responsive breakpoints

- Added dedicated mobile logo that appears next to hamburger menu
- Version/version-switcher now appears in mobile sidebar instead of
  header
- Custom sidebar-primary.html ensures consistent navigation on mobile
- pytorch.org link appears in mobile sidebar navigation

- Hidden the "Hide Search Matches" button that Sphinx displays
- Removed search highlighting from footer and sidebars (only shows
  in main content)
@netlify
Copy link

netlify bot commented Jan 23, 2026

Deploy Preview for pytorchsphinxtheme ready!

Name Link
🔨 Latest commit f91f998
🔍 Latest deploy log https://app.netlify.com/projects/pytorchsphinxtheme/deploys/697ce867ebe0b40007d59300
😎 Deploy Preview https://deploy-preview-223--pytorchsphinxtheme.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@meta-cla meta-cla bot added the cla signed label Jan 23, 2026
@svekars svekars changed the title Adding PyTorch Sphinx theme 2 Remove horizontal header bar and improve responsive layout for PyTorch docs Jan 23, 2026
@svekars
Copy link
Contributor Author

svekars commented Jan 24, 2026

@svekars svekars merged commit b16339b into pytorch_sphinx_theme2 Jan 30, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants