DogFatherGitandClaude Opus 5
d8720debc1
ZWEI MELDUNGEN.
1. "DAS SIEHT JA MAL RICHTIG SCHEISSE AUS"
Die Rollenauswahl im Formular "Neue Person" lief unten aus dem
Formular heraus und legte sich ueber die Personenliste darunter.
Die Ursache war keine schlampige Gestaltung, sondern eine Regel, die
fuer etwas anderes gemacht ist: `.neu__raster > *` (aufgaben.css) gibt
JEDEM direkten Kind ein Raster mit fester Zeilenhoehe von 44 px, damit
Beschriftung und Eingabefeld in allen Spalten auf einer Linie sitzen.
Fuer ein einzeiliges Feld ist das genau richtig. Die Rollenauswahl ist
aber kein Feld, sondern ein Block aus vier hohen Karten -- die passten
nicht in 44 px, und was nicht hineinpasst, steht eben daneben.
Das Formular ist jetzt aus dem Spaltenraster geloest und liest sich
von oben nach unten: NAME (schmal, ein Name braucht keine 1200 px),
ROLLE (volle Breite, vier gleich breite Karten), Knoepfe. Das ist
nicht nur reparierter Ueberlauf, sondern auch die Reihenfolge, in der
man die Sache tatsaechlich entscheidet.
Dazu zwei Kleinigkeiten, die den Unterschied machen: Das Namensfeld
war ohne Rasterzeile 60 px hoch geworden (`height: 100%` einer Zeile,
die es nicht mehr gibt) -- hoeher als die Knoepfe daneben, was nach
Versehen aussieht, weil es eins war. Und die gewaehlte Rolle traegt
jetzt ein HAEKCHEN, nicht nur einen etwas helleren Rahmen: Genau die
Art Unterschied, die im Kontrastmodus verschwindet und fuer
farbunsichere Augen nie existiert hat.
2. "DIE MANAGER SOLLEN DIESE KATEGORIEN GARNICHT SEHEN"
"Personen & Zugaenge" und "Automationen" gehoeren ab sofort allein
DogFather.
Bei den Personen war es ohnehin ein Widerspruch im eigenen Haus: In
der Rollenauswahl steht seit jeher "Manager -- dieselben Rechte wie
DogFather, AUSSER der Personenverwaltung". Die Kachel stand trotzdem
bei ihm, und die Schranke liess ihn hinein: Codes erneuern, sperren,
Zuteilungen aendern. Eine Beschreibung, die etwas anderes sagt als die
Software, ist schlimmer als beides einzeln -- man weiss danach nicht
mehr, welcher von beiden man glauben soll.
Umgesetzt auf DREI Ebenen, weil Wegnehmen was man SIEHT kein
Rechteentzug ist:
1. die Kachel erscheint nicht mehr
2. die Seite leitet zur Startseite zurueck (GESCHUETZT)
3. die Schnittstellen antworten mit 404 -- Personenverwaltung,
Systemzustand, KI-Schalter
FOLGE, die bewusst in Kauf genommen wird: Die Betreuungs-Zuteilung
liegt auf der Personenseite. Ab jetzt kann also NUR DogFather
festlegen, wer welchen Creator betreut.
GEPRUEFT: server/pruef-personen-formular.mjs, 20 Pruefungen. Das Aussehen
wird gemessen, nicht angesehen: Endet die Rollenauswahl innerhalb des
Formulars? Ragt eine Karte seitlich hinaus? Liegt etwas ueber der Liste?
Sind alle vier Karten gleich breit (272-272 px)? Traegt die gewaehlte ein
Haekchen? Dazu zwei Gegenproben: DogFather kommt weiterhin an beide
Bereiche (sonst waere jede Sperr-Zeile auch bei einem fuer ALLE kaputten
Bereich gruen), und die Managerin arbeitet ansonsten unveraendert weiter.
Bestehende Laeufe gruen: Rollen 97, Handy 50, Sicherung 41, Personenliste
33, Team 30, Formulare 19, Code 17, Grosscheck 15.
Co-Authored-By: Claude Opus 5 <[email protected]>
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=202609030000" />
|
|
<link rel="stylesheet" href="assets/css/start.css?v=202609030000" />
|
|
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609030000" />
|
|
<link rel="stylesheet" href="assets/css/report.css?v=202609030000" />
|
|
</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=202609030000" defer></script>
|
|
<script src="assets/js/wahl.js?v=202609030000" defer></script>
|
|
<script src="assets/js/bereiche.js?v=202609030000" defer></script>
|
|
<script src="assets/js/kopf.js?v=202609030000" defer></script>
|
|
<script src="assets/js/report.js?v=202609030000" defer></script>
|
|
</body>
|
|
</html>
|