Eigenes Profil fuer jeden - mit Bild und Kanaelen

SCREEN 1: Jeder im Workspace hat jetzt seinen eigenen Steckbrief --
Creator, Scout, Manager und DogFather gleichermassen. Ein Bild, ein Satz
ueber sich, und die Kanaele, auf denen er unterwegs ist. Er steht ganz
oben auf profil.html, ueber der Creator-Akte; die ist etwas anderes
(die fuehren die Betreuer, den Steckbrief fuehrt man selbst).

Das Bild erscheint sofort ueberall: in der Kopfleiste jeder Seite und in
der Begruessung. /api/ich liefert es deshalb gleich mit -- das spart auf
jeder Seite eine zweite Abfrage und verhindert, dass die Plakette erst
als Buchstabe erscheint und dann umspringt. Faellt das Bild aus, steht
der Buchstabe da: Er wird nicht ersetzt, sondern liegt darunter.

WARUM KEINE ECHTE TIKTOK-ANMELDUNG. "Mit TikTok verbinden" klingt nach
OAuth. Das waere: ein Entwicklerkonto mit App-Freischaltung, eine
Pruefung durch TikTok (Wochen, widerrufbar), je Person ein Zugriffstoken,
das ablaeuft, erneuert werden muss und -- wenn es abhandenkommt --
fremden Zugriff auf ein fremdes Konto bedeutet. Dafuer bekaeme man
Follower-Zahlen.

Gebraucht wird hier aber "Wer ist das, und wo finde ich ihn?". Dafuer
genuegt der oeffentliche Name. Gespeichert wird deshalb NUR das Handle --
kein Token, kein Passwort, nichts, was abhandenkommen kann. Daraus wird
ein Verweis auf den Kanal. Vier Kanaele: TikTok, Instagram, YouTube,
Twitch. Sollen spaeter echte Zahlen dazukommen, ist das ein eigenes
Vorhaben -- der Name hier bleibt dann trotzdem richtig.

Eingefuegt werden darf, was Leute wirklich in der Zwischenablage haben:
"@name", "https://www.tiktok.com/@name" oder der Name allein. Alles wird
auf den Namen zurueckgefuehrt, statt eine Fehlermeldung zu zeigen.

SICHERHEIT beim Bild -- die drei Stellen, an denen Profilbilder
typischerweise scheitern:
  1. Der Typ wird an der SIGNATUR der Datei geprueft, nicht am
     Content-Type, den der Absender behauptet. Ein umbenanntes SVG mit
     Skript darin kaeme sonst durch und liefe im Namen der Domain --
     mit der Sitzung des Betrachters.
  2. Auf der Platte bekommt jede Datei einen Zufallsnamen. Kein Name
     kann Pfade verlassen oder etwas ueberschreiben.
  3. Ausgeliefert mit nosniff und einer eigenen, alles verbietenden
     Inhaltsregel.
Das Bild liegt als Datei neben der Datenbank, nicht darin: Bilder in
SQLite blaehen jede Sicherung auf, und die laeuft jede Nacht.

Niemand schreibt einem anderen ins Profil -- auch DogFather nicht. Ein
Satz ueber sich und der eigene Kanalname gehoeren der Person. Wer wen
SEHEN darf, folgt der bekannten Regel: Leitung alle, Scout seine
Creator, Creator sich und seine Betreuer. Fremde Profile sind 404, nicht
403.

ZWEI FUNDE DURCH DIE PRUEFUNG:
- Der TikTok-Link, den die App beim Teilen kopiert, endet auf
  "?lang=de&is_from_webapp=1". Der wurde abgelehnt: "sieht nicht richtig
  aus" -- obwohl es der offizielle Link ist. Jetzt werden Parameter und
  Anker mit abgeschnitten.
- Ein zu grosses Bild ergab "500 Serverfehler" statt einer Ansage. Der
  PayloadTooLargeError lief bis in die allgemeine Fehlerbehandlung
  durch. Jetzt 413 mit dem Satz, wie viel erlaubt ist. Von Hand haette
  das vermutlich nie jemand probiert.

Vor der Schemaaenderung wurde eine geprueft vollstaendige Sicherung
gezogen (VACUUM INTO, Integritaet ok, 6 Personen).

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-01 11:31:34 +02:00
co-authored by Claude Opus 5
parent fc4fde0f02
commit 299ef0d506
23 changed files with 1204 additions and 120 deletions
+102
View File
@@ -66,3 +66,105 @@
@media (max-width: 560px) {
.gruppe { padding: 16px 15px 18px; }
}
/* ===================================================================
Der eigene Steckbrief
Steht ganz oben und gehoert JEDEM im Workspace -- nicht nur Creatorn.
Deshalb sieht er auch anders aus als die Creator-Akte darunter: eine
geschlossene Karte mit dem Bild links, nicht ein weiteres Formularfeld.
=================================================================== */
.steckbrief {
position: relative; overflow: hidden;
margin-bottom: 28px;
padding: 22px;
border: 1px solid color-mix(in srgb, var(--ton, var(--akzent)) 22%, var(--rand));
border-radius: var(--radius);
background:
radial-gradient(90% 120% at 0% 0%,
color-mix(in srgb, var(--ton, var(--akzent)) 12%, transparent), transparent 62%),
var(--flaeche);
}
.steckbrief__kopf { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
.steckbrief__bildfeld { display: grid; gap: 10px; justify-items: center; flex: none; }
/* Rund, wie die Plakette in der Begruessung: Ein runder Koerper gehoert
in dieser Oberflaeche zu einer PERSON, ein eckiger zu einer Sache. */
.steckbrief__bild {
display: grid; place-items: center;
width: 128px; height: 128px; border-radius: 50%;
overflow: hidden;
font-size: 3rem; font-weight: 700; line-height: 1;
color: #f2f7fd;
border: 1px solid color-mix(in srgb, var(--ton, var(--akzent)) 40%, transparent);
background:
radial-gradient(120% 120% at 30% 20%,
color-mix(in srgb, var(--ton, var(--akzent)) 30%, transparent), transparent 70%),
rgba(255, 255, 255, .05);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .1),
0 14px 34px -16px color-mix(in srgb, var(--ton, var(--akzent)) 70%, transparent);
}
.steckbrief__bild img { width: 100%; height: 100%; object-fit: cover; display: block; }
.steckbrief__bildknoepfe { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
/* Das Dateifeld ist versteckt; die Beschriftung ist der Knopf. Sie muss
deshalb auch AUSSEHEN wie einer und den Zeiger aendern. */
.steckbrief__bildknoepfe label { cursor: pointer; }
.steckbrief__text { flex: 1 1 320px; min-width: 0; }
.steckbrief__name {
margin: 4px 0 2px;
font-size: 1.5rem; letter-spacing: -.02em; color: #f2f7fd;
}
.steckbrief__rolle {
margin: 0 0 16px;
font-size: .78rem; letter-spacing: .12em; text-transform: uppercase;
color: color-mix(in srgb, var(--ton, var(--akzent)) 62%, #cfe0f0);
}
.steckbrief__schild { margin-top: 18px; }
.steckbrief textarea { width: 100%; }
/* ---------- Die Kanaele ---------------------------------------------------
Gespeichert wird NUR der oeffentliche Name -- kein Login, kein Token
(Begruendung im Kopf von server/workspace-steckbrief.js). Das @ steht
deshalb fest vor dem Feld und wird nicht mit eingegeben: So ist ohne
Erklaerung klar, was hier hingehoert. */
.steckbrief__kanaele { display: grid; gap: 8px; margin-top: 8px; }
.kanal {
display: grid;
grid-template-columns: 92px minmax(0, 1fr) auto;
align-items: center; gap: 10px;
}
.kanal__name { font-size: .84rem; color: var(--text-leise); }
.kanal__feld {
display: flex; align-items: center;
border: 1px solid var(--rand); border-radius: var(--radius-klein);
background: rgba(0, 0, 0, .22);
overflow: hidden;
}
.kanal__feld:focus-within { border-color: color-mix(in srgb, var(--akzent) 50%, transparent); }
.kanal__at { padding: 0 2px 0 11px; color: var(--text-still); }
.kanal__feld input {
flex: 1 1 auto; min-width: 0;
border: 0; background: none; color: var(--text);
font: inherit; font-size: .88rem;
padding: 9px 11px 9px 3px;
}
.kanal__feld input:focus { outline: none; }
.kanal__auf { font-size: .78rem; color: var(--akzent); white-space: nowrap; }
.steckbrief__fuss {
display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
margin-top: 18px;
}
.steckbrief__stand { font-size: .82rem; color: var(--text-leise); }
@media (max-width: 560px) {
.steckbrief { padding: 18px 15px; }
.steckbrief__kopf { gap: 16px; }
.steckbrief__bild { width: 96px; height: 96px; font-size: 2.2rem; }
.kanal { grid-template-columns: 1fr; gap: 4px; }
.kanal__auf { justify-self: start; }
}
+12
View File
@@ -25,10 +25,22 @@
ziel.textContent = '';
ziel.dataset.rolle = ich.rolle || '';
/* Das eigene Bild, wenn es eines gibt -- sonst der Anfangsbuchstabe.
Der Buchstabe bleibt als Unterlage LIEGEN und wird nicht ersetzt:
Laedt das Bild nicht (Verbindung weg, Datei geloescht), steht dort
weiterhin etwas Sinnvolles statt eines kaputten Bildsymbols. */
const zeichen = document.createElement('span');
zeichen.className = 'wer__zeichen';
zeichen.setAttribute('aria-hidden', 'true');
zeichen.textContent = (ich.name || '?').trim().charAt(0).toUpperCase();
if (ich.bild) {
const b = document.createElement('img');
b.className = 'wer__bild';
b.src = ich.bild;
b.alt = '';
b.addEventListener('error', () => b.remove());
zeichen.append(b);
}
const name = document.createElement('span');
name.className = 'wer__name';
+192
View File
@@ -134,3 +134,195 @@
}
})();
})();
/* ===================================================================
Der eigene Steckbrief.
Läuft unabhängig vom Creator-Formular darüber: Den Steckbrief hat
JEDER (auch Scouts, Manager und DogFather), die Creator-Akte nur ein
Creator. Deshalb ein eigener, abgeschlossener Block -- fällt einer
von beiden aus, steht der andere weiterhin.
=================================================================== */
(() => {
'use strict';
const $ = (id) => document.getElementById(id);
const block = $('steckbrief');
if (!block) return;
let stand = null;
async function hole(pfad, optionen = {}) {
const a = await fetch(pfad, { credentials: 'same-origin', ...optionen });
if (a.status === 401) { location.assign('/workspace/'); throw new Error('abgemeldet'); }
return a;
}
const melde = (t) => { $('sb-fehler').textContent = t || ''; };
const sage = (t) => {
$('sb-stand').textContent = t || '';
if (t) setTimeout(() => { if ($('sb-stand').textContent === t) $('sb-stand').textContent = ''; }, 4000);
};
function bildZeigen(quelle, name) {
const feld = $('sb-bild');
feld.textContent = '';
if (quelle) {
const b = document.createElement('img');
b.src = quelle;
b.alt = '';
/* Fällt das Bild aus, erscheint der Buchstabe -- nicht das kaputte
Bildsymbol des Browsers. */
b.addEventListener('error', () => { b.remove(); feld.textContent = anfang(name); });
feld.append(b);
$('sb-bild-weg').hidden = false;
} else {
feld.textContent = anfang(name);
$('sb-bild-weg').hidden = true;
}
}
const anfang = (n) => (n || '?').trim().charAt(0).toUpperCase();
function kanaeleBauen(kanaele, vorhanden) {
const ziel = $('sb-kanaele');
ziel.textContent = '';
for (const k of kanaele) {
const zeile = document.createElement('div');
zeile.className = 'kanal';
zeile.dataset.art = k.art;
const schild = document.createElement('label');
schild.className = 'kanal__name';
schild.setAttribute('for', 'sb-' + k.art);
schild.textContent = k.name;
const feld = document.createElement('div');
feld.className = 'kanal__feld';
const at = document.createElement('span');
at.className = 'kanal__at';
at.setAttribute('aria-hidden', 'true');
at.textContent = '@';
const eingabe = document.createElement('input');
eingabe.id = 'sb-' + k.art;
eingabe.type = 'text';
eingabe.maxLength = 40;
eingabe.autocomplete = 'off';
eingabe.placeholder = 'dein Name';
const da = vorhanden.find((v) => v.art === k.art);
eingabe.value = da ? da.handle : '';
feld.append(at, eingabe);
zeile.append(schild, feld);
/* Ein Verweis erscheint erst, wenn wirklich ein Name da ist -- ein
Knopf, der ins Leere führt, ist schlimmer als keiner. */
if (da) {
const a = document.createElement('a');
a.className = 'kanal__auf';
a.href = da.adresse;
a.target = '_blank';
a.rel = 'noopener noreferrer';
a.textContent = 'öffnen';
zeile.append(a);
}
ziel.append(zeile);
}
}
function zeichne(sb, kanaele) {
stand = sb;
$('sb-name').textContent = sb.name;
$('sb-rolle').textContent = sb.rolle_name;
$('sb-rolle').dataset.rolle = sb.rolle;
$('sb-ueber').value = sb.ueber_mich || '';
bildZeigen(sb.bild, sb.name);
kanaeleBauen(kanaele, sb.kanaele);
block.hidden = false;
}
/* ---------- Bild hochladen ---------------------------------------------
Roh im Rumpf statt als multipart -- dasselbe Verfahren wie in der
Dateiablage. Kein Parsen von multipart im Server, keine zusätzliche
Abhängigkeit. */
$('sb-datei').addEventListener('change', async (e) => {
const datei = e.target.files?.[0];
if (!datei) return;
melde('');
if (datei.size > 4 * 1024 * 1024) {
melde('Das Bild ist größer als 4 MB. Bitte ein kleineres nehmen.');
e.target.value = '';
return;
}
sage('Bild wird hochgeladen …');
try {
const a = await hole('/workspace/api/steckbrief/bild', {
method: 'POST',
headers: { 'Content-Type': 'application/octet-stream' },
body: datei,
});
const antwort = await a.json().catch(() => ({}));
if (!a.ok) { melde(antwort.fehler || 'Das Hochladen ging nicht.'); sage(''); return; }
bildZeigen(antwort.bild, stand?.name);
sage('Bild gespeichert.');
/* Auch oben rechts in der Kopfleiste soll sofort das neue Bild
stehen -- sonst müsste man die Seite neu laden, um es zu sehen. */
const oben = document.querySelector('.wer__zeichen');
if (oben) {
oben.querySelector('.wer__bild')?.remove();
const b = document.createElement('img');
b.className = 'wer__bild';
b.src = antwort.bild;
b.alt = '';
oben.append(b);
}
} catch { /* umgeleitet */ } finally { e.target.value = ''; }
});
$('sb-bild-weg').addEventListener('click', async () => {
if (!confirm('Profilbild entfernen?')) return;
try {
const a = await hole('/workspace/api/steckbrief/bild', { method: 'DELETE' });
if (!a.ok) { melde('Entfernen ging nicht.'); return; }
bildZeigen(null, stand?.name);
document.querySelector('.wer__bild')?.remove();
sage('Bild entfernt.');
} catch { /* umgeleitet */ }
});
/* ---------- Speichern ---------------------------------------------------- */
$('sb-speichern').addEventListener('click', async () => {
melde('');
const knopf = $('sb-speichern');
const koerper = { ueber_mich: $('sb-ueber').value };
for (const zeile of document.querySelectorAll('#sb-kanaele .kanal')) {
koerper[zeile.dataset.art] = zeile.querySelector('input').value;
}
knopf.disabled = true;
try {
const a = await hole('/workspace/api/steckbrief/mein', {
method: 'PATCH',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(koerper),
});
const antwort = await a.json().catch(() => ({}));
if (!a.ok) { melde(antwort.fehler || 'Speichern ging nicht.'); return; }
/* Neu zeichnen, damit die "öffnen"-Verweise zu den frisch
eingetragenen Namen sofort erscheinen. */
zeichne(antwort.steckbrief, KANAELE);
sage('Profil gespeichert.');
} catch { /* umgeleitet */ } finally { knopf.disabled = false; }
});
let KANAELE = [];
(async () => {
try {
const a = await hole('/workspace/api/steckbrief/mein');
if (!a.ok) return;
const { steckbrief, kanaele } = await a.json();
KANAELE = kanaele;
zeichne(steckbrief, kanaele);
} catch { /* umgeleitet oder nicht verfügbar -- die Seite bleibt nutzbar */ }
})();
})();
+7 -7
View File
@@ -7,9 +7,9 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
</head>
<body class="start">
@@ -139,9 +139,9 @@
</form>
</dialog>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/aufgaben.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/aufgaben.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609011130" />
</head>
<body class="start">
@@ -132,9 +132,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/automation.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/automation.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609011130" />
</head>
<body class="start">
@@ -107,9 +107,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/bereich.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/bereich.js?v=202609011130" defer></script>
</body>
</html>
+9 -9
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609011130" />
</head>
<body class="start">
@@ -54,10 +54,10 @@
</main>
<script src="assets/js/ki.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/calls.js?v=202609011117" defer></script>
<script src="assets/js/ki.js?v=202609011130" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/calls.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/content.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/content.css?v=202609011130" />
</head>
<body class="start">
@@ -158,9 +158,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/content.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/content.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609011130" />
</head>
<body class="start">
@@ -93,9 +93,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/dateien.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/dateien.js?v=202609011130" defer></script>
</body>
</html>
+2 -2
View File
@@ -25,7 +25,7 @@
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" href="assets/img/favicon.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
</head>
<body class="gate">
@@ -143,6 +143,6 @@
</p>
</main>
<script src="assets/js/gate.js?v=202609011117" defer></script>
<script src="assets/js/gate.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609011130" />
</head>
<body class="start">
@@ -147,9 +147,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/kalender.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/kalender.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609011130" />
</head>
<body class="start">
@@ -121,9 +121,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/personen.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/personen.js?v=202609011130" defer></script>
</body>
</html>
+46 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609011130" />
</head>
<body class="start">
@@ -48,6 +48,44 @@
</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>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<form id="formular" hidden>
@@ -132,9 +170,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/profil.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/profil.js?v=202609011130" defer></script>
</body>
</html>
+9 -9
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/report.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/report.css?v=202609011130" />
</head>
<body class="start">
@@ -91,10 +91,10 @@
</main>
<script src="assets/js/ki.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/report.js?v=202609011117" defer></script>
<script src="assets/js/ki.js?v=202609011130" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/report.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609011130" />
</head>
<body class="start">
@@ -124,9 +124,9 @@
</div>
</div>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/scouting.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/scouting.js?v=202609011130" defer></script>
</body>
</html>
+6 -6
View File
@@ -7,8 +7,8 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
</head>
<body class="start">
@@ -99,9 +99,9 @@
</p>
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/start.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/start.js?v=202609011130" defer></script>
</body>
</html>
+9 -9
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609011130" />
</head>
<body class="start">
@@ -70,10 +70,10 @@
</main>
<script src="assets/js/ki.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/startcheck.js?v=202609011117" defer></script>
<script src="assets/js/ki.js?v=202609011130" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/startcheck.js?v=202609011130" defer></script>
</body>
</html>
+6 -6
View File
@@ -7,9 +7,9 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609011130" />
</head>
<body class="start">
@@ -57,9 +57,9 @@
</main>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/uebersicht.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/uebersicht.js?v=202609011130" defer></script>
</body>
</html>
+8 -8
View File
@@ -7,10 +7,10 @@
<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=202609011117" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609011117" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609011130" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609011130" />
</head>
<body class="start">
@@ -175,9 +175,9 @@
</main>
<script src="assets/js/wahl.js?v=202609011117" defer></script>
<script src="assets/js/bereiche.js?v=202609011117" defer></script>
<script src="assets/js/kopf.js?v=202609011117" defer></script>
<script src="assets/js/wissen.js?v=202609011117" defer></script>
<script src="assets/js/wahl.js?v=202609011130" defer></script>
<script src="assets/js/bereiche.js?v=202609011130" defer></script>
<script src="assets/js/kopf.js?v=202609011130" defer></script>
<script src="assets/js/wissen.js?v=202609011130" defer></script>
</body>
</html>