From a92dec5dd9f08353d6217c5b82d195f2ec540371 Mon Sep 17 00:00:00 2001 From: Alasdair Wilson Date: Mon, 23 Jun 2025 20:17:11 +0100 Subject: [PATCH 1/5] feat: add nested submenus in docs dropdown --- docs/conf.py | 2 +- src/sunpy_sphinx_theme/__init__.py | 38 +++++-- src/sunpy_sphinx_theme/conf.py | 6 +- .../theme/sunpy/components/navbar_center.html | 100 ++++++++++++++---- .../theme/sunpy/static/js/submenu-toggle.js | 35 ++++++ .../theme/sunpy/static/sunpy_style.css | 19 ++++ 6 files changed, 168 insertions(+), 32 deletions(-) create mode 100644 src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js diff --git a/docs/conf.py b/docs/conf.py index c08486bd..a29b1b78 100644 --- a/docs/conf.py +++ b/docs/conf.py @@ -18,7 +18,7 @@ project = "sunpy-sphinx-theme test docs" author = "The SunPy Community" -copyright = f"{datetime.datetime.now(datetime.UTC).year}, {author}" # NOQA: A001 +copyright = f"{datetime.datetime.now(datetime.timezone.utc).year}, {author}" # NOQA: A001 extensions = [ "sphinx_automodapi.automodapi", "sphinx_automodapi.smart_resolver", diff --git a/src/sunpy_sphinx_theme/__init__.py b/src/sunpy_sphinx_theme/__init__.py index 17ff3c33..0a7ddfbc 100644 --- a/src/sunpy_sphinx_theme/__init__.py +++ b/src/sunpy_sphinx_theme/__init__.py @@ -34,23 +34,39 @@ def default_navbar(): ], ), ( - "Documentation", +"Documentation", [ + # Core packages shown directly ("sunpy", "https://docs.sunpy.org/", 3), - ("ndcube", "https://docs.sunpy.org/projects/ndcube/", 3), + ("aiapy", "https://aiapy.readthedocs.io/", 3), ("drms", "https://docs.sunpy.org/projects/drms/", 3), - ("sunraster", "https://docs.sunpy.org/projects/sunraster/", 3), + ("dkist", "https://docs.dkist.nso.edu/projects/python-tools", 3), + ("ndcube", "https://docs.sunpy.org/projects/ndcube/", 3), + ("roentgen", "https://roentgen.readthedocs.io/", 3), ("sunkit-image", "https://docs.sunpy.org/projects/sunkit-image/", 3), - ("aiapy", "https://aiapy.readthedocs.io/", 3), + ("sunkit-instruments", "https://docs.sunpy.org/projects/sunkit-instruments/", 3), + ("sunkit-magex", "https://docs.sunpy.org/projects/sunkit-magex/", 3), ("sunpy-soar", "https://docs.sunpy.org/projects/soar/", 3), - ("roentgen", "https://roentgen.readthedocs.io/", 3), - ("sunkit-instruments ", "https://docs.sunpy.org/projects/sunkit-instruments/", 3), - ("demcmc", "https://demcmc.readthedocs.io/en/latest/", 3), - ("dkist", "https://docs.dkist.nso.edu/projects/python-tools", 3), ("solarmach", "https://solarmach.readthedocs.io/en/stable/", 3), - ("sunkit-magex", "https://docs.sunpy.org/projects/sunkit-magex/", 3), - ("pyflct", "https://pyflct.readthedocs.io/", 3), - ("radiospectra", "https://docs.sunpy.org/projects/radiospectra/", 3), + ("sunraster", "https://docs.sunpy.org/projects/sunraster/", 3), + # Provisional packages submenu + ( + "Provisional", + [ + ("pyflct", "https://pyflct.readthedocs.io/", 3), + ("radiospectra", "https://docs.sunpy.org/projects/radiospectra/", 3), + ] + ), + # Tools submenu + ( + "Tools", + [ + ("ablog", "https://ablog.readthedocs.io/en/stable/", 3), + ("demcmc", "https://demcmc.readthedocs.io/en/stable/", 3), + ("mpl-animators", "https://docs.sunpy.org/projects/mpl-animators/", 3), + ("streamtracer", "https://docs.sunpy.org/projects/streamtracer/", 3), + ], + ), ], ), ("Packages", "affiliated/", 2), diff --git a/src/sunpy_sphinx_theme/conf.py b/src/sunpy_sphinx_theme/conf.py index 81c1909e..e6271afd 100644 --- a/src/sunpy_sphinx_theme/conf.py +++ b/src/sunpy_sphinx_theme/conf.py @@ -26,8 +26,12 @@ "svg_icon", ] +html_js_files = [ + 'js/submenu-toggle.js', +] + html_theme = "sunpy" html_theme_options = {} html_theme_path = [str(get_html_theme_path())] -html_static_path = [str(get_html_theme_path() / "static")] +html_static_path = [str(get_html_theme_path() / "static")] \ No newline at end of file diff --git a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html index 51f7136e..b4456d31 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html +++ b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html @@ -8,31 +8,93 @@ {% set toggle="collapse" %} {% set list_class="collapse" %} {% endif %} +{% macro render_nav_item(item, depth=0) %} + {% set is_leaf = item[1] is string %} + {% set is_nested = item[1] is iterable and (item[1]|length > 0) and (item[1][0] is sequence or item[1][0] is mapping) %} + + {% if is_leaf %} +
  • + + {{ item[0] }} + +
    • + + {% elif is_nested %} + {% set submenu_id = item[0]|replace(" ", "_")|lower %} +
  • + + +
    • + {% endif %} +{% endmacro %} + + \ No newline at end of file diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js new file mode 100644 index 00000000..f2933265 --- /dev/null +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js @@ -0,0 +1,35 @@ + +document.addEventListener("DOMContentLoaded", function () { + const triggers = document.querySelectorAll('.dropdown-submenu > .dropdown-toggle'); + + triggers.forEach(function (trigger, i) { + // Prevent multiple listeners + trigger.dataset.bound = "true"; + trigger.addEventListener('click', function (e) { + + if (trigger.dataset.processing === "true") { + // Defensive double-bind check to avoid multiple event listeners triggering + return; + } + trigger.dataset.processing = "true"; + setTimeout(() => delete trigger.dataset.processing, 100); + + // stop bootstrap from using this click to close the parent dropdown + e.preventDefault(); + e.stopPropagation(); + + const submenu = trigger.nextElementSibling; + // Close other submenus + const parent = trigger.closest('.dropdown-menu'); + if (parent) { + parent.querySelectorAll('.dropdown-menu.show').forEach(function (open) { + if (open !== submenu) { + open.classList.remove('show'); + } + }); + } + + submenu.classList.toggle('show'); + }); + }); +}); diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css b/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css index 268635e9..9ac22b11 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css @@ -412,3 +412,22 @@ html[data-theme="dark"] .search-button-field:hover { align-items: center; } } + +/* Position submenu beside parent */ +.dropdown-submenu { + position: relative; +} + +/* Initially hidden */ +.dropdown-submenu > .dropdown-menu { + position: absolute; + top: 0; + left: 100%; + display: none; + z-index: 1000; +} + +/* Show when toggled by JS */ +.dropdown-submenu > .dropdown-menu.show { + display: block; +} From d2f9f945601281039b7018b2e1a6272942296c5d Mon Sep 17 00:00:00 2001 From: Alasdair Wilson Date: Mon, 23 Jun 2025 22:12:01 +0100 Subject: [PATCH 2/5] l.i.n.t. --- src/sunpy_sphinx_theme/__init__.py | 4 +- src/sunpy_sphinx_theme/conf.py | 4 +- .../theme/sunpy/components/navbar_center.html | 6 +- .../theme/sunpy/static/js/submenu-toggle.js | 56 +++++++++---------- 4 files changed, 35 insertions(+), 35 deletions(-) diff --git a/src/sunpy_sphinx_theme/__init__.py b/src/sunpy_sphinx_theme/__init__.py index 0a7ddfbc..835eb131 100644 --- a/src/sunpy_sphinx_theme/__init__.py +++ b/src/sunpy_sphinx_theme/__init__.py @@ -34,7 +34,7 @@ def default_navbar(): ], ), ( -"Documentation", + "Documentation", [ # Core packages shown directly ("sunpy", "https://docs.sunpy.org/", 3), @@ -55,7 +55,7 @@ def default_navbar(): [ ("pyflct", "https://pyflct.readthedocs.io/", 3), ("radiospectra", "https://docs.sunpy.org/projects/radiospectra/", 3), - ] + ], ), # Tools submenu ( diff --git a/src/sunpy_sphinx_theme/conf.py b/src/sunpy_sphinx_theme/conf.py index e6271afd..6c605d2e 100644 --- a/src/sunpy_sphinx_theme/conf.py +++ b/src/sunpy_sphinx_theme/conf.py @@ -27,11 +27,11 @@ ] html_js_files = [ - 'js/submenu-toggle.js', + "js/submenu-toggle.js", ] html_theme = "sunpy" html_theme_options = {} html_theme_path = [str(get_html_theme_path())] -html_static_path = [str(get_html_theme_path() / "static")] \ No newline at end of file +html_static_path = [str(get_html_theme_path() / "static")] diff --git a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html index b4456d31..5f93dd6e 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html +++ b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html @@ -51,7 +51,7 @@ {{ render_nav_item(navlink) }} {% endfor %} {% endif %} - + {% if theme_external_links %} {% for external_link in theme_external_links %}
  • @@ -68,7 +68,7 @@ triggers.forEach(function (trigger, i) { // Prevent multiple listeners - trigger.dataset.bound = "true"; + trigger.dataset.bound = "true"; trigger.addEventListener('click', function (e) { if (trigger.dataset.processing === "true") { @@ -97,4 +97,4 @@ }); }); }); - \ No newline at end of file + diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js index f2933265..9c28bdf0 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js @@ -1,35 +1,35 @@ - document.addEventListener("DOMContentLoaded", function () { - const triggers = document.querySelectorAll('.dropdown-submenu > .dropdown-toggle'); - - triggers.forEach(function (trigger, i) { - // Prevent multiple listeners - trigger.dataset.bound = "true"; - trigger.addEventListener('click', function (e) { + const triggers = document.querySelectorAll( + ".dropdown-submenu > .dropdown-toggle", + ); - if (trigger.dataset.processing === "true") { - // Defensive double-bind check to avoid multiple event listeners triggering - return; - } - trigger.dataset.processing = "true"; - setTimeout(() => delete trigger.dataset.processing, 100); + triggers.forEach(function (trigger, i) { + // Prevent multiple listeners + trigger.dataset.bound = "true"; + trigger.addEventListener("click", function (e) { + if (trigger.dataset.processing === "true") { + // Defensive double-bind check to avoid multiple event listeners triggering + return; + } + trigger.dataset.processing = "true"; + setTimeout(() => delete trigger.dataset.processing, 100); - // stop bootstrap from using this click to close the parent dropdown - e.preventDefault(); - e.stopPropagation(); + // stop bootstrap from using this click to close the parent dropdown + e.preventDefault(); + e.stopPropagation(); - const submenu = trigger.nextElementSibling; - // Close other submenus - const parent = trigger.closest('.dropdown-menu'); - if (parent) { - parent.querySelectorAll('.dropdown-menu.show').forEach(function (open) { - if (open !== submenu) { - open.classList.remove('show'); - } - }); - } - - submenu.classList.toggle('show'); + const submenu = trigger.nextElementSibling; + // Close other submenus + const parent = trigger.closest(".dropdown-menu"); + if (parent) { + parent.querySelectorAll(".dropdown-menu.show").forEach(function (open) { + if (open !== submenu) { + open.classList.remove("show"); + } }); + } + + submenu.classList.toggle("show"); }); + }); }); From 3484b1581704e8c7d0dcf037cbdf904aad6cdc5b Mon Sep 17 00:00:00 2001 From: Alasdair Wilson Date: Mon, 23 Jun 2025 22:37:53 +0100 Subject: [PATCH 3/5] moved js to static folder --- docs/conf.py | 3 ++ src/sunpy_sphinx_theme/conf.py | 3 -- .../theme/sunpy/components/navbar_center.html | 36 ------------------- 3 files changed, 3 insertions(+), 39 deletions(-) diff --git a/docs/conf.py b/docs/conf.py index a29b1b78..02dae39c 100644 --- a/docs/conf.py +++ b/docs/conf.py @@ -70,6 +70,9 @@ } html_theme = "sunpy" html_static_path = [str(_sunpy_static_path), "_static"] +html_js_files = [ + "js/submenu-toggle.js", +] html_extra_path = ["_static/img"] html_theme_options = { "footer_links": [ diff --git a/src/sunpy_sphinx_theme/conf.py b/src/sunpy_sphinx_theme/conf.py index 6c605d2e..40711db6 100644 --- a/src/sunpy_sphinx_theme/conf.py +++ b/src/sunpy_sphinx_theme/conf.py @@ -26,9 +26,6 @@ "svg_icon", ] -html_js_files = [ - "js/submenu-toggle.js", -] html_theme = "sunpy" html_theme_options = {} diff --git a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html index 5f93dd6e..d750c87b 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html +++ b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html @@ -62,39 +62,3 @@ - From bba90360a19582a019e48ee7494d77bb7249683b Mon Sep 17 00:00:00 2001 From: Alasdair Wilson Date: Tue, 24 Jun 2025 01:44:12 +0100 Subject: [PATCH 4/5] fix: prevent submenu openings from persisting when dropdown reopened --- .../theme/sunpy/static/js/submenu-toggle.js | 33 +++++++++++++------ .../theme/sunpy/static/sunpy_style.css | 6 +++- 2 files changed, 28 insertions(+), 11 deletions(-) diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js index 9c28bdf0..21f3cc26 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js @@ -1,25 +1,21 @@ document.addEventListener("DOMContentLoaded", function () { - const triggers = document.querySelectorAll( - ".dropdown-submenu > .dropdown-toggle", - ); + // Setup toggle for nested submenus + const triggers = document.querySelectorAll(".dropdown-submenu > .dropdown-toggle"); triggers.forEach(function (trigger, i) { - // Prevent multiple listeners trigger.dataset.bound = "true"; trigger.addEventListener("click", function (e) { - if (trigger.dataset.processing === "true") { - // Defensive double-bind check to avoid multiple event listeners triggering - return; - } + if (trigger.dataset.processing === "true") return; + trigger.dataset.processing = "true"; setTimeout(() => delete trigger.dataset.processing, 100); - // stop bootstrap from using this click to close the parent dropdown e.preventDefault(); e.stopPropagation(); const submenu = trigger.nextElementSibling; - // Close other submenus + + // Close other submenus at this level const parent = trigger.closest(".dropdown-menu"); if (parent) { parent.querySelectorAll(".dropdown-menu.show").forEach(function (open) { @@ -32,4 +28,21 @@ document.addEventListener("DOMContentLoaded", function () { submenu.classList.toggle("show"); }); }); + + // Close all open submenus when a top-level dropdown is closed + document.querySelectorAll('.dropdown').forEach(function (dropdown) { + dropdown.addEventListener('hide.bs.dropdown', function () { + dropdown.querySelectorAll('.dropdown-menu.show').forEach(function (submenu) { + submenu.classList.remove('show'); + }); + }); + }); + + document.addEventListener('keydown', function (e) { + if (e.key === "Escape") { + document.querySelectorAll('.dropdown-menu.show').forEach(function (submenu) { + submenu.classList.remove('show'); + }); + } + }); }); diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css b/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css index 9ac22b11..d7ca8c2e 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/sunpy_style.css @@ -418,6 +418,10 @@ html[data-theme="dark"] .search-button-field:hover { position: relative; } +.navbar-nav .dropdown-item { + color: var(--sst-header-text); +} + /* Initially hidden */ .dropdown-submenu > .dropdown-menu { position: absolute; @@ -427,7 +431,7 @@ html[data-theme="dark"] .search-button-field:hover { z-index: 1000; } -/* Show when toggled by JS */ +/* Show when toggled */ .dropdown-submenu > .dropdown-menu.show { display: block; } From 90bb56fda457c977d8a5e106902b0e6a43dc7d78 Mon Sep 17 00:00:00 2001 From: Alasdair Wilson Date: Tue, 24 Jun 2025 10:59:01 +0100 Subject: [PATCH 5/5] l.i.n.t. again --- .../theme/sunpy/components/navbar_center.html | 1 - .../theme/sunpy/static/js/submenu-toggle.js | 26 ++++++++++++------- 2 files changed, 16 insertions(+), 11 deletions(-) diff --git a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html index d750c87b..b543b599 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html +++ b/src/sunpy_sphinx_theme/theme/sunpy/components/navbar_center.html @@ -61,4 +61,3 @@ {% endif %} - diff --git a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js index 21f3cc26..e5d24379 100644 --- a/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js +++ b/src/sunpy_sphinx_theme/theme/sunpy/static/js/submenu-toggle.js @@ -1,6 +1,8 @@ document.addEventListener("DOMContentLoaded", function () { // Setup toggle for nested submenus - const triggers = document.querySelectorAll(".dropdown-submenu > .dropdown-toggle"); + const triggers = document.querySelectorAll( + ".dropdown-submenu > .dropdown-toggle", + ); triggers.forEach(function (trigger, i) { trigger.dataset.bound = "true"; @@ -30,19 +32,23 @@ document.addEventListener("DOMContentLoaded", function () { }); // Close all open submenus when a top-level dropdown is closed - document.querySelectorAll('.dropdown').forEach(function (dropdown) { - dropdown.addEventListener('hide.bs.dropdown', function () { - dropdown.querySelectorAll('.dropdown-menu.show').forEach(function (submenu) { - submenu.classList.remove('show'); - }); + document.querySelectorAll(".dropdown").forEach(function (dropdown) { + dropdown.addEventListener("hide.bs.dropdown", function () { + dropdown + .querySelectorAll(".dropdown-menu.show") + .forEach(function (submenu) { + submenu.classList.remove("show"); + }); }); }); - document.addEventListener('keydown', function (e) { + document.addEventListener("keydown", function (e) { if (e.key === "Escape") { - document.querySelectorAll('.dropdown-menu.show').forEach(function (submenu) { - submenu.classList.remove('show'); - }); + document + .querySelectorAll(".dropdown-menu.show") + .forEach(function (submenu) { + submenu.classList.remove("show"); + }); } }); });