Filipe: "ich will in jeder seite auch eine kleine detaillierte aber
schnelle erklaerung kurz und knapps noch zu jeder seite."
DREI ZEILEN AUF JEDER DER 25 SEITEN
WOFUER was auf dieser Seite steht
DU TUST was man hier konkret macht
MERKE nur dort, wo es etwas gibt, das man falsch versteht
SIEHT wer diese Seite ueberhaupt oeffnen kann
Offen sichtbar und nicht hinter einem Aufklapper: "schnell" war seine
Bedingung, und eine Erklaerung, die man erst aufklappen muss, ist
genau dann nicht da, wenn man sie braucht.
DIE ZEILE "SIEHT" IST GERECHNET, NICHT GESCHRIEBEN
Sie kommt aus der Rechtetafel -- aus derselben, aus der auch die
Schranke ihre Entscheidung holt. Haette ich sie danebengeschrieben,
waere sie beim ersten Umstellen in "Wer sieht was" still falsch
geworden, in einem Satz, der behauptet, wer etwas sieht. Die Pruefung
stellt die Tafel deshalb wirklich um und sieht nach, ob der Satz
mitwandert.
Die Erklaerung haengt hinter derselben Schranke wie die Seite: Wer sie
nicht oeffnen darf, bekommt 404 -- nicht 403, sonst waere dieser Weg
eine Landkarte des Hauses.
Eingebunden ist sie nicht ueber eine Liste von Dateinamen, sondern
ueber "wer kopf.js laedt": die 26. Seite ist damit automatisch dabei.
Fuenf Seiten haben keine Kopfzeile (Chat, Kalender, Start, Team,
Teamlage) -- dort haengt der Kasten an <main>, sonst waeren
ausgerechnet die haeufigsten Seiten lautlos leer geblieben.
ZWEI EIGENE MAENGEL, GEFUNDEN DURCH HINSEHEN, NICHT DURCH DIE PRUEFUNG
Die erste Fassung war gruen -- und stand mitten auf dem Buehnenbild,
mit einem Lichtfleck hinter "SIEHT". Und "Wofuer" sprach fast woertlich
die Unterzeile darueber nach. Beides misst die Pruefung jetzt: Kontrast
mit dem dritten Ausgang ("steht auf der Buehne" ist kein Ergebnis) und
die Wortueberschneidung mit der Unterzeile.
ZWEI BEFUNDE, DIE SCHON VORHER ROT WAREN
1. pruef-tempo-workspace verglich die UNKOMPRIMIERTE Groesse gegen eine
Grenze, die fuer die Leitung gedacht war -- waehrend der Kommentar
daneben "das ist, was wirklich ueber die Leitung ging" behauptete.
Live steht Caddy davor. Nachgemessen an der echten Adresse:
start.css 345 KB -> 111 KB zstd. Die Pruefung wog also 1,2 MB, wo
Filipe 500 KB bekommt. Jetzt wird Komprimierbares im Pruefstand
gzip-gepackt (115 KB gegen 111 KB live -- auf vier Prozent genau),
geurteilt wird ueber die uebertragene Groesse, berichtet werden
beide. Dabei prompt in die dokumentierte Falle getappt: `body()` auf
einen Ereignisstrom endet nie, der Lauf blieb stehen. Jetzt
ausgenommen, plus Notbremse je Koerper.
2. pruef-ueberlappung konnte seit Tagen nicht mehr zeigen, dass sie
eine Ueberlappung ueberhaupt findet: Ihre Gegenprobe legt einen Knopf
auf einen anderen, traf aber 6 px daneben. Zwei Ursachen in einer
Zeile -- `position: fixed` bezieht sich auf einen Vorfahren mit
`transform`, und die `transition` der Knoepfe liefert beim sofortigen
Messen die Lage von vorher. Jetzt `transform` + `transition: none`:
34x36 px erkannt, 20 Seiten-Breiten-Paare, 0 Befunde.
PRUEFUNGEN: pruef-erklaerung neu mit 44, davon 8 im Browser (Seite mit
und ohne Kopfzeile, Handy, Kontrast, Echo). Mein Schild stand auf
10,88 px und lag unter der Hausgrenze von 11,5 -- gefunden von
pruef-css-klassen, nicht vom Auge.
Co-Authored-By: Claude Opus 5 <[email protected]>
184 lines
8.3 KiB
HTML
184 lines
8.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>Scouting · 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=202609141819" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609141819" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609141819" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609141819" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609141819" />
|
||
<link rel="stylesheet" href="assets/css/scouting.css?v=202609141819" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609141819" />
|
||
<!-- 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=202609141819" />
|
||
</head>
|
||
|
||
<body class="start">
|
||
|
||
<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> · Scouting</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">Scout-CRM</p>
|
||
<h1 class="titel">Pipeline</h1>
|
||
<p class="unterzeile" id="unterzeile">Vom ersten Fund bis zur Übergabe – nachvollziehbar statt im Kopf.</p>
|
||
</div>
|
||
<div class="steuerung">
|
||
<div id="scoutwahl-block" hidden>
|
||
<label class="feld-schild" for="f-scout">Scout</label>
|
||
<select id="f-scout"><option value="">Alle Scouts</option></select>
|
||
</div>
|
||
<button type="button" class="knopf knopf--klein" id="neu-auf">Neuer Kontakt</button>
|
||
</div>
|
||
</section>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<!-- Follow-ups: der Teil, der ohne System am ehesten untergeht. -->
|
||
<section class="faellig" id="faellig" hidden>
|
||
<p class="faellig__titel">Follow-up fällig</p>
|
||
<ul class="faellig__liste" id="faellig-liste"></ul>
|
||
</section>
|
||
|
||
<section class="neu" id="neu-block" hidden>
|
||
<h2 class="neu__titel">Neuer Kontakt</h2>
|
||
<form id="neu-form">
|
||
<div class="neu__raster">
|
||
<div class="feld feld--breit">
|
||
<label class="feld-schild" for="n-name">Name</label>
|
||
<input id="n-name" maxlength="120" required placeholder="Wie heißt die Person?" />
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-plattform">Plattform</label>
|
||
<input id="n-plattform" maxlength="60" placeholder="z. B. TikTok" />
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-handle">Profil / Handle</label>
|
||
<input id="n-handle" maxlength="120" placeholder="@…" />
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-prio">Priorität</label>
|
||
<select id="n-prio">
|
||
<option value="hoch">Hoch</option>
|
||
<option value="mittel" selected>Mittel</option>
|
||
<option value="niedrig">Niedrig</option>
|
||
</select>
|
||
</div>
|
||
<div class="feld" id="n-scout-block" hidden>
|
||
<label class="feld-schild" for="n-scout">Scout</label>
|
||
<select id="n-scout"><option value="">– niemandem zugeordnet –</option></select>
|
||
</div>
|
||
<div class="feld feld--breit">
|
||
<label class="feld-schild" for="n-aktivitaet">Aktivität & LIVE-Fokus</label>
|
||
<input id="n-aktivitaet" maxlength="3000" placeholder="Wie oft LIVE? Welche Zeiten? Welches Format?" />
|
||
</div>
|
||
<div class="feld feld--breit">
|
||
<label class="feld-schild" for="n-potenzial">Potenzial & Stil</label>
|
||
<input id="n-potenzial" maxlength="3000" placeholder="Was macht die Person besonders?" />
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-followup">Nächster Follow-up</label>
|
||
<input id="n-followup" type="date" />
|
||
</div>
|
||
<!-- DIE DREI QUALIFIZIERENDEN FRAGEN (11.09.2026).
|
||
|
||
Sie stehen schon beim Anlegen da, weil sie sonst nie
|
||
gestellt werden: "Schon im Netzwerk?" entscheidet, ob sich
|
||
der ganze Rest lohnt, und wer sie erst nach drei Nachrichten
|
||
stellt, hat drei Nachrichten zu viel geschrieben.
|
||
|
||
Alle drei sind freiwillig. Ein Pflichtfeld beim Anlegen
|
||
wäre die sichere Art, dafür zu sorgen, dass Kontakte gar
|
||
nicht erst eingetragen werden. -->
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-netzwerk">Schon im Netzwerk?</label>
|
||
<select id="n-netzwerk">
|
||
<option value="">– noch nicht gefragt –</option>
|
||
<option value="nein">frei</option>
|
||
<option value="ja">schon im Netzwerk</option>
|
||
<option value="unbekannt">noch nicht gefragt</option>
|
||
</select>
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-land">Land</label>
|
||
<select id="n-land">
|
||
<option value="">– nicht angegeben –</option>
|
||
<option value="DE">Deutschland</option>
|
||
<option value="AT">Österreich</option>
|
||
<option value="CH">Schweiz</option>
|
||
<option value="LU">Luxemburg</option>
|
||
<option value="andere">anderes Land</option>
|
||
</select>
|
||
</div>
|
||
<div class="feld">
|
||
<label class="feld-schild" for="n-follower">Follower</label>
|
||
<input id="n-follower" maxlength="14" inputmode="numeric" placeholder="z. B. 12400 oder 12,4k" />
|
||
</div>
|
||
</div>
|
||
<p class="fehler" id="n-fehler" role="alert" aria-live="polite"></p>
|
||
<div class="neu__knoepfe">
|
||
<button type="submit" class="knopf knopf--klein" id="n-speichern">Aufnehmen</button>
|
||
<button type="button" class="knopf-still" id="neu-zu">Abbrechen</button>
|
||
</div>
|
||
</form>
|
||
</section>
|
||
|
||
<div id="pipeline" aria-busy="true"><p class="leise">Pipeline wird geladen …</p></div>
|
||
|
||
</main>
|
||
|
||
<!-- Zugangscode nach dem Onboarding: genau einmal sichtbar. -->
|
||
<div class="schleier" id="code-schleier" hidden>
|
||
<div class="code-fenster" role="dialog" aria-modal="true" aria-labelledby="code-titel">
|
||
<p class="marke">Onboarding gestartet</p>
|
||
<h2 class="code-fenster__titel" id="code-titel">Zugangscode</h2>
|
||
<p class="code-fenster__text">
|
||
Dieser Code wird <strong>genau einmal</strong> angezeigt und ist danach nicht mehr
|
||
abrufbar. Gib ihn persönlich weiter, nicht über einen offenen Kanal.
|
||
</p>
|
||
<p class="code-fenster__code" id="code-wert">—</p>
|
||
<div class="neu__knoepfe">
|
||
<button type="button" class="knopf knopf--klein" id="code-kopieren">Kopieren</button>
|
||
<button type="button" class="knopf-still" id="code-zu">Habe ich notiert</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="assets/js/wahl.js?v=202609141819" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609141819" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609141819" defer></script>
|
||
<script src="assets/js/erklaerung.js?v=202609141819" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609141819" defer></script>
|
||
<script src="assets/js/scouting.js?v=202609141819" defer></script>
|
||
</body>
|
||
</html>
|