Workspace: lange Protokoll-Listen aufklappbar, zugeklappt vier Zeilen
Die "Letzten Ereignisse" im Personen-Bereich fuellten mit 25 Zeilen die
halbe Seite, obwohl sie Nachschlagewerk sind und kein Startbild. Jetzt
stehen nur die vier neuesten da, der Rest kommt auf Knopfdruck.
Der Knopf sagt, was er TUT ("Alle 25 zeigen" / "Nur die letzten 4") und
nennt die Zahl, damit man weiss, was dahintersteckt. Bei hoechstens vier
Eintraegen bleibt er ganz weg -- ein Knopf, der nichts verbirgt, verwirrt
nur. Der Pfeil dreht sich, aria-expanded stimmt.
Gemeinsamer Helfer in kopf.js statt zweimal derselbe Block: Dieselbe
Liste gab es auf der Automationen-Seite ("Zuletzt automatisch passiert"),
die verhaelt sich jetzt genauso. Zugeklappt wird per CSS
([data-klapp="zu"]) statt durch Entfernen von Zeilen -- das Aufklappen
braucht so weder Neuaufbau noch zweite Abfrage.
Der Zuhoerer wird nur einmal gesetzt (die Listen werden bei jeder
Aktualisierung neu aufgebaut), und die Anzahl wird bei jedem Umschalten
frisch gelesen statt in der Fassung des ersten Durchlaufs festzuhaengen.
Geprueft: beide Seiten, Computer und Handy, zweimaliges Hin- und
Herklappen, Gegenprobe mit drei Eintraegen -- server/pruef-protokoll-klappe.mjs
Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
@@ -7,10 +7,10 @@
|
||||
<meta name="robots" content="noindex, nofollow" />
|
||||
<meta name="theme-color" content="#05070d" />
|
||||
<link rel="icon" href="assets/img/favicon.png" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202608311315" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608311315" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608311315" />
|
||||
<link rel="stylesheet" href="assets/css/automation.css?v=202608311315" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202608311327" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608311327" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608311327" />
|
||||
<link rel="stylesheet" href="assets/css/automation.css?v=202608311327" />
|
||||
</head>
|
||||
|
||||
<body class="start">
|
||||
@@ -84,8 +84,17 @@
|
||||
</section>
|
||||
|
||||
<section class="block">
|
||||
<div class="block__kopf">
|
||||
<!-- Wie im Personen-Bereich: zugeklappt stehen nur die vier
|
||||
neuesten Zeilen da, alles Weitere auf Knopfdruck. -->
|
||||
<div class="block__kopf klapp-kopf">
|
||||
<h2 class="block__titel">Zuletzt automatisch passiert</h2>
|
||||
<button type="button" class="knopf-still" id="verlauf-schalter"
|
||||
aria-expanded="false" aria-controls="verlauf" hidden>
|
||||
<span id="verlauf-schalter-text">Alle zeigen</span>
|
||||
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="m6 9.5 6 6 6-6" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<p class="block__frage">Aus dem Protokoll – damit nachvollziehbar bleibt, was ohne Zutun geschah.</p>
|
||||
<div id="verlauf"><p class="leise">Wird geladen …</p></div>
|
||||
@@ -93,8 +102,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608311315" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608311315" defer></script>
|
||||
<script src="assets/js/automation.js?v=202608311315" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202608311327" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608311327" defer></script>
|
||||
<script src="assets/js/automation.js?v=202608311327" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user