Version 2.8.42: sichtbare Pfeile an allem Aufklappbaren

packages/tesm-core/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "tesm-core"
-version = "2.8.20"
+version = "2.8.21"
 description = "Gemeinsames Anwendungsgeruest (Auth, RBAC, Navigation, Design-System, Migrationen) fuer TESM und TESM-Lizenzserver"
 requires-python = ">=3.11"
 dependencies = [

packages/tesm-core/src/tesm_core/static/tesm_core/css/components.css

@@ -1131,6 +1131,43 @@
     white-space: pre-wrap;
     word-break: break-word;
   }
+  /* ---------------------------------------------------------------------- #
+     Aufklappbares
+     ---------------------------------------------------------------------- #
+
+     Der native Marker eines <summary> verschwindet, sobald das Element ein
+     Flex-Container ist -- und genau das sind unsere Kartenkoepfe. Auf der
+     DHCP-Seite stand der Optionskatalog deshalb als Kasten da, dem man nicht
+     ansah, dass er sich oeffnen laesst.
+
+     Der Pfeil wird deshalb selbst gezeichnet: als Flex- bzw. Inline-Element,
+     das in beiden Faellen erscheint, in Akzentfarbe (das ist die Farbe, mit
+     der diese Oberflaeche "hier kannst du etwas tun" sagt) und mit einer
+     Drehung beim Oeffnen. Eine Stelle fuer alle Aufklapper -- Karten,
+     Vorschauen, Abschnitte. */
+  details > summary {
+    list-style: none;
+    cursor: pointer;
+  }
+  details > summary::-webkit-details-marker { display: none; }
+  details:not(.nav-tree) > summary::before {
+    content: "";
+    display: inline-block;
+    flex: 0 0 auto;
+    align-self: center;
+    width: 0;
+    height: 0;
+    margin-right: var(--sp-2);
+    border-left: 6px solid var(--accent);
+    border-top: 5px solid transparent;
+    border-bottom: 5px solid transparent;
+    transition: transform var(--dur) var(--ease);
+  }
+  details:not(.nav-tree)[open] > summary::before { transform: rotate(90deg); }
+  /* Der Navigationsbaum bringt seinen eigenen Winkel mit -- der bekommt
+     dieselbe Farbe, damit "aufklappbar" ueberall gleich aussieht. */
+  .nav-tree__chevron { color: var(--accent); }
+
   .log-view mark { background: var(--warning-soft); color: var(--warning); border-radius: 3px; }
 
   /* Stufen im laufenden Protokoll. Die Zuordnung der Farbrollen ist Absicht:

packages/tesm-core/src/tesm_core/templates/tesm_core/settings_web.html

@@ -73,12 +73,11 @@ blieb dadurch über Jahre bestehen und lieferte alle statischen Dateien als 404.
     </section>
 
     <details class="card" data-persist="nginx-preview">
-      <summary class="card__header" style="cursor:pointer">
+      <summary class="card__header">
         <div class="flex-1">
           <div class="card__title">{{ icon('file-text', size=17) }} Erzeugte nginx-Konfiguration</div>
           <div class="card__sub">Vorschau der Datei, die geschrieben würde</div>
         </div>
-        {{ icon('chevron-down', size=16) }}
       </summary>
       <pre class="log-view">{{ preview }}</pre>
     </details>