Files
dogfather-universe/workspace/report.html
T
DogFatherGitandClaude Opus 5 fc4fde0f02 Buehnen hell, Flaechen dicht - und die Kopfleiste wieder kurz
DIE BUEHNEN WAREN ZU DUNKEL. Bei 0.42 Helligkeit sah man Schemen, nicht
die Szene -- "zu dunkel und sieht ganz komisch aus" traf es genau. Jetzt
0.66 mit etwas mehr Farbe (1.08), die Vignette schwaecher (0.52 statt
0.72). Die Bilder kommen durch.

MOEGLICH IST DAS NUR MIT DEM GEGENZUG: Alle Kacheln, Karten und Spalten
lagen bei 2 bis 3 Prozent WEISS -- also praktisch durchsichtig. Solange
der Hintergrund fast schwarz war, fiel das nicht auf; sobald er hell
wurde, lief das Bild mitten durch den Text. Jetzt gibt es --flaeche
(rgba(9,13,22,.78)), eine deckende dunkle Flaeche, und 44 Stellen in 16
Dateien holen sich ihre Farbe von dort.

Der Unterschied ist genau der, den Filipe beschrieben hat: Der
Hintergrund bleibt sichtbar, aber ZWISCHEN den Kacheln -- nicht hinter
der Schrift. Wer die Flaechen kuenftig dichter oder durchlaessiger will,
aendert eine einzige Zeile statt 44.

Die Kacheln selbst tragen ihren Farbton jetzt AUF der Flaeche
(color-mix mit --flaeche statt mit transparent) -- dadurch bleibt die
Farbe erkennbar, ohne dass die Kachel durchsichtig wird.

DIE KOPFLEISTE war so breit wie das ganze Fenster, obwohl der Text kurz
ist: .marke__text stand auf flex: 1 1 auto. Das war unsichtbar, solange
der Schriftzug nur Text war -- seit er einen Rahmen traegt, lief die
Pille quer durchs Bild. Jetzt flex: 0 1 auto (schrumpfen ja, wachsen
nein). Gemessen: 375 px statt 1280.

Kontrast an echten Bildpunkten auf allen sechs Seiten nachgemessen --
haelt trotz des viel helleren Bildes (schlechtester Wert 4,69:1).

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-01 11:20:02 +02:00

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 &amp; 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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/report.css?v=202609011117" />
</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&nbsp;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 &amp; 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=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/report.js?v=202609011117" defer></script>
</body>
</html>