DogFatherGitandClaude Opus 5
4c0f41762e
Filipe: "...und die kacheln vom kalender selber sollen viel krasser und geiler aussehen bitte." Die dunklen Fugen zwischen den Tagen waren die eine Haelfte des Wunsches und stehen seit dem 08.09. Die andere Haelfte sind die Felder SELBST: flache Rechtecke in drei Grautoenen. Eine gefraeste Platte mit Fugen, in der flache Flaechen liegen, ist halb fertig -- die Fuge sagt "Werkstueck", die Flaeche sagt "Tabelle". ZWEI PIXEL MACHEN DEN UNTERSCHIED: eine Lichtkante oben, eine Schattenkante unten. Dieselbe Rechnung wie ueberall im Haus -- Licht faellt von oben, also ist die obere Kante hell und die untere dunkel. Aus einer Flaeche wird ein Koerper, der in der Platte SITZT. Kein zusaetzliches Element, keine Groessenaenderung, kein Umbruch. DER WOCHENENDUNTERSCHIED WAR MESSBAR ZU KLEIN -- und das ist der eigentliche Fund. Werktag lag bei `rgba(11,15,25,.74)`, Wochenende bei `rgba(9,12,20,.8)`. Auf dem Bildschirm sind die beiden Spalten nicht auseinanderzuhalten. Die Angabe war also da und wirkungslos, und das ist die unangenehmste Sorte Fehler: Sie sieht im Quelltext nach einer Funktion aus, und niemand vermisst, was scheinbar existiert. Jetzt liegt das Wochenende sichtbar tiefer und etwas kuehler. Man sieht den Wochenrhythmus, ohne die Spaltenkoepfe zu lesen -- das ist keine Zierde, sondern die Information, wegen der ein Kalender ueberhaupt in Wochen gegliedert ist. HEUTE BLEIBT DAS LAUTESTE FELD, und das war die Bedingung fuer alles andere: Wenn jedes Feld eine Kante bekommt, muss das eine, auf das es ankommt, weiter herausstechen. Voller Ring plus ein leiser Schein nach innen. AUGENSCHONEND: Alle Werte unter 8 Prozent Deckkraft. Auf sechs mal sieben Feldern summiert sich jede Helligkeit -- was auf einer Kachel dezent ist, ist auf 42 Kacheln ein Raster. Geprueft: pruef-kalender, pruef-buehne (kalender.html schlechtester Kontrast 5,58:1 bei noetigen 4,5:1, 13 Stellen gemessen), pruef-css-klassen -- alle in Ordnung. 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=202609090041" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609090041" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609090041" />
|
||
<link rel="stylesheet" href="assets/css/profil.css?v=202609090041" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609090041" />
|
||
</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=202609090041" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609090041" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609090041" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609090041" defer></script>
|
||
<script src="assets/js/steckbrief.js?v=202609090041" defer></script>
|
||
</body>
|
||
</html>
|