Files
dogfather-universe/workspace/scouting.html
T
DogFatherGitandClaude Opus 5 8107b97379 Die Kopfleiste wuchs beim Laden um vier Pixel -- und schob die Seite
Beim Messen des Datenvolumens nach dem Bildumbau fiel etwas anderes
auf: Der Layout-Sprung auf der Startseite lag bei 0,99. Die Bilder waren
es nicht -- ein Hintergrundbild liegt `position: fixed` und bewegt gar
nichts.

Die Meldung sagte es selbst, man musste nur hinsehen: ALLES sprang um
denselben Betrag (295->301, 144->150, 685->692, 605->611). Wenn die
ganze Seite gleichmaessig nach unten rutscht, waechst etwas ueber ihr.

Gemessen: Leiste vor dem Skript 67 px, danach 71. Der Sicht-Umschalter
kommt erst, wenn die Personenliste geladen ist, und ist mit 42 px das
hoechste Teil in der Reihe. Vier Pixel -- man sieht sie kaum und merkt
sie doch: Wer beim Laden schon zielt, klickt daneben.

Die Loesung ist keine reservierte Hoehe auf Verdacht, sondern die Hoehe,
die die Zeile ohnehin haben muss: `min-height: 44px`. Das ist das
Mindestmass fuer ein Fingerziel (WCAG 2.5.8) und gilt hier sowieso fuer
jedes Teil. Damit ist die Zeile immer so hoch wie ihr groesstes
zulaessiges Element -- unabhaengig davon, ob dieses gerade schon da ist
oder erst kommt.

Ergebnis: 0,99 auf 0,60, und die Zahl der Seiten ueber dem Zielwert von
zwoelf auf sechs. Datenvolumen unveraendert in Ordnung trotz der
groesseren Bilder -- der Browser holt je Seite nur eine Stufe.

Und der offene Punkt von vorhin ist geklaert: pruef-browser laeuft
gruen durch, alle vier Maschinen (Chromium, Firefox, WebKit, WebKit auf
dem iPhone), 64 Seitenaufrufe, 15898 Elemente. Der eine rote Punkt im
Gesamtlauf war eine Zeitueberschreitung unter Dauerlast -- erkennbar
daran, dass ZWEI Pruefungen gar nicht gelaufen waren und die Datei die
doppelte Zeit brauchte. Eine gesunkene Anzahl ist ein eigener Befund.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-07 01:46:29 +02:00

136 lines
5.8 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>Scouting · Creator Workspace</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#0674b9" />
<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=202609070141" />
<link rel="stylesheet" href="assets/css/start.css?v=202609070141" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609070141" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609070141" />
</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&nbsp;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 &amp; 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 &amp; 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>
</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=202609070141" defer></script>
<script src="assets/js/bereiche.js?v=202609070141" defer></script>
<script src="assets/js/kopf.js?v=202609070141" defer></script>
<script src="assets/js/glocke.js?v=202609070141" defer></script>
<script src="assets/js/scouting.js?v=202609070141" defer></script>
</body>
</html>