Files
dogfather-universe/workspace/steckbrief.html
T
DogFatherGitandClaude Opus 5 7d77f3ea6b Die Zeichen bekommen eine Flaeche -- aus Konturen werden Piktogramme
"ich will die symbole in den kacheln noch viel krasser und geiler."

Bis eben war jedes Zeichen eine reine Kontur. Sauber, aber neutral --
siebzehn gleich starke Umrisse nebeneinander, wie aus jedem
Symbolbaukasten.

Jetzt besteht jedes aus ZWEI Teilen:

  FUELLUNG   eine gefuellte Grundform, gedeckt hinterlegt
  LINIE      die scharfe Zeichnung darueber, mit dem Verlauf von gestern

Das ist der Unterschied zwischen einem Symbol und einem Piktogramm.
Sobald ein Teil FLAECHE hat, bekommt das Zeichen ein Vorn und ein
Hinten, und das Auge erkennt es, ohne es zu lesen.

Gefuellt wird immer das, WORUM ES GEHT -- nie alles:

  Kalender    der Kopf des Blattes (daran erkennt man ihn aus drei Metern)
  Aufgaben    die mittlere Spalte -- "in Arbeit", dort passiert etwas
  Dashboard   zwei der vier Felder ueber Eck, das gibt Rhythmus
  Ordner      der Korpus ohne die Lasche, damit die Stufe sichtbar bleibt
  Berichte    aus drei Strichen werden drei SAEULEN (ein Balkendiagramm
              hat Balken)
  Start-Check nur der Haken -- ein gefuelltes Klemmbrett waere ein Kasten
  Personen    der Kopf; bei zwei Personen nur der VORDERE, daraus
              entsteht die Tiefe
  Buch        die linke Seite -- eine im Licht, eine im Schatten
  Technik     die drei Griffe
  LIVE        der Sender in der Mitte; gefuellte Wellen saehen aus wie
              ein Auge
  Trichter    nur der obere Teil, sonst kippt das Zeichen nach unten

20 % Deckkraft sind gemessen, nicht geraten: darueber wird das Zeichen
zum Fleck und die Linie darin unsichtbar, darunter sieht man die Flaeche
gar nicht. Beim Ueberfahren geht sie auf 30 %, als kaeme Licht dazu.

WARUM NICHT EINFACH DICKER -- der Unterschied zum gescheiterten Versuch
von gestern: Der legte eine dicke, WEICHGEZEICHNETE KOPIE DER LINIE
darunter und hat damit jede Luecke zugeschmiert (aus dem Kalender wurde
ein leerer Kasten). Eine Flaeche ist etwas anderes als ein aufgeblasener
Strich: Sie liegt INNERHALB der Kontur und laesst die Zwischenraeume
unberuehrt. Genau deshalb funktioniert es jetzt.

Im Wasserzeichen und im Kontrastmodus bleibt die Flaeche aus -- dort
wuerde sie den Text hinterlegen bzw. zu einem massiven Block werden.

GEPRUEFT: Buehne 38 (Textkontrast an echten Bildpunkten -- die Flaeche
darf die Lesbarkeit nicht antasten), Startansicht 133, Rollen 97,
Handy 50, Team 30, Grosscheck 15, Lesbarkeit 14. Alle gruen.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-03 01:41:16 +02:00

120 lines
5.0 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>Mein Steckbrief · Creator Workspace</title>
<meta name="robots" content="noindex, nofollow" />
<meta name="theme-color" content="#05070d" />
<link rel="icon" href="assets/img/favicon.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609030141" />
<link rel="stylesheet" href="assets/css/start.css?v=202609030141" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609030141" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609030141" />
</head>
<body class="start">
<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> · Mein&nbsp;Steckbrief</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">
<section class="kopf-zeile">
<div>
<p class="marke">Über mich</p>
<h1 class="titel">Mein Steckbrief</h1>
<p class="unterzeile">
Das hier gehört dir. Dein Bild steht danach in der Kopfleiste, in der
Personenliste und überall dort, wo dein Name auftaucht.
</p>
</div>
</section>
<!-- Der eigene Steckbrief. Steht GANZ OBEN und über allem anderen: Er
gehört jedem im Workspace, nicht nur Creatorn – ein Scout, ein
Manager und DogFather haben ihn genauso. Die Creator-Akte darunter
ist etwas anderes (die führen die Betreuer). -->
<section class="steckbrief" id="steckbrief" hidden>
<div class="steckbrief__kopf">
<div class="steckbrief__bildfeld">
<span class="steckbrief__bild" id="sb-bild" aria-hidden="true"></span>
<div class="steckbrief__bildknoepfe">
<label class="schritt" for="sb-datei">Bild wählen</label>
<input type="file" id="sb-datei" accept="image/jpeg,image/png,image/webp" hidden />
<button type="button" class="schritt" id="sb-bild-weg" hidden>entfernen</button>
</div>
</div>
<div class="steckbrief__text">
<p class="feldschild">Mein Profil</p>
<h2 class="steckbrief__name" id="sb-name">…</h2>
<p class="steckbrief__rolle" id="sb-rolle"></p>
<label class="feld-schild" for="sb-ueber">Ein Satz über dich</label>
<textarea id="sb-ueber" rows="2" maxlength="400"
placeholder="z. B. Ich streame Gaming und Just Chatting, meistens abends."></textarea>
<p class="feldschild steckbrief__schild">Meine Kanäle</p>
<!-- Bewusst nur der öffentliche Name, kein Login: siehe die
Begründung im Kopf von server/workspace-steckbrief.js. -->
<div class="steckbrief__kanaele" id="sb-kanaele"></div>
<p class="fehler" id="sb-fehler" role="alert" aria-live="polite"></p>
<div class="steckbrief__fuss">
<button type="button" class="knopf knopf--klein" id="sb-speichern">Profil speichern</button>
<span class="steckbrief__stand" id="sb-stand" role="status" aria-live="polite"></span>
</div>
</div>
</div>
</section>
<!-- DAS TEAM. Wunsch vom 01.09.2026: "ich will, dass wir Manager,
Scouts, DogFather auch die Fotos, Namen und so alles sehen, alles
was die in ihrem Profil eintragen."
Bis dahin war der Steckbrief eine Einbahnstraße: Jeder pflegte
seinen, und niemand bekam ihn je zu Gesicht. Die Schnittstelle
dafür lag fertig da (GET /workspace/api/steckbrief) und wurde von
keiner einzigen Seite aufgerufen.
Wer wen sieht, entscheidet weiterhin der Server. -->
<!-- EIGENE KLASSEN, nicht die vorhandenen .block__* : Die stehen in
automation.css und wissen.css, und diese Seite lädt beide nicht.
Genau so sind hier schon zweimal Stile ins Leere gelaufen -- der
Aufbau sah richtig aus, auf dem Bildschirm stand nacktes HTML.
Alles zu .team-* steht in start.css, die jede Seite lädt. -->
<section class="team-block" id="team-block" hidden>
<div class="team-block__kopf">
<div>
<p class="feldschild">Das Team</p>
<h2 class="team-block__titel">Wer hier mitarbeitet</h2>
</div>
<span class="team-block__zahl" id="team-zahl"></span>
</div>
<p class="team-block__text" id="team-text"></p>
<div class="team-gitter" id="team"></div>
</section>
</main>
<script src="assets/js/wahl.js?v=202609030141" defer></script>
<script src="assets/js/bereiche.js?v=202609030141" defer></script>
<script src="assets/js/kopf.js?v=202609030141" defer></script>
<script src="assets/js/steckbrief.js?v=202609030141" defer></script>
</body>
</html>