Files
dogfather-universe/workspace/report.html
T
DogFatherGitandClaude Opus 5 4c0f41762e screen18, zweite Haelfte: Die Tagesfelder werden Tasten in einer Platte
Filipe: "...und die kacheln vom kalender selber sollen viel krasser und
geiler aussehen bitte."

Die dunklen Fugen zwischen den Tagen waren die eine Haelfte des
Wunsches und stehen seit dem 08.09. Die andere Haelfte sind die Felder
SELBST: flache Rechtecke in drei Grautoenen. Eine gefraeste Platte mit
Fugen, in der flache Flaechen liegen, ist halb fertig -- die Fuge sagt
"Werkstueck", die Flaeche sagt "Tabelle".

ZWEI PIXEL MACHEN DEN UNTERSCHIED: eine Lichtkante oben, eine
Schattenkante unten. Dieselbe Rechnung wie ueberall im Haus -- Licht
faellt von oben, also ist die obere Kante hell und die untere dunkel.
Aus einer Flaeche wird ein Koerper, der in der Platte SITZT. Kein
zusaetzliches Element, keine Groessenaenderung, kein Umbruch.

DER WOCHENENDUNTERSCHIED WAR MESSBAR ZU KLEIN -- und das ist der
eigentliche Fund. Werktag lag bei `rgba(11,15,25,.74)`, Wochenende bei
`rgba(9,12,20,.8)`. Auf dem Bildschirm sind die beiden Spalten nicht
auseinanderzuhalten. Die Angabe war also da und wirkungslos, und das
ist die unangenehmste Sorte Fehler: Sie sieht im Quelltext nach einer
Funktion aus, und niemand vermisst, was scheinbar existiert.

Jetzt liegt das Wochenende sichtbar tiefer und etwas kuehler. Man
sieht den Wochenrhythmus, ohne die Spaltenkoepfe zu lesen -- das ist
keine Zierde, sondern die Information, wegen der ein Kalender
ueberhaupt in Wochen gegliedert ist.

HEUTE BLEIBT DAS LAUTESTE FELD, und das war die Bedingung fuer alles
andere: Wenn jedes Feld eine Kante bekommt, muss das eine, auf das es
ankommt, weiter herausstechen. Voller Ring plus ein leiser Schein nach
innen.

AUGENSCHONEND: Alle Werte unter 8 Prozent Deckkraft. Auf sechs mal
sieben Feldern summiert sich jede Helligkeit -- was auf einer Kachel
dezent ist, ist auf 42 Kacheln ein Raster.

Geprueft: pruef-kalender, pruef-buehne (kalender.html schlechtester
Kontrast 5,58:1 bei noetigen 4,5:1, 13 Stellen gemessen),
pruef-css-klassen -- alle in Ordnung.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-09 00:41:24 +02:00

110 lines
4.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>Reports &amp; Review · Spicy & Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<!-- Die Farbe der Fensterleiste, wenn der Workspace als App laeuft.
Stand auf #0674b9 (kraeftiges Blau) und stach damit als einziger
heller Balken ueber einer durchweg dunklen Seite. Jetzt derselbe
Ton wie die Kopfleiste darunter (#06090f), damit Leiste und Seite
eine Flaeche sind statt zweier. -->
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609090041" />
<link rel="stylesheet" href="assets/css/start.css?v=202609090041" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609090041" />
<link rel="stylesheet" href="assets/css/report.css?v=202609090041" />
<link rel="stylesheet" href="assets/css/module.css?v=202609090041" />
</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=202609090041" defer></script>
<script src="assets/js/wahl.js?v=202609090041" defer></script>
<script src="assets/js/bereiche.js?v=202609090041" defer></script>
<script src="assets/js/kopf.js?v=202609090041" defer></script>
<script src="assets/js/glocke.js?v=202609090041" defer></script>
<script src="assets/js/report.js?v=202609090041" defer></script>
</body>
</html>