From 9a30e0f49b694be7f01b41bf4b999bdb56a82f2e Mon Sep 17 00:00:00 2001
From: Kevin Veen-Birkenbach <kevin@veen.world>
Date: Mon, 17 Mar 2025 04:13:24 +0100
Subject: [PATCH] Optimized menu

---
 sphinx/templates/structure.html | 63 ++++++++++++++++++---------------
 1 file changed, 35 insertions(+), 28 deletions(-)

diff --git a/sphinx/templates/structure.html b/sphinx/templates/structure.html
index 9027c665..f8337fe6 100644
--- a/sphinx/templates/structure.html
+++ b/sphinx/templates/structure.html
@@ -1,36 +1,43 @@
 {% macro render_headings(headings, level=1) %}
-  <ul class="toctree-l{{ level }}">
-  {% for item in headings %}
-    <li class="toctree-l{{ level }}{% if item.current %} current{% endif %}"
-        {% if item.children %} x-data="{ expanded: false }" {% endif %}>
-      <a class="reference internal{% if item.children %} expandable{% endif %}"
-         href="{{ pathto(item.link).replace('#', '') }}{% if item.anchor %}#{{ item.anchor }}{% endif %}"
-         {% if item.children %}
-           @click.prevent="expanded = !expanded"
-           :class="{ 'expanded': expanded }"
-         {% endif %}>
-         {{ item.text }}
-         {% if item.children %}
-           <button @click.prevent.stop="expanded = !expanded" type="button" class="toggle-button" style="background: none; border: none; padding: 0; margin-left: 5px;">
-             <span x-show="!expanded">
-              <svg fill="currentColor" height="18px" stroke="none" viewBox="0 0 24 24" width="18px" xmlns="http://www.w3.org/2000/svg">
-                <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>
-              </svg>
-             </span>
-             <span x-show="expanded">&#9660;</span>
-           </button>
-         {% endif %}
-      </a>
-      {% if item.children %}
-        <div x-show="expanded">
-          {{ render_headings(item.children, level+1) }}
+  <ul class="toctree-l{{ level }}" style="list-style: none; padding-left: 0;">
+    {% for item in headings %}
+      <li class="toctree-l{{ level }}{% if item.current %} current{% endif %}"
+          {% if item.children %} x-data="{ expanded: false }" {% endif %}
+          style="white-space: nowrap;">
+        <div class="menu-item" style="display: inline-flex; align-items: center; justify-content: space-between; width: 100%; white-space: nowrap;">
+          <!-- Link- und "Datei öffnen"-Bereich -->
+          <div style="display: inline-flex; align-items: center; white-space: nowrap;">
+            <a class="reference internal{% if item.children %} expandable{% endif %}"
+               href="{{ pathto(item.link).replace('#', '') }}{% if item.anchor %}#{{ item.anchor }}{% endif %}"
+               style="text-decoration: none; white-space: nowrap;">
+              {{ item.text }}
+            </a>
+          </div>
+          <!-- Expand-Toggle-Button -->
+          {% if item.children %}
+            <button @click.prevent.stop="expanded = !expanded" type="button" class="toggle-button"
+                    style="background: none; border: none; padding: 0; margin-left: auto;">
+              <span x-show="!expanded">
+                <svg fill="currentColor" height="18px" stroke="none" viewBox="0 0 24 24" width="18px"
+                     xmlns="http://www.w3.org/2000/svg">
+                  <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>
+                </svg>
+              </span>
+              <span x-show="expanded">&#9660;</span>
+            </button>
+          {% endif %}
         </div>
-      {% endif %}
-    </li>
-  {% endfor %}
+        {% if item.children %}
+          <div x-show="expanded">
+            {{ render_headings(item.children, level+1) }}
+          </div>
+        {% endif %}
+      </li>
+    {% endfor %}
   </ul>
 {% endmacro %}
 
+
 {% if local_md_headings or local_subfolders %}
 <div class="local-md-headings">
   <h3 class="toctree-l1">Index</h3>