DogFatherGitandClaude Opus 5
8c7dc1fa94
Wunsch Filipe: "die uhr und der [ring] sollen noch bissl groesser sein und ... dan auch am ende die selbe groesse haben bitte. sehr wichtig." WARUM SIE ES VORHER NICHT WAREN: Der Ring stand in heim.css (232 / 220 / 190), die Uhr in start.css (164 / 118). Zwei Dateien, zwei Zahlensaetze, und keine Stelle, an der jemand beide zugleich gesehen haette. Nachgemessen lagen sie am Rechner 68 px auseinander. Das war kein Versehen an einer Zahl, sondern die zwangslaeufige Folge davon, dass es zwei gab. Jetzt entscheidet `--instrument` ueber beide -- und ueber die Spalten, in denen sie sitzen. Gemessen: 248/248 am Rechner, 224/224 am Tablet, 196/196 am Handy. Ein Auseinanderlaufen ist nicht mehr moeglich, sondern muesste absichtlich geschrieben werden. Die alte Angabe in start.css ist ENTFERNT, nicht ueberschrieben: eine wirkungslose Zahl, die richtig aussieht, ist genau die Falle. ZWEI FOLGEN, BEIDE ERST IM BILD SICHTBAR: 1. DIE UHR HING 32 px UEBER DIE KACHELKANTE. Die rechte Spalte war auf das Instrument bemessen (248), braucht aber auch die Knopfreihe daneben (48 + 14 Abstand = 310). Die Seite liess sich trotzdem nicht seitlich schieben -- der Ueberstand lag INNERHALB der Kachel, also hat keine vorhandene Pruefung angeschlagen. Jetzt ist die Spaltenbreite abgeleitet (`--spalte`), nicht getippt. Beide Aussenspalten bekommen sie, obwohl links keine Knoepfe stehen: sonst saesse der Titel nicht mehr mittig. Der Ring wird in seiner Spalte zentriert. 2. DIE ZIFFERN WAREN ZU KLEIN. Sie standen in `rem` -- in einer Uhr von 164 px richtig, in einer von 248 verloren (29,76 px in einem 248-px-Zifferblatt, die Mitte eine leere Flaeche). Sie haengen jetzt ebenfalls an `--instrument`. Der Faktor ist nachgesehen, nicht gerechnet: 0,145 war noch zu klein, 0,168 fuellt die Mitte, ohne an die innerste Bahn zu stossen (Stundenbalken liegen bei Radius 31,5 von 50). Geprueft: pruef-start-ansicht (kein Text abgeschnitten, keine Konsolenfehler), pruef-handy, pruef-workspace-seiten (18 Seiten, Ueberstand 0 px), pruef-css-klassen -- alle in Ordnung. Dazu 1500/900/390 px einzeln nachgemessen: Uhr und Ring auf den Pixel gleich, Abstand zur Kachelkante 30 bzw. 64 px. Co-Authored-By: Claude Opus 5 <[email protected]>
129 lines
5.6 KiB
HTML
129 lines
5.6 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>Mein Steckbrief · 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" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609090109" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609090109" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609090109" />
|
||
<link rel="stylesheet" href="assets/css/profil.css?v=202609090109" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609090109" />
|
||
</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 Workspace</a> · Mein 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=202609090109" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609090109" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609090109" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609090109" defer></script>
|
||
<script src="assets/js/steckbrief.js?v=202609090109" defer></script>
|
||
</body>
|
||
</html>
|