From e84df8f4aec85f759d6df864dfda42095147cd8f Mon Sep 17 00:00:00 2001
From: Julien Stephan <jstephan@baylibre.com>
Date: Tue, 18 Aug 2026 21:59:42 +0200
Subject: [PATCH 1/2] docs: show package versions in a dropdown selector
 instead of a folded list

Package pages listed every version as a stack of collapsible <details>
blocks, which was awkward to scan and forced users to expand entries one
by one to find a non-latest version.

Generate a single <select> version picker plus one panel per version
instead, and add _includes/head_custom.html with the CSS/JS that reveals
only the selected panel. Panels stay visible without JavaScript, so the
content degrades gracefully.

Signed-off-by: Julien Stephan <jstephan@baylibre.com>
---
 docs/_includes/head_custom.html        | 59 ++++++++++++++++++++++++++
 docs/packages/generate_packages_doc.py | 27 ++++++++++--
 2 files changed, 82 insertions(+), 4 deletions(-)
 create mode 100644 docs/_includes/head_custom.html

diff --git a/docs/_includes/head_custom.html b/docs/_includes/head_custom.html
new file mode 100644
index 00000000..a514d14a
--- /dev/null
+++ b/docs/_includes/head_custom.html
@@ -0,0 +1,59 @@
+<style>
+.version-selector {
+  margin: 0.5rem 0 1rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  flex-wrap: wrap;
+}
+
+.version-selector .version-select {
+  padding: 0.25rem 2rem 0.25rem 0.5rem;
+  font-size: 0.85rem;
+  border: 1px solid #d1d5da;
+  border-radius: 4px;
+  background-color: #fff;
+  cursor: pointer;
+}
+
+.version-panel {
+  margin-bottom: 1rem;
+}
+
+/* Only hide panels once JS has taken over, so no-JS users see everything. */
+.js-version-picker .version-panel[hidden] {
+  display: none;
+}
+</style>
+
+<script>
+(function () {
+  function initVersionPicker() {
+    var select = document.getElementById("version-select");
+    var panels = document.querySelectorAll(".version-panel");
+    if (!select || !panels.length) {
+      return;
+    }
+
+    document.body.classList.add("js-version-picker");
+
+    function show(version) {
+      panels.forEach(function (panel) {
+        panel.hidden = panel.getAttribute("data-version") !== version;
+      });
+    }
+
+    select.addEventListener("change", function () {
+      show(select.value);
+    });
+
+    show(select.value);
+  }
+
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", initVersionPicker);
+  } else {
+    initVersionPicker();
+  }
+})();
+</script>
diff --git a/docs/packages/generate_packages_doc.py b/docs/packages/generate_packages_doc.py
index 6ba66470..dd7fcca2 100644
--- a/docs/packages/generate_packages_doc.py
+++ b/docs/packages/generate_packages_doc.py
@@ -151,15 +151,34 @@ def generate_md_page(yaml_file, output_md, package_list):
     lines.append("- **Supported versions:**")
     lines.append("")
 
+    # Version picker: a dropdown that reveals one version panel at a time.
+    # Without JavaScript every panel stays visible, so content degrades
+    # gracefully; version-selector.js hides all but the selected panel.
+    lines.append('<div class="version-selector">')
+    lines.append(
+        '  <label for="version-select"><strong>Select version:</strong></label>'
+    )
+    lines.append('  <select id="version-select" class="version-select">')
+    for version in versions:
+        version_number = str(version["version"])
+        is_latest = version_number == latest_version
+        option_label = f"{version_number} (latest)" if is_latest else version_number
+        selected = " selected" if is_latest else ""
+        lines.append(
+            f'    <option value="{version_number}"{selected}>{option_label}</option>'
+        )
+    lines.append("  </select>")
+    lines.append("</div>")
+    lines.append("")
+
     for version in versions:
         version_number = str(version["version"])
         is_latest = version_number == latest_version
-        summary_label = f"{version_number} (latest)" if is_latest else version_number
 
         lines.append(
-            f'<details markdown="1"{" open" if is_latest else ""}>'
+            f'<div class="version-panel" markdown="1" '
+            f'data-version="{version_number}">'
         )
-        lines.append(f"<summary><strong>{summary_label}</strong></summary>")
         lines.append("")
 
         install_command = (
@@ -206,7 +225,7 @@ def generate_md_page(yaml_file, output_md, package_list):
         if version.get("warning"):
             _callout(lines, "warning", version["warning"])
 
-        lines += ["</details>", ""]
+        lines += ["</div>", ""]
 
     if comment:
         _callout(lines, "note", comment)

From 4c178710f26cc6bdfe403d750e0ba65f82945def Mon Sep 17 00:00:00 2001
From: Julien Stephan <jstephan@baylibre.com>
Date: Tue, 18 Aug 2026 22:24:22 +0200
Subject: [PATCH 2/2] docs: remove bullet list on package pages

Signed-off-by: Julien Stephan <jstephan@baylibre.com>
---
 docs/packages/generate_packages_doc.py | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/docs/packages/generate_packages_doc.py b/docs/packages/generate_packages_doc.py
index dd7fcca2..6b4215ce 100644
--- a/docs/packages/generate_packages_doc.py
+++ b/docs/packages/generate_packages_doc.py
@@ -146,10 +146,8 @@ def generate_md_page(yaml_file, output_md, package_list):
         ]
 
     if source_code:
-        lines.append(f"- **Source Code:** [{source_code}]({source_code})")
-
-    lines.append("- **Supported versions:**")
-    lines.append("")
+        lines.append(f"**Source code:** [{source_code}]({source_code})")
+        lines.append("")
 
     # Version picker: a dropdown that reveals one version panel at a time.
     # Without JavaScript every panel stays visible, so content degrades
@@ -191,7 +189,8 @@ def generate_md_page(yaml_file, output_md, package_list):
 
         lic = version.get("license", license_type)
         if lic:
-            lines.append(f"- **License:** {lic}")
+            lines.append(f"**License:** {lic}")
+            lines.append("")
 
         package_id = get_package_id(package_name, version_number, package_list)
         if package_id:
@@ -199,8 +198,9 @@ def generate_md_page(yaml_file, output_md, package_list):
                 f"https://gitlab.com/riseproject/python/wheel_builder/-/packages/{package_id}"
             )
             lines.append(
-                f"- **Download files:** [{registry_link}]({registry_link})"
+                f"**Download files:** [{registry_link}]({registry_link})"
             )
+            lines.append("")
 
         if "patched" in version and source_code:
             project_name = (
@@ -215,9 +215,10 @@ def generate_md_page(yaml_file, output_md, package_list):
                     f"{project_name}/patches/{upstream_tag}"
                 )
                 lines.append(
-                    f"- **Patch applied for this version:** "
+                    f"**Patch applied for this version:** "
                     f"[{patch_link}]({patch_link})"
                 )
+                lines.append("")
 
         if version.get("comment"):
             _callout(lines, "note", version["comment"])