DogFatherGitandClaude Opus 5
1fe443e59c
DAS LICHT BLIEB HAENGEN -- vier Ursachen, jede einzeln behoben:
1. EIN WETTLAUF. Zwischen dem Anmelden eines Bildaufbaus und seinem
Ablauf konnte der Zeiger die Karte laengst verlassen haben. Dann hatte
pointerout schon aufgeraeumt, und der Bildaufbau schaltete das Licht
gleich wieder AN. Der haeufigste Fall und der unauffaelligste.
2. UEBER EINE LUECKE VERLASSEN. Wer eine Karte nicht ueber eine
Nachbarkarte verliess, sondern ueber den Zwischenraum, loeste kein
Ereignis aus, das die alte Karte kannte.
3. GESCROLLT, OHNE DIE MAUS ZU BEWEGEN. Die Karte wandert unter dem
stehenden Zeiger weg -- es kommt gar kein Zeigerereignis. Jetzt wird
beim Scrollen nachgesehen, ob die beleuchtete Karte noch unter dem
Zeiger liegt.
4. FENSTER ODER TAB VERLASSEN. Auch dort kommt nichts mehr.
Es gibt jetzt genau EINE beleuchtete Karte -- mehr kann es nicht geben,
es gibt ja nur einen Zeiger. Beim Wechsel geht die alte aus, bevor die
neue angeht.
DIE FARBE GEHOERT ZUR KACHEL. Auf der Wissensseite leuchteten alle sechs
Welten violett, weil die Farbe dort --w heisst und der ganze uebrige
Workspace --ton benutzt. Das Licht griff auf --ton zu, fand nichts und
nahm den Farbton der SEITE. Dieselbe Luecke bei den Aufgaben-Spalten
(--sfarbe), den Kalenderkarten (--afarbe) und den Kalenderzeilen
(--zfarbe). Alle vier setzen jetzt --ton mit.
Nachgewiesen an echten Bildpunkten, nicht am Quelltext: Der Zeiger wird
auf die Aufgaben-Kachel gesetzt (dort muss Rot ueberwiegen: 85 zu 22)
und auf die Kalender-Kachel (dort Blau: 71 zu 13). Ein
Zeichenkettenvergleich haette das nicht gekonnt -- der Browser rechnet
color-mix() aus und schreibt je nach Fassung rgb(), color() oder oklab()
zurueck.
DAS HANDY, komplett durchgeprueft: neue pruef-handy.mjs faehrt alle
fuenfzehn Seiten auf DREI echten Geraetegroessen ab (320 px iPhone SE,
390 px iPhone, 412 px Android) und misst fuenf Dinge, die am Rechner
unsichtbar sind. Gefunden und behoben:
* ZWEI ECHTE UEBERLAEUFE (startcheck +27 px, automation +33 px). Die
Seite liess sich waagerecht schieben -- auf einem Telefon der
schlimmste Fehler. Ursachen: zwoelf Raster mit festem Mindestmass
(minmax(280px, 1fr) kann nicht schrumpfen -> min(280px, 100%)),
zwoelf feste Mindestbreiten an Auswahlfeldern, und ein "flex: none"
an den Stufen-Knoepfen, das jedes Schrumpfen verbot. "width: 100%"
allein reichte dort nicht.
* BERUEHRZIELE unter 24 px (WCAG 2.2, Kriterium 2.5.8). Auswahlfelder
waren 18 bis 22 px hoch. Jetzt 44 px -- die Empfehlung von Apple und
Google, und der Daumen ist nun einmal breiter als ein Mauszeiger.
Nebenbei behebt die Schriftgroesse 16 px das Hineinzoomen von iOS.
* SCHRIFT unter 11,7 px an 52 Stellen. Gesucht wurden sie nicht von
Hand -- das waere ein Ratespiel gewesen und haette die Haelfte
uebersehen -- sondern durch Durchsuchen der Stildateien nach
font-size unter 0,73rem.
ZWEI FEHLER IN DEN EIGENEN PRUEFUNGEN gefunden und behoben: Die
Schriftregel griff zuerst gar nicht (start.css wird VOR den Seitenstilen
geladen, bei gleicher Staerke gewinnt die spaetere -- jetzt mit
body.start qualifiziert), und die Lichtpruefung scrollte 600 px und
stellte nicht zurueck, sodass die folgende Pruefung ins Leere zeigte.
GEGENPROBE gemacht: Mit absichtlich eingebauten Fehlern (8-px-Schrift,
500 px breiter Inhalt) meldet die Handypruefung sofort Rot. Eine
Pruefung, die immer bestaetigt, bestaetigt nichts.
Alle achtzehn Pruefungen laufen gruen.
Co-Authored-By: Claude Opus 5 <[email protected]>
141 lines
5.6 KiB
HTML
141 lines
5.6 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>Automationen · 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=202609011448" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609011448" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011448" />
|
||
<link rel="stylesheet" href="assets/css/automation.css?v=202609011448" />
|
||
</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> · Automationen</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">Was von allein passiert</p>
|
||
<h1 class="titel">Automationen</h1>
|
||
<p class="unterzeile">
|
||
Alles hier läuft ohne Zutun. Diese Seite zeigt, was gerade greift –
|
||
und wo du es abschalten kannst.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<!-- Die KI ist die einzige Automation mit Schalter: Sie kostet
|
||
Rechenzeit, die der Website gehört. -->
|
||
<section class="ki-kasten" id="ki-kasten">
|
||
<div class="ki-kasten__kopf">
|
||
<div>
|
||
<p class="marke">Lokale KI</p>
|
||
<h2 class="ki-kasten__titel">Vorschläge in Calls, Start-Check und Report</h2>
|
||
<p class="ki-kasten__text" id="ki-text">Zustand wird geprüft …</p>
|
||
</div>
|
||
<label class="schalter" id="ki-schalter-block" hidden>
|
||
<input type="checkbox" id="ki-schalter" />
|
||
<span class="schalter__gleis"><span class="schalter__punkt"></span></span>
|
||
<span class="schalter__text"><strong id="ki-schalter-text">Angeschaltet</strong></span>
|
||
</label>
|
||
</div>
|
||
<ul class="ki-kasten__daten" id="ki-daten"></ul>
|
||
</section>
|
||
|
||
<!-- Was gerade tatsächlich anliegt: dieselbe Quelle wie auf dem
|
||
Dashboard, hier aber vollständig statt gekürzt. -->
|
||
<section class="block">
|
||
<div class="block__kopf">
|
||
<h2 class="block__titel">Was gerade anliegt</h2>
|
||
<span class="block__zahl" id="hinweis-zahl">–</span>
|
||
</div>
|
||
<p class="block__frage">
|
||
Dieselben Hinweise wie auf der Übersicht, hier vollständig. Sie führen keine
|
||
eigene Liste – jeder verschwindet, sobald die Sache erledigt ist.
|
||
</p>
|
||
<div id="hinweise"><p class="leise">Wird geprüft …</p></div>
|
||
</section>
|
||
|
||
<!-- Sicherung und Zustand. Steht bewusst weit oben: Es ist die einzige
|
||
Automation, deren Ausfall alles auf einmal kosten würde. -->
|
||
<section class="zustand" id="zustand-kasten">
|
||
<div class="zustand__kopf">
|
||
<div>
|
||
<p class="marke">Sicherung & Zustand</p>
|
||
<h2 class="zustand__titel" id="zustand-titel">Wird geprüft …</h2>
|
||
<p class="zustand__text" id="zustand-text"></p>
|
||
</div>
|
||
<button type="button" class="knopf knopf--klein" id="jetzt-sichern">Jetzt sichern</button>
|
||
</div>
|
||
<ul class="zustand__daten" id="zustand-daten"></ul>
|
||
<div class="klapp-kopf zustand__listenkopf">
|
||
<p class="feldschild">Vorhandene Sicherungen</p>
|
||
<button type="button" class="knopf-still" id="sicherungen-schalter"
|
||
aria-expanded="false" aria-controls="sicherungen" hidden>
|
||
<span id="sicherungen-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>
|
||
<div id="sicherungen" data-klapp="zu"></div>
|
||
</section>
|
||
|
||
<section class="block">
|
||
<div class="block__kopf">
|
||
<h2 class="block__titel">Läuft dauerhaft im Hintergrund</h2>
|
||
</div>
|
||
<div class="regeln" id="regeln"></div>
|
||
</section>
|
||
|
||
<section class="block">
|
||
<!-- 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>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<script src="assets/js/wahl.js?v=202609011448" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609011448" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609011448" defer></script>
|
||
<script src="assets/js/automation.js?v=202609011448" defer></script>
|
||
</body>
|
||
</html>
|