- 1 year ago
Don't Display Read the Docs Sphinx TOC in Narrow Windows
To prevent the table of contents (TOC) from being displayed in narrow windows when using Sphinx for Read the Docs, you can modify the CSS styling to hide or adjust the TOC behavior. Here's an example of how you can achieve this:
Locate the
theme.css
file in your Sphinx project. It is usually located in the_static
directory within your Sphinx project folder.Open the
theme.css
file in a text editor.Add the following CSS code at the end of the file:
css@media screen and (max-width: 768px) {
/* Hide the table of contents in narrow windows */
#sidebar-wrapper {
display: none;
}
/* Adjust the content width to fill the whole screen */
#content {
width: 100%;
}
}
In this example, the CSS code uses a media query to target screens with a maximum width of 768 pixels (you can adjust this value as needed). It hides the sidebar-wrapper
element that contains the TOC and expands the content
element to occupy the full width of the screen.
Save the theme.css
file.
When the Sphinx documentation is viewed in a narrow window, the table of contents will be hidden, and the content will fill the entire width of the screen, improving the readability and user experience.
Note that this solution assumes you are using the default Sphinx Read the Docs theme. If you are using a custom theme or have made modifications to the CSS, the specific CSS selectors and properties might vary. Adjust the CSS code accordingly to target the appropriate elements in your theme.
After making the CSS modifications, rebuild your Sphinx documentation to apply the changes.