Version 2.8.42: sichtbare Pfeile an allem Aufklappbaren

apps/tesm-license/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "tesm-license"
-version = "2.8.20"
+version = "2.8.21"
 description = "TESM-Lizenzserver -- Kunden, Tickets, Lizenzen, Aktivierung"
 requires-python = ">=3.11"
 dependencies = [

apps/tesm-license/src/tesm_license/templates/license/customer_detail.html

@@ -122,14 +122,13 @@
           informativ und werden bei jedem Bericht vollständig ersetzt.', 'info') }}
           {% for entry in reported.customers %}
             <details class="card">
-              <summary class="card__header" style="cursor:pointer">
+              <summary class="card__header">
                 <div class="flex-1">
                   <div class="card__title">{{ entry.name }}</div>
                   <div class="card__sub">
                     {{ entry.city or 'ohne Ort' }} &middot; {{ entry.tickets | length }} Ticket(s)
                   </div>
                 </div>
-                {{ icon('chevron-down', size=15) }}
               </summary>
               <div class="card__body">
                 {% for ticket in entry.tickets %}

apps/tesm-license/src/tesm_license/templates/license/dashboard.html

@@ -41,14 +41,13 @@
     {% set entries = summary.buckets[key] %}
     {% if entries %}
       <details class="card" data-persist="dash-{{ key }}" {% if key != 'green' %}open{% endif %}>
-        <summary class="card__header" style="cursor:pointer">
+        <summary class="card__header">
           <div class="flex-1">
             <div class="card__title">
               {{ pill(entries | length, kind if kind != 'ok' else 'online') }} {{ label }}
             </div>
             <div class="card__sub">{{ hint }}</div>
           </div>
-          {{ icon('chevron-down', size=16) }}
         </summary>
         <div class="card__body">
           <div class="grid grid--tiles">

apps/tesm-license/src/tesm_license/templates/license/license_detail.html

@@ -203,12 +203,11 @@
     </section>
 
     <details class="card" data-persist="license-document">
-      <summary class="card__header" style="cursor:pointer">
+      <summary class="card__header">
         <div class="flex-1">
           <div class="card__title">{{ icon('file-text', size=17) }} Signiertes Dokument</div>
           <div class="card__sub">Genau so, wie es signiert wurde – jede Änderung bricht die Signatur</div>
         </div>
-        {{ icon('chevron-down', size=16) }}
       </summary>
       <pre class="log-view">{{ document_json }}</pre>
     </details>

apps/tesm-license/src/tesm_license/templates/license/report_detail.html

@@ -19,7 +19,7 @@ werden bei jedem Bericht vollständig ersetzt.', 'info') }}
   <div class="stack">
     {% for entry in reported.customers %}
       <details class="card" open>
-        <summary class="card__header" style="cursor:pointer">
+        <summary class="card__header">
           <div class="flex-1">
             <div class="card__title">{{ entry.name }}</div>
             <div class="card__sub">
@@ -28,7 +28,6 @@ werden bei jedem Bericht vollständig ersetzt.', 'info') }}
               &middot; {{ entry.tickets | length }} Ticket(s)
             </div>
           </div>
-          {{ icon('chevron-down', size=16) }}
         </summary>
         <div class="table-wrap">
           <table class="table table--compact">

apps/tesm-license/src/tesm_license/templates/license/selfservice.html

@@ -99,12 +99,11 @@
 
 {% if history %}
   <details class="card">
-    <summary class="card__header" style="cursor:pointer">
+    <summary class="card__header">
       <div class="flex-1">
         <div class="card__title">{{ icon('history', size=17) }} Früher ausgestellt</div>
         <div class="card__sub">{{ history | length }} Einträge</div>
       </div>
-      {{ icon('chevron-down', size=16) }}
     </summary>
     <div class="table-wrap">
       <table class="table table--compact">

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>