Claudian
b941080694
FILIPE, mit Bildschirmfoto der Personenauswahl: "wenn ich da scollen will geht das immer zu"
Er hatte recht, und es war eine einzige Zeile in workspace/assets/js/wahl.js:
addEventListener('scroll', schliessen, true);
Das dritte Argument bedeutet "in der Einfangphase lauschen" -- und damit auf JEDES
Scroll-Ereignis im ganzen Dokument, auch auf das in der Liste selbst. Wer die Namensliste
herunterrollen wollte, schloss sie im selben Moment. Bei acht Eintraegen faellt das kaum
auf; beim ganzen Manager- und Scout-Team ist die Liste unbedienbar.
Zumachen MUSS sie trotzdem, wenn die Seite scrollt: Sie haengt an position:fixed und
schwaemme sonst neben ihrem Knopf davon. Deshalb wird jetzt unterschieden, WO gescrollt
wurde -- ein Scroll-Ereignis der Seite hat document als Ziel, das ist nicht in der Liste
enthalten, also schliesst sie wie bisher.
Dazu overscroll-behavior: contain in gate.css. Ohne das reicht der Browser das Rollen am
Listenende an die Seite weiter, die Seite bewegt sich -- und daran schliesst die Liste zu
Recht. Der Fehler waere zur Haelfte zurueck gewesen.
GEPRUEFT im echten Browser am echten wahl.js und gate.css (pruef-wahl-scrollen.mjs, 7
Pruefungen), und zwar BEIDE Haelften der Zusage: Liste scrollt -> bleibt offen, Seite
scrollt -> geht zu. Eine Reparatur, die nur die eine Richtung sichert, waere die naechste
Ueberraschung.
Gegenprobe: alte Zeile testweise eingesetzt -> 2 Pruefungen fallen durch. Reparatur ->
alle 7 gruen.
Die Pruefung hat sich beim Bauen DREIMAL geweigert, etwas zu bestaetigen, das sie nicht
gemessen hatte -- "die Liste ist gar nicht laenger als ihr Fenster", "scrollTop = 0". Jedes
Mal lag es an meinem Aufbau (zu hohes Fenster, fehlende Stylesheets, Mausrad ohne Wirkung),
nie an der Reparatur. Gruen gemeldet haette sie es nie.
Der Versionsstempel muss mit: Cloudflare haelt JS und CSS vier Stunden im Browser fest.
Ohne neue Adresse saehe Filipe die Reparatur bis zu vier Stunden lang nicht.
HINWEIS ZUM COMMIT: In diesem Verzeichnis lag zum Zeitpunkt der Arbeit fremde,
uncommittete Arbeit -- vier Server-Dateien (heute 16:41-16:53 geaendert), sieben neue
Pruefdateien, ~110 Bildschirmfotos, eine Fokusring-Korrektur in gate.css und eine
Beschriftung in profil.html. Nichts davon ist hier drin. Bereitgestellt wurde ausdruecklich
nach Pfad, und die beiden Dateien mit gemischtem Inhalt (gate.css, profil.html) wurden dafuer
aus HEAD geholt und nur um den eigenen Anteil ergaenzt. Die fremde Arbeit steht unveraendert
im Arbeitsstand.
101 lines
4.0 KiB
HTML
101 lines
4.0 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<title>Reports & Review · Creator Workspace</title>
|
|
<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=202609041818" />
|
|
<link rel="stylesheet" href="assets/css/start.css?v=202609041818" />
|
|
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609041818" />
|
|
<link rel="stylesheet" href="assets/css/report.css?v=202609041818" />
|
|
</head>
|
|
|
|
<body class="start">
|
|
|
|
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
|
|
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
|
|
Pseudo-Elements -- body hat nur ::before und ::after. -->
|
|
<div class="schleier" aria-hidden="true"></div>
|
|
|
|
<header class="kopfleiste">
|
|
<button type="button" class="zurueck-knopf" id="zurueck" hidden>
|
|
<svg class="zurueck-knopf__pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path d="M14.5 5.5 8 12l6.5 6.5" />
|
|
</svg>
|
|
<span class="zurueck-knopf__text">Zurück</span>
|
|
</button>
|
|
<p class="marke"><span class="marke__text"><a class="zurueck" href="start.html">Creator Workspace</a> · Review</span></p>
|
|
<div class="kopfleiste__rechts">
|
|
<span class="wer" id="wer">…</span>
|
|
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="inhalt inhalt--breit">
|
|
|
|
<section class="kopf-zeile">
|
|
<div>
|
|
<p class="marke">Reports</p>
|
|
<h1 class="titel">Review & nächste Schritte</h1>
|
|
<p class="unterzeile" id="unterzeile">Fortschritt wird nicht gefühlt, sondern nachvollziehbar gemacht.</p>
|
|
</div>
|
|
<div class="steuerung">
|
|
<div id="creator-block" hidden>
|
|
<label class="feld-schild" for="f-creator">Creator</label>
|
|
<select id="f-creator"></select>
|
|
</div>
|
|
<div>
|
|
<label class="feld-schild" for="f-tage">Zeitraum</label>
|
|
<select id="f-tage">
|
|
<option value="7">7 Tage</option>
|
|
<option value="30" selected>30 Tage</option>
|
|
<option value="90">90 Tage</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
|
|
|
<div id="bericht" aria-busy="true"><p class="leise">Report wird erstellt …</p></div>
|
|
|
|
<!-- Der Kern aus dem Konzept: Ein Review endet mit einer Entscheidung. -->
|
|
<section class="entscheidung" id="entscheidung-block" hidden>
|
|
<p class="marke">Abschluss</p>
|
|
<h2 class="entscheidung__titel">Was ist die Entscheidung?</h2>
|
|
<p class="entscheidung__text">
|
|
Ein Review endet nicht mit einer Zusammenfassung, sondern mit einem nächsten Schritt.
|
|
Was hier steht, wird sofort als Aufgabe mit hoher Priorität angelegt.
|
|
</p>
|
|
<form id="entscheidung">
|
|
<div class="entscheidung__raster">
|
|
<div>
|
|
<label class="feld-schild" for="e-titel">Nächster Schritt</label>
|
|
<input id="e-titel" maxlength="160" placeholder="z. B. Mikro-Problem bis Freitag lösen" required />
|
|
</div>
|
|
<div>
|
|
<label class="feld-schild" for="e-frist">Bis wann <span class="leise">(optional)</span></label>
|
|
<input id="e-frist" type="date" />
|
|
</div>
|
|
</div>
|
|
<p class="fehler" id="e-fehler" role="alert" aria-live="polite"></p>
|
|
<div class="neu__knoepfe">
|
|
<button type="submit" class="knopf knopf--klein" id="e-speichern">Als Aufgabe festhalten</button>
|
|
<span class="leise" id="e-stand"></span>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<script src="assets/js/ki.js?v=202609041818" defer></script>
|
|
<script src="assets/js/wahl.js?v=202609041818" defer></script>
|
|
<script src="assets/js/bereiche.js?v=202609041818" defer></script>
|
|
<script src="assets/js/kopf.js?v=202609041818" defer></script>
|
|
<script src="assets/js/report.js?v=202609041818" defer></script>
|
|
</body>
|
|
</html>
|