Use a different CSS class to mark TOC levels as visible

src/pydata_sphinx_theme/assets/styles/components/_toc-inpage.scss

@@ -12,7 +12,7 @@ nav.page-toc {
     display: none;
 
     // So we can manually specify a level as visible in the config
-    &.visible {
+    &.pst-show_toc_level {
       display: block;
     }
   }

src/pydata_sphinx_theme/toctree.py

@@ -427,7 +427,7 @@ def add_header_level_recursive(ul, level):
             if ul is None:
                 return
             if level <= (context["theme_show_toc_level"] + 1):
-                ul["class"] = [*ul.get("class", []), "visible"]
+                ul["class"] = [*ul.get("class", []), "pst-show_toc_level"]
             for li in ul("li", recursive=False):
                 li["class"] = [*li.get("class", []), f"toc-h{level}"]
                 add_header_level_recursive(li.find("ul", recursive=False), level + 1)

tests/test_build.py

@@ -52,8 +52,8 @@ def test_toc_visibility(sphinx_build_factory) -> None:
     index_html = sphinx_build.html_tree("index.html")
 
     # The 3rd level headers should be visible, but not the fourth-level
-    assert "visible" in index_html.select(".toc-h2 ul")[0].attrs["class"]
-    assert "visible" not in index_html.select(".toc-h3 ul")[0].attrs["class"]
+    assert "pst-show_toc_level" in index_html.select(".toc-h2 ul")[0].attrs["class"]
+    assert "pst-show_toc_level" not in index_html.select(".toc-h3 ul")[0].attrs["class"]
 
 
 def test_icon_links(sphinx_build_factory, file_regression) -> None: