Durchgang durch die Team-Dogi-Seiten aus der Sicht von jemandem, der
sie zum ersten Mal sieht. Alles hier ist am Code belegt und nachgemessen.
1. "KLINGELT NICHTS?" WARF ALLE DREI TEAM-ROLLEN AUF DIE STARTSEITE.
anruf-probe.html erklaert, WARUM das Telefon stumm bleibt. Sie steht in
der Rechtetafel offen, und aus dem Chat zeigen zwei Knoepfe darauf. Nur
hatte sie nie eine Kachel -- absichtlich, sie ist kein Bereich. Seit die
Adressregel vom 15.09. eine Kachel VERLANGT, landete jeder Klick wortlos
auf start.html.
Das ist die schlimmste Sorte Sackgasse: Man ruft sie auf, WEIL schon
etwas nicht geht, und sie wirft einen hinaus.
Mit derselben Zeile geheilt: Die Hinweisleiste wirft jeden Hinweis weg,
dessen Ziel es auf dieser Adresse nicht gibt -- "Bei dir klingelt nichts"
wurde auf crew deshalb NIE angezeigt. Ausgerechnet der Hinweis, der acht
von elf Leuten betrifft.
2. UND DIESE SEITE HATTE GAR KEINE GESTALTETE KOPFLEISTE.
.kopfleiste, __zurueck, __mitte, __titel stehen in KEINER Stilvorlage --
sie leben in start.css, die diese Seite absichtlich nicht laedt. Die
Leiste war nackter Text. Auf einer Seite, die man im Stoerfall aufruft,
sieht unfertig aus wie kaputt. Jetzt im <style>-Block der Seite, aus
demselben Grund wie ihr uebriges CSS.
3. EIN MODI KAM NICHT AN SEINE EIGENE AUSWERTUNG.
entwicklung.html und werdegang.html haben BEIDE eine ausgearbeitete
Eigensicht, und die Rechtetafel laesst ihn hinein. In seiner Kachelliste
stand keine von beiden -- der Weg existierte fuer ihn nicht. Die ganze
Eigensicht war toter Code, ausgerechnet fuer den, fuer den sie ist.
Mein eigener Fehler vom Vortag.
Zwei eigene Kacheln in "Fuer dich", aus den Leitungskacheln abgeleitet.
Sie loesen zugleich eine Namenskollision: Bis heute setzten BEIDE Seiten
fuer ihn die Ueberschrift "Deine Entwicklung".
4. DER KALENDER-LINK WAR FUER DIE COMMUNITY EINE SACKGASSE.
Auf jeder Brettkarte mit Termin stand "Im Kalender am 24.09." als Link.
kalender.html steht auf ALLE -- und ALLE ist ausdruecklich ohne "gast".
Jetzt fragt der SERVER die beiden Schranken (kalender_offen) und die
Karte zeigt den Termin als Text statt als Link. Die Auskunft bleibt, nur
der Weg ins Leere faellt weg. Die Regel im Browser nachzubauen waere die
vierte Stelle fuer dieselbe Frage gewesen.
5. EIN MODI KAM AN DIE TALENTE-NOTIZEN, DIE IHM VERWEHRT SIND.
BRETTER_UEBER_SEITEN war eine feste Liste ("wer die Seite darf, muss
auch dorthin kommen") und fragte nie, WER fragt. Ueber
bereich.html?b=talente kam er an Notizen zu Zuschauern, obwohl
talente.html fuer ihn gesperrt ist -- Begruendung dort: "Hier stehen
Namen von Menschen, die nichts davon wissen."
Aus der Liste wurde eine Zuordnung Brett -> Seite, gefragt wird
darfSeite(). Nachgemessen: modi/talente 404, modi/entwicklung darf,
hand+admin unveraendert.
Dazu stand in workspace-bereiche.js ein Kommentar, der das GEGENTEIL des
Codes behauptete ("entwicklung, talente bleiben 404"). Ein falscher
Kommentar an einer Rechtestelle ist schlimmer als keiner.
6. ZWEI KACHELN "CHAT", BEIDE AUF DIESELBE SEITE.
Seit dem Treff-Chat von gestern sahen Modi und rechte Hand zweimal
"Chat" mit demselben Ziel. Jetzt "Treff-Chat" mit ?raum=treff, das den
Raum direkt oeffnet -- gesucht an denselben zwei Merkmalen, an denen ihn
der Rest der Datei erkennt.
7. VERTRAUEN: "WIE GEHT'S DIR?" VERSPRACH MEHR, ALS ES HALTEN KANN.
Dort stand: "Niemand aus dem Team sieht deine Antworten -- auch
DogFather nicht." Punkt. Fast wahr und deshalb gefaehrlich: Aus
denselben Antworten entsteht eine namenlose Ampel fuer die Leitung.
Der ehrliche Satz war laengst geschrieben und wurde vom Server sogar
mitgeliefert (block.text) -- nur hat ihn nie jemand angezeigt. Er steht
jetzt im HTML, nicht im Skript: Wer die Seite oeffnet, soll ihn lesen,
BEVOR er tippt.
8. DIE NEUE AUSWERTUNG, AUS BENUTZERSICHT NACHGEBESSERT.
- Der Streifen hatte keine Zeichenerklaerung. Im Dateikopf stand "wer
Farben schlecht unterscheidet, liest dasselbe Zeichen" -- das stimmt
nur, wenn irgendwo steht, was die Zeichen heissen. Jetzt eine Legende,
aus `stufen` gebaut statt abgeschrieben.
- "nie gesetzt" war ein Mittelpunkt, "Kann ich nicht sagen" ein
Halbgeviertstrich. Zwei kurze Striche nebeneinander fuer den
Unterschied zwischen "niemand hat hingesehen" und "jemand hat
hingesehen und konnte es nicht sagen". Leer ist jetzt wirklich leer,
mit gestricheltem Rahmen.
- Die Aufschluesselung der Balken stand nur im Mausueberfahren -- am
Handy also nie, und dort steht jemand damit im Stream. Jetzt als Text.
- Die Modi-Sicht bekam Balken ohne Erklaerung, ein "Frag danach" ohne
Adressaten und bei fehlender Bewegung ein LEERES Element. Jetzt
Lesehilfe, ein Leerkasten mit Satz und zwei Wege weiter.
9. NEBENBEFUNDE, DIE DIE PRUEFUNG GEFUNDEN HAT.
pruef-css-klassen war schon VOR dieser Arbeit rot (nachgemessen mit
git stash). Alle drei Befunde behoben:
- hilfe.html und unsere-seiten.html luden ihre Seitendatei NACH
module.css und haus.css und ueberschrieben damit das Haus.
- Zwei Schriftgroessen unter 11,5 px aus dem gestrigen Bau
(.71rem Monatsbeschriftung, .68rem Marke) auf .75 und .72 gehoben.
- Die Pruefung selbst war blind fuer <style>-Bloecke in der Seite und
meldete deshalb dauerhaft drei Fehler an einer Seite, die ihre
Stile mit Absicht selbst traegt. Eine Warnung, die immer kommt, ist
keine Warnung mehr -- jetzt sieht sie hin, statt die Seite
auszunehmen.
Kleinkram nebenbei: "die Antworten sieht nur du" -> "siehst nur du" auf
der Kachel zur empfindlichsten Seite des Hauses. "Bewertet wird dort" ->
"Eingeschaetzt wird dort" in teamlage.html, zwei Zeilen unter "keine
Bewertung von Menschen". "1 Aufgabe(n) angelegt" ausgeschrieben.
GEMESSEN: pruef-css-klassen ALLES IN ORDNUNG (vorher 3 Fehler),
pruef-meldungen 8/0, pruef-rechtetafel 19/0, alle Module laden,
keine doppelten Kachelnamen/-ziele/-farben mehr in allen vier Rollen.
Co-Authored-By: Claude Opus 5 <[email protected]>
193 lines
8.5 KiB
HTML
193 lines
8.5 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>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=202609191457" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609191457" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609191457" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609191457" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609191457" />
|
||
<link rel="stylesheet" href="assets/css/content.css?v=202609191457" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609191457" />
|
||
<!-- 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=202609191457" />
|
||
</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> · 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=202609191457" defer></script>
|
||
|
||
<script src="assets/js/wahl.js?v=202609191457" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609191457" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609191457" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609191457" defer></script>
|
||
<script src="assets/js/checkliste.js?v=202609191457" defer></script>
|
||
<script src="assets/js/vorlagen.js?v=202609191457" defer></script>
|
||
<script src="assets/js/content.js?v=202609191457" defer></script>
|
||
</body>
|
||
</html>
|