Files
dogfather-universe/workspace/report.html
T
DogFatherGitandClaude Opus 5 c4e26409b9 Die Seite laesst sich als App installieren
Das Manifest war lange vollstaendig -- die App LIESS sich
installieren. Nur bot das ausschliesslich der Browser an, versteckt
in seinem Dreipunktemenue. Wer es nicht sucht, findet es nie. Und
ohne installierte App gibt es auf dem Handy keine verlaesslichen
Benachrichtigungen; genau daran hing im September das Telefonieren.

Jetzt steht der Knopf in der Kopfleiste, auf allen Seiten, mit drei
Antworten statt einer:

  schon installiert -> gar kein Knopf
  Browser bietet an -> der Knopf fragt ihn
  Safari am iPhone  -> der Knopf erklaert den Weg

Der dritte Fall ist der gefaehrliche: Dort gibt es
beforeinstallprompt nicht und wird es nicht geben. Ein Knopf, der
am iPhone nichts tut, waere schlimmer als keiner -- man drueckt ihn
und sucht den Fehler bei sich.

pruef-installieren.mjs: 14 Pruefungen, alle drei Zustaende, mit
Gegenprobe in der installierten App.

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

120 lines
5.3 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?v=202609201909" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609201909" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609201909" />
<link rel="stylesheet" href="assets/css/start.css?v=202609201909" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609201909" />
<link rel="stylesheet" href="assets/css/report.css?v=202609201909" />
<link rel="stylesheet" href="assets/css/module.css?v=202609201909" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609201909" />
</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/meldung.js?v=202609201909" defer></script>
<script src="assets/js/nachfrage.js?v=202609201909" defer></script>
<script src="assets/js/ki.js?v=202609201909" defer></script>
<script src="assets/js/wahl.js?v=202609201909" defer></script>
<script src="assets/js/bereiche.js?v=202609201909" defer></script>
<script src="assets/js/kopf.js?v=202609201909" defer></script>
<script src="assets/js/glocke.js?v=202609201909" defer></script>
<script src="assets/js/report.js?v=202609201909" defer></script>
</body>
</html>