Files
dogfather-universe/workspace/content.html
T
DogFatherGitandClaude Opus 5 e7cd1984d8 Ein Rollenname im ausgelieferten Code, die Seite zu breit, und drei Pruefungen, die den Umbau verschlafen hatten
Filipe: "falls es noch was gibt was fehlt oder nicht richtig funktioniert,
auf dem handy oder auf dem pc, oder als installiert, ich will dass du das
alles abcheckst und machst dass jede seite reibungslos klappt."

Gemessen wurde der ganze Bestand: 26 Pruefdateien einzeln, dazu drei neue
Messungen fuer Dinge, die keine Pruefung ansieht. Von 37 roten Meldungen
aus dem Nachtlauf sind nach dieser Runde die haelfte erledigt -- und die
Haelfte davon war gar nicht kaputt.

=== ECHTE FEHLER ===

1. EIN ROLLENNAME STAND IM AUSGELIEFERTEN QUELLTEXT.
   `aufgaben.js` sagte "Modis moechten das uebernehmen -- du
   entscheidest". Diese Datei bekommt JEDER, der die Seite oeffnet:
   jeder Manager, jeder Scout, jeder Creator im anderen Haus. Der
   verborgene Zugang haelt genau so lange, wie der Name dort nicht
   steht. Er stammte aus der Bewerbungsspalte von gestern -- einen Tag
   alt, gefunden von pruef-modi-wortleck. Jetzt: "Jemand moechte das
   uebernehmen". Wer es ist, steht ohnehin mit Namen auf den Karten
   darunter, und die sieht nur, wer sie sehen darf.

2. DIE SUPPORT-SEITE WAR AUF JEDER BREITE UNTER 1440 px ZU BREIT --
   13 px auf dem Handy, 41 px auf dem Tablet quer, 30 px auf dem
   Laptop. Schuld war das weiche Licht, das ich in der Nacht eingebaut
   habe: `inset: -8% -4% 0`. Die vier Prozent rechts sahen nach einer
   Kleinigkeit aus; ein absolut gesetztes Element zaehlt aber zur
   Scrollbreite, auch mit `pointer-events: none` und `z-index: -1`.

   `pruef-breiten` hat es gemeldet und konnte nicht sagen, WAS es ist
   ("13px Ueberstand []") -- ein Pseudoelement hat keine Box im DOM.
   Gefunden hat es eine neue Messung, die JEDES echte Element abfragt:
   keines ragte heraus, und genau das war der Hinweis.
   Jetzt: 0 px auf allen neun Breiten, 38 Seiten, 84 252 Elemente.

3. EIN AUFGABENLINK IM REPORT WAR 27 x 18 px GROSS. Mit der Maus gut,
   mit dem Daumen nicht -- eine Fingerkuppe ist rund 45 px breit.
   Jetzt fuellt der Link die Zeile und ist 44 px hoch, aber nur auf
   schmalen Bildschirmen und an groben Zeigegeraeten. Die zweite
   Bedingung habe ich beim ersten Anlauf vergessen, und der Link blieb
   27 x 21 -- eine Regel, die nur unter idealen Bedingungen greift,
   hilft niemandem auf dem halben Weg dorthin.

4. EINE SEITE LUD DAS FALSCHE MANIFEST. `anruf-probe.html` verwies
   fest auf `crew.webmanifest`; die Seite ist aber fuer ALLE Rollen
   offen und damit auf beiden Adressen erreichbar. Wer sie im
   Agenturhaus oeffnet und die App installiert, bekam "DogFather
   Universe" mit dem Crew-Symbol auf den Startbildschirm. Alle anderen
   38 Seiten machen es richtig: `app.webmanifest`, und die Adresse
   biegt es um.

5. DER KNOPF "+ GIF HINZUFUEGEN" WAR 40 px HOCH, und der Kommentar
   daneben nannte das "die Hausgroesse". Die Hausgroesse sind 44 --
   fuenfmal in derselben Datei so begruendet. Die erste Reparatur
   griff nicht: Die Fingerregel stand 400 Zeilen VOR der Grundregel,
   und bei gleicher Staerke gewinnt die spaetere. Jetzt steht sie
   direkt dahinter, und der Knopf misst 133 x 44 am Finger, 133 x 40
   an der Maus.

   KEINE PRUEFUNG KONNTE DAS FINDEN: Die GIF-Tafel ist zu, solange
   niemand sie aufmacht, und alle Rundgaenge messen, was auf dem
   Bildschirm steht. Dafuer gibt es jetzt server/mess-gifs-handy.mjs.

6. ZWEI KLEINIGKEITEN AUS DER NACHT: eine Fehlerkennung ohne Satz
   (`unbekannter_punkt`) und eine Stelle in support.js, die den
   Serverfehler roh anzeigte statt durch `fehlerText` -- die zwei
   anderen Stellen derselben Datei machen es richtig. So entsteht eine
   Ausnahme: nicht aus Absicht, sondern weil man die Hausregel beim
   Neuschreiben nicht danebenliegen hatte.

7. TOTES CSS (.e-leerwahl, vier Regeln). Der Leerkasten ist am
   24.09. auf Filipes Wunsch wieder verschwunden, sein Stil blieb
   einen Tag laenger stehen.

=== ROT, ABER NICHT KAPUTT ===

Drei Pruefungen haben den Umbau vom 24.09. nicht mitbekommen:

  pruef-anruf meldete 31 Fehler und "ein Gespraech entsteht (403)".
  Sie meldete DogFather auf der AGENTUR-Adresse an und liess ihn dann
  die rechte Hand anrufen -- die es dort seit der Haustrennung nicht
  gibt. Der Server hatte recht. Jetzt telefoniert Team Dogi auf crew.,
  und der Creator bleibt auf workspace. -- seine Gegenprobe ist damit
  sogar schaerfer als vorher (ein Fremder aus dem ANDEREN Haus).
  96 -> 127 Pruefungen, 0 Fehler.

  pruef-crew-wand-bild erwartete vier Rollen auf der Zugangswand. Es
  sind fuenf, seit die linke Hand am 21.09. dazukam. Die Zeile stand
  unter einem Kommentar, der wortwoertlich vor festen Namen in
  Pruefungen warnt ("eine Zeitbombe mit Datum") -- und war selbst
  einer. Jetzt leitet sie die Rollen aus `rollenImHaus("crew")` ab,
  derselben Quelle, aus der der Server die Wand baut.

  pruef-entwicklung-kacheln rechnete noch mit "x von 68". Seit
  Filipes Wunsch ("es sollen nur die menge angezeigt werden die wir
  zutragen") ist das Ganze das, was jemandem zugetragen ist. Sie baut
  jetzt BEIDE Faelle -- eine Person mit vier zugetragenen Punkten und
  eine ohne -- und misst Ring, Bogen, Zeile und Vorleseschild gegen
  die Zuteilung. Dazu eine Gegenprobe mit einer Einschaetzung auf
  einem NICHT zugetragenen Punkt: zaehlt die Uebersicht sie mit,
  stuende dort 2 statt 1. 31 -> 34 Pruefungen, 0 Fehler.

=== WAS DIE BILDSCHAU ANGEHT ===

Meine eigene Messung meldete erst "Mitte 174 von 640" -- die Schau sah
kaputt aus. Sie war es nicht: `querySelector("img")` nahm das
Husky-Zeichen in der Kopfzeile statt des Bildes. Nachgemessen am
richtigen Element steht es auf 195 von 195 (Handy) und 640 von 640
(Rechner), und ein GIF oeffnet sich als GIF. Ein Messfehler, der wie
ein Befund aussieht, kostet mehr Zeit als gar keine Messung -- deshalb
steht die Begruendung jetzt im Quelltext der Messung.

GEMESSEN: pruef-breiten (9 Breiten, 38 Seiten, 84 252 Elemente),
pruef-support 63/0, pruef-gifs 17/0, pruef-chat 63/0, pruef-chat-optik
62/0, pruef-tippziele 11/0, pruef-css-klassen, pruef-struktur,
pruef-meldungen, pruef-modi-wortleck, pruef-crew-adresse,
pruef-installieren, pruef-aufgabenbrett, pruef-entwicklung -- alle 0
Fehler.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-25 12:31:21 +02:00

194 lines
8.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Content-Ideen · 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=202609251230" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609251230" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609251230" />
<link rel="stylesheet" href="assets/css/start.css?v=202609251230" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609251230" />
<link rel="stylesheet" href="assets/css/content.css?v=202609251230" />
<link rel="stylesheet" href="assets/css/module.css?v=202609251230" />
<!-- 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=202609251230" />
</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> · Content</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">Betreuung</p>
<h1 class="titel">Content-Ideen</h1>
<p class="unterzeile" id="unterzeile">
Von der Idee bis zum Upload – eine Strecke, kein Terminkalender.
</p>
</div>
<button type="button" class="knopf knopf--klein" id="neu-oeffnen">Video anlegen</button>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Kennzahlen. Bewusst wenige und jede mit einer Handlung dahinter –
eine Zahl ohne Vergleich ist eine Eitelkeitszahl. -->
<!-- Die Kennzahlen-Reihe stand hier bis zum 01.09.2026 ("diese Kisten
sind jetzt ueberall zu viel, die sollen weg"). Die Strecke darunter
zeigt dieselben Zahlen an jeder Spalte. -->
<!-- Säulen-Balance: gestapelter Balken, 90 Tage, nur Veröffentlichtes. -->
<section class="balance" id="balance" hidden>
<div class="klapp-kopf">
<p class="feldschild">Womit der Kanal gefüllt wird <span class="leise" id="balance-zeit"></span></p>
<button type="button" class="knopf-still" id="saeulen-oeffnen">Säulen verwalten</button>
</div>
<div class="balance__balken" id="balance-balken" role="img" aria-label="Verteilung auf die Content-Säulen"></div>
<ul class="legende" id="balance-legende"></ul>
<p class="balance__hinweis" id="balance-hinweis"></p>
</section>
<!-- Säulen verwalten. Zugeklappt, weil man das selten anfasst. -->
<section class="saeulen-kasten" id="saeulen-kasten" hidden>
<div class="klapp-kopf">
<p class="feldschild">Content-Säulen</p>
<button type="button" class="knopf-still" id="saeulen-zu">Schließen</button>
</div>
<p class="block__frage">
Drei bis fünf Themen, aus denen der Kanal besteht. Als Richtwert gilt
<strong>70 % Wert</strong> (Unterhaltung, Hilfe), <strong>20 % Community</strong>,
<strong>10 % Eigenwerbung</strong>. Eine Säule wird erst brauchbar, wenn Formate an ihr hängen.
</p>
<div id="saeulen-liste"></div>
<form class="saeule-neu" id="saeule-neu">
<div class="feld feld--saeule-creator" id="feld-saeule-creator" hidden>
<label class="feld-schild" for="s-creator">Für</label>
<select id="s-creator"></select>
</div>
<div class="feld">
<label class="feld-schild" for="s-name">Name der Säule</label>
<input id="s-name" maxlength="40" placeholder="z. B. Tutorials" required />
</div>
<div class="feld feld--schmal">
<label class="feld-schild" for="s-ziel">Ziel-Anteil %</label>
<input id="s-ziel" type="number" min="0" max="100" step="5" placeholder="z. B. 70" />
</div>
<button type="submit" class="knopf knopf--klein">Hinzufügen</button>
</form>
</section>
<!-- Formular für ein neues Video -->
<form class="neu" id="neu" hidden>
<div class="neu__raster">
<div class="feld feld--breit">
<label class="feld-schild" for="f-titel">Worum geht es?</label>
<input id="f-titel" name="titel" maxlength="160" required
placeholder="z. B. „3 Fehler beim ersten LIVE“" />
</div>
<div class="feld feld--breit">
<label class="feld-schild" for="f-hook">
Hook <span class="leise">– die ersten Sekunden, sie entscheiden über alles</span>
</label>
<input id="f-hook" name="hook" maxlength="300"
placeholder="z. B. „Ich hab 4 Monate gebraucht, um das zu kapieren.“" />
</div>
<div class="feld" id="feld-creator" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-art">Stufe</label>
<select id="f-art"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-saeule">Säule</label>
<select id="f-saeule"></select>
</div>
<div class="feld">
<label class="feld-schild" for="f-format">Format</label>
<input id="f-format" maxlength="60" list="formate" placeholder="z. B. Tutorial" />
<datalist id="formate">
<option value="Talking Head"></option>
<option value="Tutorial"></option>
<option value="Story"></option>
<option value="LIVE-Ausschnitt"></option>
<option value="Vorher/Nachher"></option>
<option value="Reaktion"></option>
<option value="Behind the Scenes"></option>
</datalist>
</div>
<div class="feld">
<label class="feld-schild" for="f-geplant">Soll raus am</label>
<input id="f-geplant" type="date" />
</div>
<div class="feld feld--breit">
<label class="feld-schild" for="f-text">Ablauf, Notizen (optional)</label>
<textarea id="f-text" rows="3" maxlength="6000"></textarea>
</div>
</div>
<p class="fehler" id="neu-fehler" role="alert" aria-live="polite"></p>
<div class="neu__knoepfe">
<button type="submit" class="knopf knopf--klein" id="neu-speichern">Anlegen</button>
<button type="button" class="abmelden" id="neu-abbrechen">Abbrechen</button>
</div>
</form>
<div class="filterzeile" id="filterzeile"></div>
<!-- Die Strecke. Fünf Spalten, auf dem Handy untereinander. -->
<!-- Fertige Ideen zum Uebernehmen. Steht VOR der Strecke: Wer noch
nichts hat, soll nicht erst an leeren Spalten vorbeiscrollen. -->
<div id="vorlagen" hidden></div>
<div class="strecke" id="strecke" aria-busy="true">
<p class="leise">Wird geladen …</p>
</div>
</main>
<script src="assets/js/meldung.js?v=202609251230" defer></script>
<script src="assets/js/nachfrage.js?v=202609251230" defer></script>
<script src="assets/js/wahl.js?v=202609251230" defer></script>
<script src="assets/js/bereiche.js?v=202609251230" defer></script>
<script src="assets/js/installieren.js?v=202609251230" defer></script>
<script src="assets/js/kopf.js?v=202609251230" defer></script>
<script src="assets/js/glocke.js?v=202609251230" defer></script>
<script src="assets/js/checkliste.js?v=202609251230" defer></script>
<script src="assets/js/content.js?v=202609251230" defer></script>
</body>
</html>