DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Der Installieren-Knopf war nie zu sehen — jetzt schon

Browse Source 
Filipe, 22.09.2026: "und nochmal, ich will einen installieren button.
damit die leute es viel einfacher haben die seite auf dem pc oder auf
dem handy zu installieren!!! bitte das hab ich auch schon paar mal
gefragt. mach das es ist seeeeeeeehr wichtig."

Er hatte recht, und der Knopf war seit dem 20.09. gebaut. Er konnte
nur nie erscheinen. ZWEI URSACHEN, beide ausserhalb dessen, was
geprueft wurde:

1. DER SERVICE WORKER LIEF NIE. Er wurde ausschliesslich in glocke.js
   angemeldet -- also erst, wenn jemand Benachrichtigungen ERLAUBT.
   Auf Filipes Rechner stehen sie auf "Vom Browser blockiert"; das
   steht sogar in seiner Kopfleiste auf dem Bildschirmfoto von heute
   frueh. Ohne Service Worker macht Chrome kein Installationsangebot.

2. UND AUCH MIT WAERE ES NICHT GEGANGEN: Chrome verlangt einen Service
   Worker MIT `fetch`-Zuhoerer. Dieser hatte keinen.

Ohne Angebot kommt `beforeinstallprompt` nie, und der Knopf bleibt
`hidden`. Fuer immer.

WAS SICH GEAENDERT HAT

- Der Service Worker wird jetzt auf JEDER Seite angemeldet, unabhaengig
  von Benachrichtigungen. Das gehoert zum Installieren, nicht zur
  Glocke.
- sw.js bekommt einen `fetch`-Zuhoerer, der NICHTS ablegt. Das
  Versprechen im Kopf der Datei ("bewusst ohne Zwischenspeicher, der
  Workspace liegt hinter einer Anmeldung") bleibt damit wortwoertlich
  gueltig: Er reicht Seitenaufrufe durch und baut nur dann selbst eine
  Antwort, wenn das Netz weg ist. Keine Serverantwort wird aufgehoben.
- Der Knopf zeigt sich, sobald der Browser installieren KANN, statt
  erst nach dem Angebot. Geprueft wird die Faehigkeit
  (`'onbeforeinstallprompt' in window`), nicht der Name des Browsers.
- DIE ANMELDEWAND BEKOMMT IHN AUCH. Sie hat keine Kopfleiste und
  deshalb bisher gar kein Angebot -- dabei ist sie die Seite, auf der
  jeder zuerst landet. Genau die Leute, um die es Filipe geht.
- Dafuer steht der Knopf jetzt in einer eigenen Datei
  (assets/js/installieren.js) statt in kopf.js, das die Wand nicht
  laedt. Und sein Stil in gate.css statt in module.css -- vierter Fall
  derselben Art nach .knopf-still, dem Schalter und .feld-hinweis.
- Ohne `nachfrage.js` (also auf der Wand) erklaert er den Weg als
  Absatz unter sich. Der erste Entwurf rief `window.frageNach?.()`
  auf: Auf dem iPhone steht der Knopf dort von Anfang an da, und er
  haette beim Antippen stumm nichts getan.
- Der Aufruf haengt nicht mehr an der Reihenfolge der Skriptzeilen.
  chat.html und leistung.html laden kopf.js OHNE `defer`, dort waere
  installieren.js immer zu spaet gekommen -- zwei von 37 Seiten ohne
  Knopf, ohne Meldung.
- Chromes Manifest-Warnung zum `share_target` behoben (enctype).

WARUM DIE PRUEFUNG DAS NICHT GEFUNDEN HAT -- und was jetzt anders ist

Sie war gruen, die ganze Zeit. Sie hat `beforeinstallprompt` SELBST
zugestellt und gemessen, ob der Knopf darauf reagiert. Die eine Frage,
auf die es ankam -- "bietet der Browser es ueberhaupt an?" -- hat sie
nie gestellt.

Jetzt fragt sie Chrome direkt (`Page.getInstallabilityErrors`, sein
eigenes Urteil) und misst die Voraussetzungen statt der Reaktion:
laeuft ein Service Worker, OBWOHL Benachrichtigungen auf "denied"
stehen; hat sw.js einen fetch-Zuhoerer; legt er wirklich nichts ab;
steht der Knopf auf der Wand und tut er dort auch etwas.

Gemessen, mit Benachrichtigungen auf "denied":
  Service Worker: activated
  Chromes Urteil: kein einziges Hindernis
  Manifest:       nichts beanstandet
  Knopf:          124x45 px, sichtbar, genau einer

pruef-installieren 29/0 (von 14). Dazu gruen: pruef-css-klassen,
pruef-struktur, pruef-crew-adresse, pruef-start-ansicht.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
DogFatherGit
2026-09-22 14:16:03 +02:00
co-authored by Claude Opus 5
parent 774eeee3e5
commit a8e49496ad
45 changed files with 3008 additions and 2457 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/pruef-installieren.mjs
+172 -3
View File
@@ -46,7 +46,9 @@ const express = (await import("express")).default;
const ec = express.response.cookie;
express.response.cookie = function (n, w, o) { return ec.call(this, n, w, { ...(o || {}), secure: false }); };
await import("./index.js");
notbremse(220_000, "pruef-installieren");
/* 220 -> 360 s: Abschnitt 0 startet einen weiteren Browser
und wartet auf den Service Worker. */
notbremse(360_000, "pruef-installieren");
await new Promise((r) => setTimeout(r, 900));
const BASIS = `http://127.0.0.1:${PORT}`;
@@ -101,6 +103,155 @@ try {
return { ctx, s };
}
/* =====================================================================
0. BIETET DER BROWSER ES UEBERHAUPT AN? (neu am 22.09.2026)
=====================================================================
DAS HIER IST DIE FRAGE, DIE ZWEI TAGE LANG NIEMAND GESTELLT HAT.
Die Pruefungen darunter stellen `beforeinstallprompt` SELBST zu und
messen, was die Seite damit macht. Das war richtig gedacht und
vollstaendig wertlos: Sie waren gruen, waehrend der Knopf auf
Filipes Rechner seit dem 20.09. unsichtbar blieb, weil das echte
Ereignis nie kam. Er hat dreimal danach gefragt.
ZWEI URSACHEN, beide ausserhalb dessen, was gemessen wurde:
1. Der Service Worker wurde nur in `glocke.js` angemeldet, also
erst beim ERLAUBEN von Benachrichtigungen. Auf Filipes
Rechner stehen sie auf "Vom Browser blockiert".
2. Der Service Worker hatte keinen `fetch`-Zuhoerer. Chrome
verlangt ihn fuer sein Installationsangebot.
Ohne Service Worker kein Angebot, ohne Angebot kein Knopf.
GEMESSEN WIRD JETZT AN DER QUELLE: `Page.getInstallabilityErrors`
ist Chromes eigenes Urteil ueber genau diese Frage. Eine leere
Liste heisst, dass der Browser es anbietet. Das kann keine
nachgestellte Veranstaltung vortaeuschen.
`beforeinstallprompt` selbst wird hier bewusst NICHT verlangt: In
dieser Umgebung (kein Profil, kein Nutzerverhalten, kein Fenster)
loest Chromium es nicht aus. Das Urteil oben ist die Aussage, auf
die es ankommt.
===================================================================== */
{
const ctx0 = await browser.newContext({ viewport: { width: 1280, height: 860 } });
const s0 = await ctx0.newPage();
const cdp = await ctx0.newCDPSession(s0);
await cdp.send("Page.enable");
/* OHNE ANMELDUNG UND OHNE BENACHRICHTIGUNGSRECHT -- genau die Lage,
in der es bisher nicht ging. Die Anmeldewand ist ausserdem die
Seite, auf der jeder zuerst landet. */
await s0.goto(BASIS + "/workspace/", { waitUntil: "networkidle" });
await s0.waitForTimeout(2200);
const sw = await s0.evaluate(async () => {
if (!("serviceWorker" in navigator)) return { da: false };
const r = await navigator.serviceWorker.getRegistration("/workspace/");
return { da: !!r, aktiv: !!r?.active, stand: r?.active?.state || null,
recht: Notification.permission };
});
ok(sw.recht !== "granted",
`Benachrichtigungen sind NICHT erlaubt (${sw.recht}) -- genau Filipes Lage`);
ok(sw.da === true && sw.aktiv === true,
`und trotzdem laeuft ein Service Worker (${sw.stand}) `
+ `-- vorher haette hier "keiner" gestanden`);
/* Der `fetch`-Zuhoerer: ohne ihn bietet Chrome nichts an. Gemessen
an der Datei, nicht am Gedaechtnis. */
const { readFileSync: lies } = await import("node:fs");
const { fileURLToPath: alsPfad } = await import("node:url");
const { dirname: ordnerVon } = await import("node:path");
const wurzel = join(ordnerVon(alsPfad(import.meta.url)), "..");
const swText = lies(join(wurzel, "workspace", "sw.js"), "utf8");
ok(/addEventListener\(\s*["']fetch["']/.test(swText),
"sw.js hat einen fetch-Zuhoerer -- Chromes Bedingung fuers Anbieten");
/* UND ER LEGT NICHTS AB. Das Versprechen im Kopf der Datei ist
keine Absichtserklaerung, sondern wird hier nachgesehen: Wer
`caches.open` einbaut, hebt Antworten auf -- hinter einer
Anmeldung waeren das persoenliche Daten auf fremden Geraeten. */
ok(!/caches\.(open|match)|cache\.put/.test(swText),
"und er legt nichts ab -- keine persoenlichen Daten auf dem Geraet");
let urteil = null;
try {
urteil = (await cdp.send("Page.getInstallabilityErrors")).installabilityErrors;
} catch (f) { urteil = "unlesbar: " + f.message; }
/* DRITTER AUSGANG: Kann die Frage gar nicht gestellt werden, ist
das kein Bestehen. Eine Pruefung, die ihre Voraussetzung nicht
hat, muss das sagen. */
ok(Array.isArray(urteil),
Array.isArray(urteil) ? "Chrome laesst sich nach der Installierbarkeit fragen"
: `KONNTE NICHT NACHSEHEN (${urteil})`);
ok(Array.isArray(urteil) && urteil.length === 0,
Array.isArray(urteil) && urteil.length
? `Chrome nennt Hindernisse: ${urteil.map((f) => f.errorId).join(", ")}`
: "und nennt kein einziges Hindernis -- die Seite ist installierbar");
let manifest = null;
try { manifest = await cdp.send("Page.getAppManifest"); } catch { /* s.o. */ }
const mFehler = (manifest?.errors || []).filter((f) => f.critical !== 0);
ok(!!manifest?.url, `Chrome findet das Manifest (${manifest?.url || "nicht"})`);
ok(mFehler.length === 0 && (manifest?.errors || []).length === 0,
(manifest?.errors || []).length
? `es meldet: ${(manifest.errors || []).map((f) => f.message).join(" | ").slice(0, 120)}`
: "und beanstandet nichts daran");
/* DER KNOPF STEHT AUF DER ANMELDEWAND. Sie hat keine Kopfleiste und
hatte deshalb frueher gar kein Angebot -- dabei landet dort
jeder zuerst. */
const aufWand = await s0.evaluate(() => {
const k = document.querySelector(".install-knopf");
if (!k) return { da: false };
const r = k.getBoundingClientRect();
return { da: true, sichtbar: !k.hidden, breit: Math.round(r.width),
hoch: Math.round(r.height), imPlatz: !!k.closest("[data-install-platz]"),
wort: k.textContent.trim() };
});
ok(aufWand.da && aufWand.imPlatz,
`der Knopf steht auf der Anmeldewand, an seinem vorgesehenen Platz`);
ok(aufWand.sichtbar === true && aufWand.hoch >= 44,
`und ist zu sehen und zu treffen (${aufWand.breit}x${aufWand.hoch} px, "${aufWand.wort}")`);
ok(/installieren/i.test(aufWand.wort || ""),
`und sagt, was er tut ("${aufWand.wort}")`);
/* GEGENPROBE: nur EIN Knopf. Seit der Aufruf nicht mehr an der
Reihenfolge der Skriptzeilen haengt, kann er aus zwei Richtungen
kommen. */
const anzahl = await s0.locator(".install-knopf").count();
ok(anzahl === 1, `und zwar genau einer (${anzahl})`);
/* UND ER TUT ETWAS, WENN MAN IHN DRUECKT.
Das ist hier keine Formalie, sondern der Fall, an dem der erste
Entwurf gescheitert waere: Der Knopf rief `window.frageNach?.()`
auf. Diese Seite laedt `nachfrage.js` NICHT -- also war die
Funktion `undefined`, und `?.()` verschluckt das lautlos. Auf
dem iPhone steht der Knopf hier von Anfang an da. Er haette
stumm dagestanden, und wer ihn drueckt, sucht den Fehler bei
sich.
Gegenprobe gleich dahinter: ein zweiter Druck macht die
Erklaerung wieder zu. Sonst sammeln sich Absaetze. */
const ohneDialog = await s0.evaluate(() => typeof window.frageNach !== "function");
ok(ohneDialog, "auf der Anmeldewand gibt es den Dialogbaustein nicht (nachfrage.js fehlt dort)");
await s0.click(".install-knopf");
await s0.waitForTimeout(400);
const hinweis = await s0.evaluate(() => {
const h = document.querySelector(".install-hinweis");
return h ? h.textContent.replace(/\s+/g, " ").trim() : null;
});
ok(!!hinweis && /Menü|Teilen|Home-Bildschirm/i.test(hinweis),
`er erklaert trotzdem den Weg ("${(hinweis || "nichts").slice(0, 60)}…")`);
await s0.click(".install-knopf");
await s0.waitForTimeout(300);
const zu = await s0.locator(".install-hinweis").count();
ok(zu === 0, `und ein zweiter Druck macht sie wieder zu (${zu})`);
await ctx0.close();
}
/* ---- Zustand 2: der Browser bietet es an ----------------------- */
const a = await seiteAuf();
/* Chromium loest `beforeinstallprompt` in dieser Umgebung nicht von
@@ -111,8 +262,19 @@ try {
const sichtbarVorher = await a.s.evaluate(() =>
!!document.querySelector(".install-knopf:not([hidden])"));
ok(vorher === 1, `der Knopf steht im Dokument (${vorher})`);
ok(sichtbarVorher === false,
"bleibt aber versteckt, solange der Browser nichts anbietet — kein Knopf ohne Wirkung");
/* HIER STAND: "bleibt versteckt, solange der Browser nichts
anbietet". Das war bis zum 22.09.2026 richtig -- und genau der
Grund, warum Filipe ihn nie gesehen hat. `beforeinstallprompt`
kommt in Chrome nicht verlaesslich sofort und gar nicht mehr,
wenn es kurz vorher weggeklickt wurde.
Jetzt zeigt er sich, sobald der Browser das Installieren
ueberhaupt KANN (`'onbeforeinstallprompt' in window`, wahr bei
allen Chromium-Browsern) -- und faellt auf die Erklaerung
zurueck, falls das Angebot ausbleibt. Wo auch das nicht zutrifft
und kein Apple-Geraet vorliegt, bleibt er weg. */
ok(sichtbarVorher === true,
"und ist in einem Browser, der installieren kann, von Anfang an zu sehen");
await a.s.evaluate(() => {
const e = new Event("beforeinstallprompt");
@@ -201,6 +363,13 @@ try {
await browser.close();
}
/* Die Zahl gehoert in die Bedingung. Faellt sie, ist still ein
Abschnitt ausgefallen -- und genau der neue Abschnitt 0 ist der,
auf den es ankommt. */
if (geprueft < 29) {
console.log(` FEHL nur ${geprueft} Pruefungen gelaufen -- erwartet waren 29+`);
fehler++;
}
console.log(`\n${fehler ? fehler + " FEHLER" : "Alles in Ordnung"} — ${geprueft} Prüfungen\n`);
try { rmSync(ordner, { recursive: true, force: true }); } catch { /* egal */ }
process.exit(fehler ? 1 : 0);
workspace/anruf-probe.html
+7 -5
View File
@@ -16,15 +16,15 @@
verdeckt. Gefunden hat es pruef-struktur.
Richtig sind `gate.css` (die Farbwerte des Hauses) und `haus.css`. -->
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
<!-- Ohne diese drei nimmt ein iPhone einen Bildschirmausschnitt als
Symbol, Android zeichnet die Leiste weiss, und die Seite oeffnet
ausserhalb der App -- auf einer Seite, die genau erklaeren soll,
WARUM das Telefon nicht klingelt, ist das besonders unpassend. -->
<link rel="manifest" href="/workspace/crew.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<style>
/* Bewusst in der Seite und nicht in einer eigenen Datei: Diese Seite
soll auch dann noch etwas anzeigen, wenn genau das schiefgeht,
@@ -123,8 +123,10 @@
<p class="probe__ende" id="rat"></p>
</main>
␍
<script src="assets/js/anruf-probe.js?v=202609221359" defer></script>
<script src="assets/js/anruf-probe.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
</body>
</html>
workspace/app.webmanifest
+5 -4
View File
@@ -14,6 +14,7 @@
"share_target": {
"action": "/workspace/teilen.html",
"method": "GET",
"enctype": "application/x-www-form-urlencoded",
"params": {
"title": "title",
"text": "text",
@@ -22,25 +23,25 @@
},
"icons": [
{
"src": "/assets/img/app-symbole/workspace-192.png?v=202609221359",
"src": "/assets/img/app-symbole/workspace-192.png?v=202609221415",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/workspace-512.png?v=202609221359",
"src": "/assets/img/app-symbole/workspace-512.png?v=202609221415",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/workspace-192-maskable.png?v=202609221359",
"src": "/assets/img/app-symbole/workspace-192-maskable.png?v=202609221415",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/assets/img/app-symbole/workspace-512-maskable.png?v=202609221359",
"src": "/assets/img/app-symbole/workspace-512-maskable.png?v=202609221415",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
workspace/assets/css/gate.css
+81
View File
@@ -1223,6 +1223,87 @@ body.suche-offen { overflow: hidden; }
auf der Anmeldeseite gibt es nichts anderes zu tun. */
.gate .knopf { width: 100%; margin-top: 18px; padding: 13px 18px; font-size: .95rem; }
/* ---- Der Installieren-Knopf (20.09.2026, hierher am 22.09.2026) ----
Er sieht aus wie die anderen Knöpfe der Kopfleiste -- mit einem
Unterschied: ein leiser Akzentrand. Er ist ein Angebot, keine
Warnung, und er verschwindet, sobald er überflüssig ist. Deshalb
darf er auffallen, ohne zu drängen. */
.install-knopf {
appearance: none;
display: inline-flex; align-items: center; gap: 7px;
min-height: 44px; padding: 0 13px;
border-radius: var(--radius-klein);
border: 1px solid color-mix(in srgb, var(--akzent) 45%, transparent);
background: color-mix(in srgb, var(--akzent) 12%, transparent);
color: var(--text);
font: inherit; font-size: .86rem; font-weight: 600;
cursor: pointer; white-space: nowrap;
transition: background var(--tempo), border-color var(--tempo);
}
.install-knopf:hover {
background: color-mix(in srgb, var(--akzent) 22%, transparent);
border-color: color-mix(in srgb, var(--akzent) 70%, transparent);
}
.install-knopf:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
.install-knopf__zeichen {
flex: none; width: 17px; height: 17px;
fill: none; stroke: currentColor; stroke-width: 1.8;
stroke-linecap: round; stroke-linejoin: round;
}
/* AM HANDY NUR DAS ZEICHEN -- ABER NUR IN DER KOPFLEISTE.
Dort ist es eng, und ein Pfeil in eine Ablage wird als
"herunterladen/installieren" verstanden; das Wort kostet 90 px, die
woanders fehlen. Der `aria-label` sagt es weiterhin vollständig.
Auf der Anmeldewand gilt das NICHT: Dort ist Platz, dort kennt
niemand das Zeichen aus dem Zusammenhang, und dort ist der Knopf
ein Angebot an Leute, die die Seite zum ersten Mal sehen. Ein
nacktes Symbol wäre da ein Rätsel.
(Vorher stand die Regel ohne Einschränkung. Das wäre genau der
Fehler gewesen, den sie auf der Leiste vermeidet: eine Entscheidung
aus einem Zusammenhang in einen anderen mitgenommen.) */
@media (max-width: 760px) {
.kopfleiste__rechts .install-knopf__text { display: none; }
.kopfleiste__rechts .install-knopf { padding: 0; width: 44px; justify-content: center; }
}
@media (forced-colors: active) {
.install-knopf { border: 1px solid CanvasText; }
}
/* ---- Auf der Anmeldewand -------------------------------------------
Eine eigene Zeile, mittig, mit Luft nach oben. Der Knopf ist hier
das zweite Anliegen -- wer herkommt, will sich anmelden. */
.gate-install {
display: flex; flex-direction: column; align-items: center;
gap: 10px;
margin: 22px 0 6px;
}
.gate-install:empty { display: none; }
/* Die Erklärung für den Fall ohne Dialogbaustein (iPhone, und überall
dort, wo `nachfrage.js` nicht geladen ist). Sie klappt unter dem
Knopf auf und beim zweiten Antippen wieder zu. */
.install-hinweis {
display: grid; gap: 6px;
max-width: 34rem;
margin: 0;
padding: 13px 15px;
border: 1px solid var(--rand-hell);
border-radius: var(--radius-klein, 12px);
background: color-mix(in srgb, var(--tinte) 88%, #ffffff 12%);
font-size: .86rem; line-height: 1.55;
text-align: left;
}
.install-hinweis__titel { font-size: .92rem; color: var(--text); }
.install-hinweis__weg { color: var(--text); }
.install-hinweis__dazu { color: var(--text-leise); }
@media (forced-colors: active) {
.install-hinweis { border: 1px solid CanvasText; }
}
/* ---------- Filterleiste --------------------------------------------
Eine Reihe von `.schritt`-Knoepfen, von denen genau einer gedrueckt
ist. Stand bis 22.09.2026 doppelt in dateien.css und bereich.css --
workspace/assets/css/module.css
+10 -38
View File
@@ -1023,45 +1023,17 @@
.tperson[data-rolle="hand"]::before { display: none; }
}
/* ---- Der Installieren-Knopf (20.09.2026) ---------------------------
/* Der Installieren-Knopf steht seit dem 22.09.2026 in gate.css.
Er sieht aus wie die anderen Knöpfe der Kopfleiste -- mit einem
Unterschied: ein leiser Akzentrand. Er ist ein Angebot, keine
Warnung, und er verschwindet, sobald er überflüssig ist. Deshalb
darf er auffallen, ohne zu drängen. */
.install-knopf {
appearance: none;
display: inline-flex; align-items: center; gap: 7px;
min-height: 44px; padding: 0 13px;
border-radius: var(--radius-klein);
border: 1px solid color-mix(in srgb, var(--akzent) 45%, transparent);
background: color-mix(in srgb, var(--akzent) 12%, transparent);
color: var(--text);
font: inherit; font-size: .86rem; font-weight: 600;
cursor: pointer; white-space: nowrap;
transition: background var(--tempo), border-color var(--tempo);
}
.install-knopf:hover {
background: color-mix(in srgb, var(--akzent) 22%, transparent);
border-color: color-mix(in srgb, var(--akzent) 70%, transparent);
}
.install-knopf:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }
.install-knopf__zeichen {
flex: none; width: 17px; height: 17px;
fill: none; stroke: currentColor; stroke-width: 1.8;
stroke-linecap: round; stroke-linejoin: round;
}
/* AM HANDY NUR DAS ZEICHEN. Die Leiste ist dort eng, und ein Knopf mit
Pfeil-nach-unten-in-eine-Ablage wird als „herunterladen/installieren"
verstanden -- das Wort kostet 90 px, die woanders fehlen. Der
`aria-label` sagt es weiterhin vollständig. */
@media (max-width: 760px) {
.install-knopf__text { display: none; }
.install-knopf { padding: 0; width: 44px; justify-content: center; }
}
@media (forced-colors: active) {
.install-knopf { border: 1px solid CanvasText; }
}
Grund: Die Anmeldewand laedt module.css nicht -- sie hat nur
gate.css und ihr Haus. Und sie ist seit heute die wichtigste Stelle
fuer diesen Knopf, weil jeder dort zuerst landet. Haette er hier
gestanden, waere er dort nackt erschienen.
Es ist derselbe Fall wie bei .knopf-still, beim Schalter, bei der
Filterleiste und bei .feld-hinweis: ein gemeinsamer Baustein in
einer Seitendatei faellt immer genau dort auf, wo die Datei nicht
geladen wird. */
/* =====================================================================
DIE LEISTE FUER DIE TEXTGESTALTUNG (21.09.2026)
workspace/assets/js/installieren.js
+273
View File
@@ -0,0 +1,273 @@
/* =====================================================================
installieren.js — die Seite als App aufs Gerät holen
=====================================================================
ZWEI DINGE IN EINER DATEI, und sie gehoeren zusammen:
1. Der Service Worker wird angemeldet -- IMMER, auf jeder Seite.
2. Der Knopf, der das Installieren anbietet.
WARUM BEIDES HIER STEHT (22.09.2026, nach Filipes drittem Anlauf:
"ich will einen installieren button ... das hab ich auch schon paar
mal gefragt. mach das es ist seeeeeeeehr wichtig."):
Der Knopf gab es seit dem 20.09. Er war nur NIE ZU SEHEN. Chrome
zeigt sein Installationsangebot (`beforeinstallprompt`) erst, wenn
ein Service Worker laeuft -- und der wurde ausschliesslich in
`glocke.js` angemeldet, also erst, wenn jemand Benachrichtigungen
ERLAUBT. Auf Filipes Rechner stehen sie auf "Vom Browser blockiert".
Damit lief nie einer, damit kam das Ereignis nie, damit blieb der
Knopf `hidden`. Fuer immer.
Die Anmeldung gehoert also nicht an die Glocke, sondern an das
Installieren -- und beides an jede Seite. Deshalb eine Datei, die
ueberall geladen wird, statt einer Abhaengigkeit, die kaum jemand
erfuellt.
UND DESHALB LAEDT AUCH DIE ANMELDEWAND SIE. Sie hat keine
Kopfleiste und deshalb frueher kein Angebot bekommen -- dabei ist
sie die Seite, auf der jeder zuerst landet.
===================================================================== */
(() => {
'use strict';
/* ---------------------------------------------------------------------
DER SERVICE WORKER -- ohne Bedingung, aber auch ohne Laerm
---------------------------------------------------------------------
Er scheitert an genug Stellen, an denen niemand etwas falsch
gemacht hat: Privates Fenster, abgeschaltete Worker,
Unternehmens-Richtlinie, veralteter Browser. Nichts davon ist ein
Fehler, den ein Besucher sehen soll -- die Seite funktioniert auch
ohne, sie laesst sich dann nur nicht installieren.
`load` abwarten: Die Anmeldung zieht Bandbreite, und zwar genau in
dem Moment, in dem die Seite noch laedt. */
if ('serviceWorker' in navigator) {
const anmelden = () => {
navigator.serviceWorker.register('/workspace/sw.js', { scope: '/workspace/' })
.catch(() => { /* geht hier nicht -- die Seite laeuft trotzdem */ });
};
if (document.readyState === 'complete') anmelden();
else window.addEventListener('load', anmelden, { once: true });
}
/* =====================================================================
DIE SEITE ALS APP INSTALLIEREN (20.09.2026)
Filipe: „kannst du da dazwischen in der starseite oben, ein button
reinsetzen damit die leute die seite installieren koennen auf dem
handy oder pc. das soll auch verschwinden wenn die leute es
installiert haben."
WARUM ES DEN KNOPF BRAUCHT: Das Manifest ist seit Langem
vollstaendig -- die App LIESS sich installieren. Nur bot das
ausschliesslich der Browser selbst an, versteckt in seinem
Dreipunktemenue. Wer es nicht sucht, findet es nie. Und ohne
installierte App gibt es auf dem Handy keine verlaesslichen
Benachrichtigungen; genau daran hing im September das Telefonieren.
DREI ZUSTAENDE, UND JEDER BRAUCHT EINE ANDERE ANTWORT:
1. SCHON INSTALLIERT -> gar kein Knopf. Ein Angebot fuer etwas,
das man hat, ist Rauschen. Erkannt an `display-mode:
standalone` (und an Safaris eigenem `navigator.standalone`).
2. DER BROWSER BIETET ES AN (Chrome, Edge, Android) -> der Knopf
fragt ihn. `beforeinstallprompt` kommt EINMAL und muss
aufgehoben werden; wer ihn nicht festhaelt, kann spaeter
nicht mehr fragen.
3. SAFARI AUF DEM iPHONE -> dort gibt es `beforeinstallprompt`
NICHT, und es wird ihn nicht geben. Apple laesst nur den Weg
ueber „Teilen -> Zum Home-Bildschirm". Ein Knopf, der dort
nichts tut, waere schlimmer als keiner -- also sagt er in
diesem Fall, was zu tun ist, statt es zu versuchen.
WARUM AUF JEDER SEITE UND NICHT NUR AUF DER STARTSEITE: Wer den
Knopf einmal uebersieht, sieht ihn beim naechsten Mal wieder -- und
er verschwindet ohnehin, sobald er ueberfluessig ist.
(Hier stand "auf allen 32 Seiten". Es sind inzwischen mehr, und
seit dem 22.09. auch die Anmeldewand. Eine gezaehlte Zahl in einem
Kommentar wird still falsch, sobald jemand eine Seite anlegt --
also steht jetzt keine mehr da.)
===================================================================== */
function knopfBauen(wohin) {
/* ZWEIMAL AUFGERUFEN HEISST NICHT ZWEI KNOEPFE. Seit der Aufruf
nicht mehr an der Reihenfolge der Skriptzeilen haengt, kann er
aus zwei Richtungen kommen -- aus kopf.js und aus dem Platz
unten in dieser Datei. Zwei Angebote fuer dieselbe Sache sind
eines zu viel. */
if (!wohin || wohin.querySelector('.install-knopf')) return;
const el = (tag, klasse, text) => {
const k = document.createElement(tag);
if (klasse) k.className = klasse;
if (text !== undefined) k.textContent = text;
return k;
};
/* ---- Zustand 1: schon installiert -> nichts tun --------------- */
const schonDrin = () =>
(window.matchMedia && window.matchMedia('(display-mode: standalone)').matches)
|| window.navigator.standalone === true;
if (schonDrin()) return;
/* Apple: kein `beforeinstallprompt`, aber ein Weg. */
const istApple = /iphone|ipad|ipod/i.test(navigator.userAgent)
|| (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
let angebot = null; // der aufgehobene Browser-Vorschlag
const knopf = el('button', 'install-knopf');
knopf.type = 'button';
knopf.hidden = true;
knopf.title = 'Diese Seite als App installieren';
/* DAS WORT VERSCHWINDET AM HANDY (siehe CSS) -- der Satz fuer
Vorleseprogramme nicht. Ein Knopf, der dort nur aus einem
Pfeil besteht, heisst sonst "Schaltflaeche". */
knopf.setAttribute('aria-label', 'Diese Seite als App installieren');
const zeichen = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
zeichen.setAttribute('viewBox', '0 0 24 24');
zeichen.setAttribute('class', 'install-knopf__zeichen');
zeichen.setAttribute('aria-hidden', 'true');
zeichen.innerHTML = '<path d="M12 3.5v11M8 11l4 4 4-4"/><path d="M5 18.5h14"/>';
knopf.append(zeichen, el('span', 'install-knopf__text', 'Installieren'));
knopf.addEventListener('click', async () => {
if (angebot) {
/* Zustand 2: den Browser fragen. Die Antwort interessiert uns
nur insofern, als ein angenommener Vorschlag den Knopf
ueberfluessig macht -- ein abgelehnter nicht: Vielleicht
ueberlegt man es sich morgen anders. */
knopf.disabled = true;
try {
angebot.prompt();
const { outcome } = await angebot.userChoice;
if (outcome === 'accepted') knopf.remove();
} catch { /* dann eben nicht */ }
angebot = null;
knopf.disabled = false;
return;
}
/* Zustand 3: erklaeren statt versuchen. */
erklaeren();
});
/* WARUM DAS NICHT EINFACH `frageNach` AUFRUFT (22.09.2026).
Der erste Entwurf tat genau das -- und haette auf der
Anmeldewand gar nichts getan: Sie laedt `nachfrage.js` nicht,
also ist `window.frageNach` dort `undefined`, und `?.()`
verschluckt das lautlos. Auf dem iPhone steht der Knopf aber von
Anfang an da. Ein Knopf, der beim Antippen nichts tut, ist
schlimmer als keiner.
Die Datei nachzuladen waere die falsche Antwort: 22 KB und die
halbe Stilvorlage `module.css` fuer eine Seite, die eine einzige
Aufgabe hat. Und ein Kasten, der sich ueber das Codefeld legt,
waere dort ohnehin im Weg.
Also: Wo es den Baustein gibt, wird er benutzt -- die Seite soll
eine Sprache sprechen. Wo nicht, steht die Erklaerung als
schlichter Absatz unter dem Knopf. Beides sagt dasselbe. */
let hinweis = null;
function erklaeren() {
const titel = 'Als App auf dem Home-Bildschirm';
const weg = istApple
? 'Tippe unten in Safari auf das Teilen-Zeichen (Viereck mit Pfeil nach oben), '
+ 'dann auf „Zum Home-Bildschirm".'
: 'Öffne das Menü deines Browsers (die drei Punkte) und wähle dort '
+ '„App installieren" oder „Zum Startbildschirm hinzufügen".';
const dazu = 'Danach liegt die Seite wie eine App auf deinem Gerät – und '
+ 'Anrufe und Nachrichten kommen zuverlässiger an.';
if (typeof window.frageNach === 'function') {
window.frageNach({ titel, was: weg, bleibt: dazu, ja: 'Alles klar', nein: null });
return;
}
/* Ohne Dialogbaustein: ein Absatz, der beim zweiten Antippen
wieder verschwindet. Kein zweiter, wenn schon einer dasteht. */
if (hinweis) { hinweis.remove(); hinweis = null; knopf.setAttribute('aria-expanded', 'false'); return; }
hinweis = el('p', 'install-hinweis');
hinweis.id = 'install-hinweis';
hinweis.append(el('strong', 'install-hinweis__titel', titel));
hinweis.append(el('span', 'install-hinweis__weg', weg));
hinweis.append(el('span', 'install-hinweis__dazu', dazu));
knopf.setAttribute('aria-expanded', 'true');
knopf.setAttribute('aria-controls', 'install-hinweis');
knopf.insertAdjacentElement('afterend', hinweis);
}
wohin.prepend(knopf);
/* Der Browser meldet sich, wenn er es anbieten kann. */
window.addEventListener('beforeinstallprompt', (e) => {
/* Ohne `preventDefault` zeigt der Browser seine eigene Leiste --
zwei Angebote fuer dieselbe Sache sind eines zu viel. */
e.preventDefault();
angebot = e;
knopf.hidden = false;
});
/* WANN DER KNOPF ZU SEHEN IST -- und warum nicht erst nach dem
Angebot des Browsers (geaendert 22.09.2026).
Bis heute wurde er ausschliesslich durch `beforeinstallprompt`
sichtbar. Das hat zwei Loecher:
* Apple schickt das Ereignis nie. (Das war bekannt und ist
unten schon abgefangen.)
* Chrome schickt es zwar, aber nicht verlaesslich sofort -- und
gar nicht, wenn es kurz vorher weggeklickt wurde. Dann steht
der Knopf da, wo er gebraucht wird, und ist unsichtbar.
Filipe hat dreimal danach gefragt. Ein Angebot, das man nur unter
guenstigen Umstaenden sieht, ist fuer ihn keins.
GEPRUEFT WIRD DIE FAEHIGKEIT, NICHT DER NAME DES BROWSERS:
`'onbeforeinstallprompt' in window` ist bei allen Chromium-
Browsern wahr -- Chrome, Edge, Brave, Samsung Internet, Android.
Eine Liste von Browsernamen waere die, die beim naechsten
veraltet.
Wo BEIDES nicht zutrifft -- Firefox am Rechner etwa, der
Webanwendungen schlicht nicht installiert --, bleibt der Knopf
weg. Ein Knopf, der eine Anleitung fuer etwas zeigt, das dieser
Browser nicht kann, ist schlimmer als keiner. */
const kannVielleicht = 'onbeforeinstallprompt' in window;
if (istApple || kannVielleicht) knopf.hidden = false;
/* Und wenn es geklappt hat, ist er fertig. */
window.addEventListener('appinstalled', () => knopf.remove());
/* Manche Browser melden `appinstalled` nicht -- dann faellt der
Knopf beim naechsten Oeffnen ueber `schonDrin()` weg. Und wer die
App waehrend der Sitzung installiert und zurueckwechselt, merkt
es hier: */
try {
window.matchMedia('(display-mode: standalone)')
.addEventListener('change', (m) => { if (m.matches) knopf.remove(); });
} catch { /* aeltere Browser koennen das nicht -- kein Grund zu scheitern */ }
}
/* ---------------------------------------------------------------------
WOHIN DER KNOPF GEHOERT
---------------------------------------------------------------------
Zwei Faelle, und sie schliessen sich aus:
* Es gibt eine Kopfleiste -> kopf.js sagt, wohin (es kennt die
Reihenfolge der Knoepfe darin).
* Es gibt keine -> dann steht auf der Seite ein Platz mit
`data-install-platz`, und wir setzen uns selbst hinein.
Der zweite Fall wird NICHT geraten: Ohne diesen Platz passiert
nichts. Ein Knopf, der sich irgendwohin haengt, weil er sonst
nirgends hinpasst, landet frueher oder spaeter mitten im Text.
--------------------------------------------------------------------- */
window.installKnopfBauen = knopfBauen;
const platz = document.querySelector('[data-install-platz]');
if (platz) knopfBauen(platz);
})();
workspace/assets/js/kopf.js
+21 -130
View File
@@ -1037,139 +1037,30 @@
const kopfRechts = document.querySelector('.kopfleiste__rechts');
if (kopfRechts) aufbauSuche(kopfRechts);
if (kopfRechts) aufbauChat(kopfRechts);
if (kopfRechts) aufbauInstallieren(kopfRechts);
/* DER AUFRUF DARF NICHT VON DER REIHENFOLGE DER SKRIPTZEILEN
ABHAENGEN. Auf chat.html und leistung.html steht `kopf.js` OHNE
`defer` -- ein solches Skript laeuft sofort beim Einlesen, also
immer vor jedem aufgeschobenen. `installieren.js` gaebe es dort
zu diesem Zeitpunkt noch nicht, und `?.()` verschluckt das
lautlos: kein Knopf, keine Meldung, auf genau zwei von
siebenunddreissig Seiten.
/* =====================================================================
DIE SEITE ALS APP INSTALLIEREN (20.09.2026)
Filipe: „kannst du da dazwischen in der starseite oben, ein button
reinsetzen damit die leute die seite installieren koennen auf dem
handy oder pc. das soll auch verschwinden wenn die leute es
installiert haben."
WARUM ES DEN KNOPF BRAUCHT: Das Manifest ist seit Langem
vollstaendig -- die App LIESS sich installieren. Nur bot das
ausschliesslich der Browser selbst an, versteckt in seinem
Dreipunktemenue. Wer es nicht sucht, findet es nie. Und ohne
installierte App gibt es auf dem Handy keine verlaesslichen
Benachrichtigungen; genau daran hing im September das Telefonieren.
DREI ZUSTAENDE, UND JEDER BRAUCHT EINE ANDERE ANTWORT:
1. SCHON INSTALLIERT -> gar kein Knopf. Ein Angebot fuer etwas,
das man hat, ist Rauschen. Erkannt an `display-mode:
standalone` (und an Safaris eigenem `navigator.standalone`).
2. DER BROWSER BIETET ES AN (Chrome, Edge, Android) -> der Knopf
fragt ihn. `beforeinstallprompt` kommt EINMAL und muss
aufgehoben werden; wer ihn nicht festhaelt, kann spaeter
nicht mehr fragen.
3. SAFARI AUF DEM iPHONE -> dort gibt es `beforeinstallprompt`
NICHT, und es wird ihn nicht geben. Apple laesst nur den Weg
ueber „Teilen -> Zum Home-Bildschirm". Ein Knopf, der dort
nichts tut, waere schlimmer als keiner -- also sagt er in
diesem Fall, was zu tun ist, statt es zu versuchen.
WARUM IN DER KOPFLEISTE UND NICHT NUR AUF DER STARTSEITE: Die
Leiste steht auf allen 32 Seiten. Wer den Knopf einmal uebersieht,
sieht ihn beim naechsten Mal wieder -- und er verschwindet ohnehin,
sobald er ueberfluessig ist.
===================================================================== */
function aufbauInstallieren(wohin) {
const el = (tag, klasse, text) => {
const k = document.createElement(tag);
if (klasse) k.className = klasse;
if (text !== undefined) k.textContent = text;
return k;
};
/* ---- Zustand 1: schon installiert -> nichts tun --------------- */
const schonDrin = () =>
(window.matchMedia && window.matchMedia('(display-mode: standalone)').matches)
|| window.navigator.standalone === true;
if (schonDrin()) return;
/* Apple: kein `beforeinstallprompt`, aber ein Weg. */
const istApple = /iphone|ipad|ipod/i.test(navigator.userAgent)
|| (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
let angebot = null; // der aufgehobene Browser-Vorschlag
const knopf = el('button', 'install-knopf');
knopf.type = 'button';
knopf.hidden = true;
knopf.title = 'Diese Seite als App installieren';
/* DAS WORT VERSCHWINDET AM HANDY (siehe CSS) -- der Satz fuer
Vorleseprogramme nicht. Ein Knopf, der dort nur aus einem
Pfeil besteht, heisst sonst "Schaltflaeche". */
knopf.setAttribute('aria-label', 'Diese Seite als App installieren');
const zeichen = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
zeichen.setAttribute('viewBox', '0 0 24 24');
zeichen.setAttribute('class', 'install-knopf__zeichen');
zeichen.setAttribute('aria-hidden', 'true');
zeichen.innerHTML = '<path d="M12 3.5v11M8 11l4 4 4-4"/><path d="M5 18.5h14"/>';
knopf.append(zeichen, el('span', 'install-knopf__text', 'Installieren'));
knopf.addEventListener('click', async () => {
if (angebot) {
/* Zustand 2: den Browser fragen. Die Antwort interessiert uns
nur insofern, als ein angenommener Vorschlag den Knopf
ueberfluessig macht -- ein abgelehnter nicht: Vielleicht
ueberlegt man es sich morgen anders. */
knopf.disabled = true;
try {
angebot.prompt();
const { outcome } = await angebot.userChoice;
if (outcome === 'accepted') knopf.remove();
} catch { /* dann eben nicht */ }
angebot = null;
knopf.disabled = false;
return;
}
/* Zustand 3: erklaeren statt versuchen. */
window.frageNach?.({
titel: 'Als App auf dem Home-Bildschirm',
was: istApple
? 'Tippe unten in Safari auf das Teilen-Zeichen (Viereck mit Pfeil nach oben), '
+ 'dann auf „Zum Home-Bildschirm".'
: 'Öffne das Menü deines Browsers (die drei Punkte) und wähle dort '
+ '„App installieren" oder „Zum Startbildschirm hinzufügen".',
bleibt: 'Danach liegt die Seite wie eine App auf deinem Gerät – und '
+ 'Anrufe und Nachrichten kommen zuverlässiger an.',
ja: 'Alles klar',
nein: null,
});
});
wohin.prepend(knopf);
/* Der Browser meldet sich, wenn er es anbieten kann. */
window.addEventListener('beforeinstallprompt', (e) => {
/* Ohne `preventDefault` zeigt der Browser seine eigene Leiste --
zwei Angebote fuer dieselbe Sache sind eines zu viel. */
e.preventDefault();
angebot = e;
knopf.hidden = false;
});
/* Auf Apple gibt es diese Meldung nie -- dort steht der Knopf von
Anfang an da und erklaert den Weg. */
if (istApple) knopf.hidden = false;
/* Und wenn es geklappt hat, ist er fertig. */
window.addEventListener('appinstalled', () => knopf.remove());
/* Manche Browser melden `appinstalled` nicht -- dann faellt der
Knopf beim naechsten Oeffnen ueber `schonDrin()` weg. Und wer die
App waehrend der Sitzung installiert und zurueckwechselt, merkt
es hier: */
try {
window.matchMedia('(display-mode: standalone)')
.addEventListener('change', (m) => { if (m.matches) knopf.remove(); });
} catch { /* aeltere Browser koennen das nicht -- kein Grund zu scheitern */ }
Die Zeile in den HTML-Dateien zu verschieben haette es heute
behoben und beim naechsten neuen Skript wieder gebrochen. Also
lieber gar keine Reihenfolge voraussetzen. */
if (kopfRechts) {
if (window.installKnopfBauen) window.installKnopfBauen(kopfRechts);
else window.addEventListener('load',
() => window.installKnopfBauen?.(kopfRechts), { once: true });
}
/* Der Installieren-Knopf steht seit dem 22.09.2026 in einer eigenen
Datei: assets/js/installieren.js. Grund war nicht die Groesse,
sondern die Anmeldewand: Sie laedt kopf.js nicht (sie hat keine
Kopfleiste) -- und sie ist die Seite, auf der jeder zuerst landet.
Ein Angebot zum Installieren, das genau dort fehlt, erreicht die
Leute nicht, um die es Filipe geht. */
/* ---------- Der Chat-Knopf mit Zähler -----------------------------------
Wunsch Filipe, 06.09.2026: *"die andere person bekommt eine
workspace/aufgaben.html
+18 -17
View File
@@ -12,19 +12,19 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -367,16 +367,17 @@
<!-- TEXTFORM ZUERST (21.09.2026): Die Seite fragt beim Zeichnen nach
`window.Textform`. Kaeme sie spaeter, waere der erste Eintrag ohne
Gestaltung. Kein `defer`, damit sie wirklich vorher dasteht. -->
<script src="assets/js/textform.js?v=202609221359"></script>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/textform.js?v=202609221415"></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/zuteilung.js?v=202609221359" defer></script>
<script src="assets/js/aufgaben.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/zuteilung.js?v=202609221415" defer></script>
<script src="assets/js/aufgaben.js?v=202609221415" defer></script>
</body>
</html>
workspace/automation.html
+182 -180
View File
@@ -1,180 +1,182 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Automationen · 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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Automationen</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">Was von allein passiert</p>
<h1 class="titel">Automationen</h1>
<p class="unterzeile">
Alles hier läuft ohne Zutun. Diese Seite zeigt, was gerade greift –
und wo du es abschalten kannst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Die KI ist die einzige Automation mit Schalter: Sie kostet
Rechenzeit, die der Website gehört. -->
<section class="ki-kasten" id="ki-kasten">
<div class="ki-kasten__kopf">
<div>
<p class="marke">Lokale KI</p>
<h2 class="ki-kasten__titel">Vorschläge in Calls, Start-Check und Report</h2>
<p class="ki-kasten__text" id="ki-text">Zustand wird geprüft …</p>
</div>
<label class="schalter" id="ki-schalter-block" hidden>
<input type="checkbox" id="ki-schalter" />
<span class="schalter__gleis"><span class="schalter__punkt"></span></span>
<span class="schalter__text"><strong id="ki-schalter-text">Angeschaltet</strong></span>
</label>
</div>
<ul class="ki-kasten__daten" id="ki-daten"></ul>
</section>
<!-- Was gerade tatsächlich anliegt: dieselbe Quelle wie auf dem
Dashboard, hier aber vollständig statt gekürzt. -->
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Was gerade anliegt</h2>
<span class="block__zahl" id="hinweis-zahl">–</span>
</div>
<p class="block__frage">
Dieselben Hinweise wie auf der Übersicht, hier vollständig. Sie führen keine
eigene Liste – jeder verschwindet, sobald die Sache erledigt ist.
</p>
<div id="hinweise"><p class="leise">Wird geprüft …</p></div>
</section>
<!-- Sicherung und Zustand. Steht bewusst weit oben: Es ist die einzige
Automation, deren Ausfall alles auf einmal kosten würde. -->
<section class="zustand" id="zustand-kasten">
<div class="zustand__kopf">
<div>
<p class="marke">Sicherung &amp; Zustand</p>
<h2 class="zustand__titel" id="zustand-titel">Wird geprüft …</h2>
<p class="zustand__text" id="zustand-text"></p>
</div>
<button type="button" class="knopf knopf--klein" id="jetzt-sichern">Jetzt sichern</button>
</div>
<ul class="zustand__daten" id="zustand-daten"></ul>
<div class="klapp-kopf zustand__listenkopf">
<p class="feldschild">Vorhandene Sicherungen</p>
<button type="button" class="knopf-still" id="sicherungen-schalter"
aria-expanded="false" aria-controls="sicherungen" hidden>
<span id="sicherungen-schalter-text">Alle zeigen</span>
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
<path d="m6 9.5 6 6 6-6" />
</svg>
</button>
</div>
<div id="sicherungen" data-klapp="zu"></div>
</section>
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Läuft dauerhaft im Hintergrund</h2>
</div>
<div class="regeln" id="regeln"></div>
</section>
<!-- ==== DAS LÖSCHKONZEPT (15.09.2026) =========================
Stufe 8 aus dem Plan. Es steht auf DIESER Seite, weil hier
alles steht, was ohne Zutun läuft – und weil es genau das ist:
eine Automatik, die täglich Daten entfernt.
Sichtbar zu sein ist die halbe Sache. Ein Löschkonzept, von dem
niemand weiß, ob es greift, ist ein Dokument; eines mit Zahlen
daneben ist eine Zusicherung. Deshalb steht bei jeder Zeile,
wie viele Datensätze sie gerade betrifft. -->
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Was gelöscht wird – und was bleibt</h2>
<button type="button" class="knopf-still" id="aufb-jetzt">Jetzt aufräumen</button>
</div>
<p class="block__frage">
Personenbezogene Daten werden nicht aufgehoben, weil Platz da ist, sondern
solange es einen Grund gibt. Läuft täglich von selbst.
</p>
<div id="aufbewahrung"><p class="leise">Wird geladen …</p></div>
</section>
<section class="block">
<!-- Wie im Personen-Bereich: zugeklappt stehen nur die vier
neuesten Zeilen da, alles Weitere auf Knopfdruck. -->
<div class="block__kopf klapp-kopf">
<h2 class="block__titel">Zuletzt automatisch passiert</h2>
<button type="button" class="knopf-still" id="verlauf-schalter"
aria-expanded="false" aria-controls="verlauf" hidden>
<span id="verlauf-schalter-text">Alle zeigen</span>
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
<path d="m6 9.5 6 6 6-6" />
</svg>
</button>
</div>
<p class="block__frage">Aus dem Protokoll – damit nachvollziehbar bleibt, was ohne Zutun geschah.</p>
<div id="verlauf"><p class="leise">Wird geladen …</p></div>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/automation.js?v=202609221359" defer></script>
</body>
</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>Automationen · 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?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/automation.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Automationen</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">Was von allein passiert</p>
<h1 class="titel">Automationen</h1>
<p class="unterzeile">
Alles hier läuft ohne Zutun. Diese Seite zeigt, was gerade greift –
und wo du es abschalten kannst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Die KI ist die einzige Automation mit Schalter: Sie kostet
Rechenzeit, die der Website gehört. -->
<section class="ki-kasten" id="ki-kasten">
<div class="ki-kasten__kopf">
<div>
<p class="marke">Lokale KI</p>
<h2 class="ki-kasten__titel">Vorschläge in Calls, Start-Check und Report</h2>
<p class="ki-kasten__text" id="ki-text">Zustand wird geprüft …</p>
</div>
<label class="schalter" id="ki-schalter-block" hidden>
<input type="checkbox" id="ki-schalter" />
<span class="schalter__gleis"><span class="schalter__punkt"></span></span>
<span class="schalter__text"><strong id="ki-schalter-text">Angeschaltet</strong></span>
</label>
</div>
<ul class="ki-kasten__daten" id="ki-daten"></ul>
</section>
<!-- Was gerade tatsächlich anliegt: dieselbe Quelle wie auf dem
Dashboard, hier aber vollständig statt gekürzt. -->
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Was gerade anliegt</h2>
<span class="block__zahl" id="hinweis-zahl">–</span>
</div>
<p class="block__frage">
Dieselben Hinweise wie auf der Übersicht, hier vollständig. Sie führen keine
eigene Liste – jeder verschwindet, sobald die Sache erledigt ist.
</p>
<div id="hinweise"><p class="leise">Wird geprüft …</p></div>
</section>
<!-- Sicherung und Zustand. Steht bewusst weit oben: Es ist die einzige
Automation, deren Ausfall alles auf einmal kosten würde. -->
<section class="zustand" id="zustand-kasten">
<div class="zustand__kopf">
<div>
<p class="marke">Sicherung &amp; Zustand</p>
<h2 class="zustand__titel" id="zustand-titel">Wird geprüft …</h2>
<p class="zustand__text" id="zustand-text"></p>
</div>
<button type="button" class="knopf knopf--klein" id="jetzt-sichern">Jetzt sichern</button>
</div>
<ul class="zustand__daten" id="zustand-daten"></ul>
<div class="klapp-kopf zustand__listenkopf">
<p class="feldschild">Vorhandene Sicherungen</p>
<button type="button" class="knopf-still" id="sicherungen-schalter"
aria-expanded="false" aria-controls="sicherungen" hidden>
<span id="sicherungen-schalter-text">Alle zeigen</span>
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
<path d="m6 9.5 6 6 6-6" />
</svg>
</button>
</div>
<div id="sicherungen" data-klapp="zu"></div>
</section>
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Läuft dauerhaft im Hintergrund</h2>
</div>
<div class="regeln" id="regeln"></div>
</section>
<!-- ==== DAS LÖSCHKONZEPT (15.09.2026) =========================
Stufe 8 aus dem Plan. Es steht auf DIESER Seite, weil hier
alles steht, was ohne Zutun läuft – und weil es genau das ist:
eine Automatik, die täglich Daten entfernt.
Sichtbar zu sein ist die halbe Sache. Ein Löschkonzept, von dem
niemand weiß, ob es greift, ist ein Dokument; eines mit Zahlen
daneben ist eine Zusicherung. Deshalb steht bei jeder Zeile,
wie viele Datensätze sie gerade betrifft. -->
<section class="block">
<div class="block__kopf">
<h2 class="block__titel">Was gelöscht wird – und was bleibt</h2>
<button type="button" class="knopf-still" id="aufb-jetzt">Jetzt aufräumen</button>
</div>
<p class="block__frage">
Personenbezogene Daten werden nicht aufgehoben, weil Platz da ist, sondern
solange es einen Grund gibt. Läuft täglich von selbst.
</p>
<div id="aufbewahrung"><p class="leise">Wird geladen …</p></div>
</section>
<section class="block">
<!-- Wie im Personen-Bereich: zugeklappt stehen nur die vier
neuesten Zeilen da, alles Weitere auf Knopfdruck. -->
<div class="block__kopf klapp-kopf">
<h2 class="block__titel">Zuletzt automatisch passiert</h2>
<button type="button" class="knopf-still" id="verlauf-schalter"
aria-expanded="false" aria-controls="verlauf" hidden>
<span id="verlauf-schalter-text">Alle zeigen</span>
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
<path d="m6 9.5 6 6 6-6" />
</svg>
</button>
</div>
<p class="block__frage">Aus dem Protokoll – damit nachvollziehbar bleibt, was ohne Zutun geschah.</p>
<div id="verlauf"><p class="leise">Wird geladen …</p></div>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/automation.js?v=202609221415" defer></script>
</body>
</html>
workspace/befinden.html
+15 -14
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -180,13 +180,14 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/befinden.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/befinden.js?v=202609221415" defer></script>
</body>
</html>
workspace/bereich.html
+21 -20
View File
@@ -12,24 +12,24 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221415" />
<!-- Wegen des Blocks „Willst du dazugehoeren?" auf dem Brett
„Mitmachen". Eine eigene Kopie der Regel hier waere die zweite
Stelle, an der dieselbe Sache anders aussieht. -->
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -304,17 +304,18 @@
<!-- TEXTFORM ZUERST (21.09.2026): Die Seite fragt beim Zeichnen nach
`window.Textform`. Kaeme sie spaeter, waere der erste Eintrag ohne
Gestaltung. Kein `defer`, damit sie wirklich vorher dasteht. -->
<script src="assets/js/textform.js?v=202609221359"></script>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/textform.js?v=202609221415"></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/checkliste.js?v=202609221359" defer></script>
<script src="assets/js/ampel.js?v=202609221359" defer></script>
<script src="assets/js/schulung.js?v=202609221359" defer></script>
<script src="assets/js/bereich.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/checkliste.js?v=202609221415" defer></script>
<script src="assets/js/ampel.js?v=202609221415" defer></script>
<script src="assets/js/schulung.js?v=202609221415" defer></script>
<script src="assets/js/bereich.js?v=202609221415" defer></script>
</body>
</html>
workspace/bewerben.html
+121 -119
View File
@@ -1,119 +1,121 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Anfrage · Der Treff</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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">Der&nbsp;Treff</a> · <span id="marke-was">Anfrage</span></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">
<!-- ==================================================================
DIE ANFRAGE AUS DER COMMUNITY (17.09.2026)
Filipe: „ich will dass die leute sich da anonym bei mir melden
können und eine anfrage machen können. ich will dass es
aber profissionel gemacht ist bitte wie ein fragebogen."
VERTRAULICH, NICHT NAMENLOS - seine Entscheidung. Es gibt keine
Selbstanmeldung im Treff; jeder Zugang kommt von DogFather selbst.
Eine wirklich namenlose Anfrage wäre also nicht anonymer, sondern
nur schlechter: Man könnte niemandem antworten, und aus einer
Anfrage würde nie ein Gespräch.
„Anonym" heißt hier deshalb: NIEMAND AUS DER COMMUNITY SIEHT SIE.
Nicht die anderen Mitglieder, nicht die Modis - nur DogFather und
die rechte Hand. Und das steht auf dieser Seite, bevor jemand
anfängt zu tippen, statt im Kleingedruckten darunter.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Mitmachen</p>
<!-- DER NAME DER ROLLE STEHT NICHT IN DIESER DATEI.
Sie ist ohne Anmeldung aus dem offenen Netz lesbar (gemessen
am 17.09.2026: jede Datei unter /workspace/ antwortet mit
200). Der Server schickt das Wort in seiner Antwort mit --
dieselbe Regel wie bei den Treff-Regeln und im Chat.
Was hier steht, ist die ehrliche Ueberschrift, falls die
Antwort ausbleibt: eine Anfrage ist es so oder so. -->
<h1 class="titel" id="titel">Anfrage stellen</h1>
<p class="unterzeile">
Ein paar Fragen - ehrlich beantwortet ist mehr wert als
vollständig. Du kannst zwischendurch aufhören und später
weitermachen: Deine Antworten bleiben so lange in diesem
Browser. Zu uns kommen sie erst, wenn du abschickst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<p class="leise" id="ladezeile">einen Moment …</p>
<!-- Der Stand, wenn schon eine Anfrage vorliegt (oder eine Sperrfrist
läuft). Steht ganz oben: Wer hier landet und schon geschickt hat,
will als Erstes wissen, was daraus wurde - nicht das Formular
noch einmal sehen. -->
<section class="bw-stand" id="stand" hidden></section>
<form class="bw-bogen" id="bogen" hidden novalidate>
<div id="gruppen"></div>
<!-- WER DAS LIEST, steht direkt über dem Absenden-Knopf und nicht
nur oben auf der Seite. Wer hier unten ankommt, hat oben zehn
Minuten hinter sich. -->
<p class="bw-wer-liest" id="wer-liest"></p>
<div class="bw-abschluss">
<button type="submit" class="knopf" id="abschicken">Anfrage abschicken</button>
<a class="schritt" href="bereich.html?b=mitmachen">Doch nicht</a>
</div>
</form>
</main>
<!-- Der Fuß gehört zu jeder Seite - siehe pruef-css-klassen. -->
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/auskunft.js?v=202609221359" defer></script>
<script src="assets/js/bewerben.js?v=202609221359" defer></script>
</body>
</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>Anfrage · Der Treff</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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">Der&nbsp;Treff</a> · <span id="marke-was">Anfrage</span></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">
<!-- ==================================================================
DIE ANFRAGE AUS DER COMMUNITY (17.09.2026)
Filipe: „ich will dass die leute sich da anonym bei mir melden
können und eine anfrage machen können. ich will dass es
aber profissionel gemacht ist bitte wie ein fragebogen."
VERTRAULICH, NICHT NAMENLOS - seine Entscheidung. Es gibt keine
Selbstanmeldung im Treff; jeder Zugang kommt von DogFather selbst.
Eine wirklich namenlose Anfrage wäre also nicht anonymer, sondern
nur schlechter: Man könnte niemandem antworten, und aus einer
Anfrage würde nie ein Gespräch.
„Anonym" heißt hier deshalb: NIEMAND AUS DER COMMUNITY SIEHT SIE.
Nicht die anderen Mitglieder, nicht die Modis - nur DogFather und
die rechte Hand. Und das steht auf dieser Seite, bevor jemand
anfängt zu tippen, statt im Kleingedruckten darunter.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Mitmachen</p>
<!-- DER NAME DER ROLLE STEHT NICHT IN DIESER DATEI.
Sie ist ohne Anmeldung aus dem offenen Netz lesbar (gemessen
am 17.09.2026: jede Datei unter /workspace/ antwortet mit
200). Der Server schickt das Wort in seiner Antwort mit --
dieselbe Regel wie bei den Treff-Regeln und im Chat.
Was hier steht, ist die ehrliche Ueberschrift, falls die
Antwort ausbleibt: eine Anfrage ist es so oder so. -->
<h1 class="titel" id="titel">Anfrage stellen</h1>
<p class="unterzeile">
Ein paar Fragen - ehrlich beantwortet ist mehr wert als
vollständig. Du kannst zwischendurch aufhören und später
weitermachen: Deine Antworten bleiben so lange in diesem
Browser. Zu uns kommen sie erst, wenn du abschickst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<p class="leise" id="ladezeile">einen Moment …</p>
<!-- Der Stand, wenn schon eine Anfrage vorliegt (oder eine Sperrfrist
läuft). Steht ganz oben: Wer hier landet und schon geschickt hat,
will als Erstes wissen, was daraus wurde - nicht das Formular
noch einmal sehen. -->
<section class="bw-stand" id="stand" hidden></section>
<form class="bw-bogen" id="bogen" hidden novalidate>
<div id="gruppen"></div>
<!-- WER DAS LIEST, steht direkt über dem Absenden-Knopf und nicht
nur oben auf der Seite. Wer hier unten ankommt, hat oben zehn
Minuten hinter sich. -->
<p class="bw-wer-liest" id="wer-liest"></p>
<div class="bw-abschluss">
<button type="submit" class="knopf" id="abschicken">Anfrage abschicken</button>
<a class="schritt" href="bereich.html?b=mitmachen">Doch nicht</a>
</div>
</form>
</main>
<!-- Der Fuß gehört zu jeder Seite - siehe pruef-css-klassen. -->
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/auskunft.js?v=202609221415" defer></script>
<script src="assets/js/bewerben.js?v=202609221415" defer></script>
</body>
</html>
workspace/bewerbungen.html
+94 -92
View File
@@ -1,92 +1,94 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Anfragen · Nachwuchs</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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="talente.html">Talente</a> · Anfragen</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">
<!-- ==================================================================
DER EINGANG FÜR DIE ANFRAGEN AUS DER COMMUNITY (17.09.2026)
Filipe: „und dan soll ich annehmen ablehnen, in warteschlange
stellen oder sofort kommunizieren können. und wenn ich annehme dan
soll diese person automatisch zu talente kategorie weiter geleitet
werden."
HIER STEHEN SÄTZE, DIE JEMAND ÜBER SICH SELBST GESCHRIEBEN HAT,
im Vertrauen darauf, dass nur zwei Menschen sie lesen. Diese Seite
gehört DogFather und der rechten Hand -- durchgesetzt in der
Rechtetafel UND in workspace-bewerbung.js.
Deshalb steht im Protokoll auch kein Inhalt, sondern nur die
Nummer: Das Protokoll lesen mehr Leute als die Anfrage.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Entwicklung &amp; Nachwuchs</p>
<h1 class="titel">Anfragen</h1>
<p class="unterzeile">
Wer sich selbst gemeldet hat. Nimmst du an, entsteht daraus ein
Eintrag bei den Talenten – auf der Stufe „Angesprochen“, denn wer
sich meldet, hat die erste Frage schon beantwortet.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Die Zahlen. Nicht Schmuck, sondern die Arbeitsanweisung dieser
Seite: Was neu ist, steht links und wird zuerst gelesen. -->
<section class="bw-zahlen" id="zahlen" hidden></section>
<p class="leise" id="ladezeile">einen Moment …</p>
<div id="liste"></div>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/auskunft.js?v=202609221359" defer></script>
<script src="assets/js/bewerbungen.js?v=202609221359" defer></script>
</body>
</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>Anfragen · Nachwuchs</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein - siehe treff-regeln.html. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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="talente.html">Talente</a> · Anfragen</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">
<!-- ==================================================================
DER EINGANG FÜR DIE ANFRAGEN AUS DER COMMUNITY (17.09.2026)
Filipe: „und dan soll ich annehmen ablehnen, in warteschlange
stellen oder sofort kommunizieren können. und wenn ich annehme dan
soll diese person automatisch zu talente kategorie weiter geleitet
werden."
HIER STEHEN SÄTZE, DIE JEMAND ÜBER SICH SELBST GESCHRIEBEN HAT,
im Vertrauen darauf, dass nur zwei Menschen sie lesen. Diese Seite
gehört DogFather und der rechten Hand -- durchgesetzt in der
Rechtetafel UND in workspace-bewerbung.js.
Deshalb steht im Protokoll auch kein Inhalt, sondern nur die
Nummer: Das Protokoll lesen mehr Leute als die Anfrage.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Entwicklung &amp; Nachwuchs</p>
<h1 class="titel">Anfragen</h1>
<p class="unterzeile">
Wer sich selbst gemeldet hat. Nimmst du an, entsteht daraus ein
Eintrag bei den Talenten – auf der Stufe „Angesprochen“, denn wer
sich meldet, hat die erste Frage schon beantwortet.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Die Zahlen. Nicht Schmuck, sondern die Arbeitsanweisung dieser
Seite: Was neu ist, steht links und wird zuerst gelesen. -->
<section class="bw-zahlen" id="zahlen" hidden></section>
<p class="leise" id="ladezeile">einen Moment …</p>
<div id="liste"></div>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/auskunft.js?v=202609221415" defer></script>
<script src="assets/js/bewerbungen.js?v=202609221415" defer></script>
</body>
</html>
workspace/calls.html
+17 -16
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/calls.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -89,14 +89,15 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/ki.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/calls.js?v=202609221359" defer></script>
<script src="assets/js/ki.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/calls.js?v=202609221415" defer></script>
</body>
</html>
workspace/chat.html
+19 -18
View File
@@ -12,26 +12,26 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<!-- aufgaben.css bringt die Dialog- und Formularstile mit (.dialog,
.neu__zeile, .dialog__knoepfe). Sie stehen dort seit dem
Aufgabenbrett; sie hierher zu kopieren hiesse, sie an zwei Stellen
zu pflegen. Dieselbe Lösung nutzen kalender.html und content.html.
Gemeldet von pruef-css-klassen.mjs, bevor jemand einen ungestylten
Dialog zu sehen bekam. -->
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/chat.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/chat.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -415,24 +415,25 @@
</form>
</dialog>
<script src="assets/js/bereiche.js?v=202609221359"></script>
<script src="assets/js/bereiche.js?v=202609221415"></script>
<!-- TEXTFORM VOR ALLEM ANDEREN (21.09.2026): chat.js und bereich.js
fragen beim Zeichnen nach `window.Textform`. Kaeme sie spaeter,
waere die erste gezeichnete Nachricht ohne Gestaltung -- und das
faellt nur dem auf, der genau hinsieht. KEIN `defer`, damit sie
wirklich vor den anderen dasteht. -->
<script src="assets/js/textform.js?v=202609221359"></script>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359"></script>
<script src="assets/js/glocke.js?v=202609221359"></script>
<script src="assets/js/textform.js?v=202609221415"></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415"></script>
<script src="assets/js/glocke.js?v=202609221415"></script>
<!-- ANRUF VOR CHAT (18.09.2026): anruf.js stellt `window.anrufStarten`
bereit, und chat.js baut die Knoepfe nur, wenn es das gibt.
Andersherum waere die Reihenfolge eine stille Abhaengigkeit --
die Knoepfe fehlten, und niemand wuesste warum. -->
<script src="assets/js/anruf.js?v=202609221359"></script>
<script src="assets/js/chat.js?v=202609221359"></script>
<script src="assets/js/anruf.js?v=202609221415"></script>
<script src="assets/js/chat.js?v=202609221415"></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
</body>
</html>
workspace/content.html
+17 -16
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/content.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/content.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -179,14 +179,15 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/checkliste.js?v=202609221359" defer></script>
<script src="assets/js/content.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/checkliste.js?v=202609221415" defer></script>
<script src="assets/js/content.js?v=202609221415" defer></script>
</body>
</html>
workspace/crew-index.html
+20 -5
View File
@@ -36,15 +36,15 @@
<link rel="preload" as="image" href="assets/img/buehne/crew-gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<!-- Diese Wand steht NUR auf der Adresse von Team Dogi (ueberall sonst
404, siehe crewWeiche). Sie darf das Haus deshalb direkt nennen
statt ueber den Platzhalter haus.css zu gehen -- und sie MUSS es:
Eine Zugangswand, die sich erst nach dem Umbiegen faerbt, waere
die eine Seite, auf der man das Umfaerben sieht. -->
<link rel="stylesheet" href="assets/css/crew-haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/crew-haus.css?v=202609221415" />
</head>
<body class="gate gate--crew">
@@ -372,6 +372,20 @@
<p class="fuss fuss--woher">Noch keinen Code? Frag im Live nach – Team&nbsp;Dogi gibt ihn dir persönlich.<br />
Gehörst du zum Team und dein Code geht nicht? Schreib DogFather – er macht dir einen neuen.</p>
<!-- DAS ANGEBOT ZUM INSTALLIEREN GEHOERT HIERHER (22.09.2026).
Filipe: "ich will einen installieren button. damit die leute es
viel einfacher haben die seite auf dem pc oder auf dem handy zu
installieren!!!"
Diese Seite ist die, auf der jeder zuerst landet -- und die
einzige, die keine Kopfleiste hat. Genau deshalb fehlte das
Angebot hier bisher ganz.
UNTER dem Anmelden-Knopf und nicht darueber: Wer hier ist, will
sich anmelden. Das Installieren ist das zweite Anliegen, nicht
das erste. Der Knopf ist von selbst weg, sobald die App liegt. -->
<p class="gate-install" data-install-platz></p>
<p class="fuss">
Verschlüsselte Verbindung · Zugriffe werden protokolliert
</p>
@@ -381,6 +395,7 @@
<script src="assets/js/gate.js?v=202609221359" defer></script>
<script src="assets/js/gate.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
</body>
</html>
workspace/crew.webmanifest
+5 -4
View File
@@ -14,6 +14,7 @@
"share_target": {
"action": "/workspace/teilen.html",
"method": "GET",
"enctype": "application/x-www-form-urlencoded",
"params": {
"title": "title",
"text": "text",
@@ -22,25 +23,25 @@
},
"icons": [
{
"src": "/assets/img/app-symbole/crew-192.png?v=202609221359",
"src": "/assets/img/app-symbole/crew-192.png?v=202609221415",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/crew-512.png?v=202609221359",
"src": "/assets/img/app-symbole/crew-512.png?v=202609221415",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/assets/img/app-symbole/crew-192-maskable.png?v=202609221359",
"src": "/assets/img/app-symbole/crew-192-maskable.png?v=202609221415",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/assets/img/app-symbole/crew-512-maskable.png?v=202609221359",
"src": "/assets/img/app-symbole/crew-512-maskable.png?v=202609221415",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
workspace/dateien.html
+17 -16
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/dateien.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -108,14 +108,15 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/dateien.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/dateien.js?v=202609221415" defer></script>
</body>
</html>
workspace/entwicklung.html
+15 -14
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -132,13 +132,14 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/entwicklung.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/entwicklung.js?v=202609221415" defer></script>
</body>
</html>
workspace/hilfe.html
+14 -13
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/hilfe.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/hilfe.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -146,12 +146,13 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/hilfe.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/hilfe.js?v=202609221415" defer></script>
</body>
</html>
workspace/index.html
+433 -416
View File
@@ -1,416 +1,433 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Anmeldung · Spicy & Dogi</title>
<meta name="description" content="Privater Arbeitsbereich für Creator, Scouts und DogFather." />
<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" />
<!-- Die Bühne ist der erste Eindruck. Ohne diesen Hinweis lädt der Browser sie erst,
nachdem er das CSS gelesen hat - das kostet spürbar Zeit. Quer- und Hochformat
sind getrennt, damit das Handy nicht die große Fassung zieht.
Hier steht bewusst WebP und nicht AVIF, obwohl die AVIF-Fassungen erzeugt
werden und rund ein Drittel kleiner wären: Der ausliefernde Server läuft auf
Express 4, dessen `send` eine alte MIME-Tabelle ohne AVIF mitbringt. Die
Dateien kämen als application/octet-stream an und würden wegen des
nosniff-Headers vom Browser verweigert - die Bühne bliebe leer. Sobald der
Workspace einen eigenen Server bekommt, kann AVIF wieder eingeschaltet
werden (die Dateien liegen bereit). -->
<link rel="preload" as="image" href="assets/img/buehne/gate-1920.webp"
type="image/webp" media="(min-width: 900px)" />
<link rel="preload" as="image" href="assets/img/buehne/gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
</head>
<body class="gate">
<!-- ====================================================================
DIE FÜNF ROLLENZEICHEN, plastisch (08.09.2026)
Filipe: "die symbole sollen auch noch viel viel viel realistischer
und geiler sein", mit genauen Vorgaben je Rolle:
peperoni rot und grün
husky silber und blaue Augen
manager gelber Stern, der glitzert
scout grünes Schild mit einer roten Peperoni darin
creator lila und silber, "was richtig geiles"
WAS SICH GRUNDSÄTZLICH ÄNDERT: Vorher trug jedes Zeichen genau EINE
Farbe (`currentColor` über `.fuell`/`.linie`). Damit lässt sich
"rot UND grün" nicht darstellen. Jedes Zeichen bekommt deshalb
eigene Verläufe — dieselbe Technik, mit der auch die Kacheln
plastisch wirken: ein heller Rand oben, die Sättigung in der Mitte,
Abdunklung unten. Das ergibt Volumen statt einer flachen Fläche.
WARUM VERLÄUFE UND KEIN DETAIL: Diese Zeichen stehen bei 22 px.
Mehr Linien werden dort zu Matsch — das stand schon beim Husky hier,
und es gilt weiter. "Realistischer" heißt bei dieser Größe also
nicht "mehr Striche", sondern LICHT: eine Form, auf die Licht fällt,
wirkt körperlich; dieselbe Form flach gefüllt wirkt wie ein
Aufkleber. Alle Verläufe laufen deshalb von oben nach unten, als
stünde das Licht über der Seite — so wie bei allem anderen hier auch.
Die Verlaufs-IDs sind mit `rs-` vorangestellt (RollenSymbol), damit
sie mit nichts kollidieren, was später dazukommt.
==================================================================== -->
<!-- NICHT `display:none` VERSTECKEN -- das war ein echter Fehler, und man
sieht ihn erst im Bild (08.09.2026).
Solange die Zeichen einfarbig waren (`currentColor` ueber CSS), war
`display:none` harmlos. Sobald sie ihre Farbe aus einem <linearGradient>
im selben <defs> holen, ist es das nicht mehr: Ein Verlauf in einem
Teilbaum, der `display:none` traegt, wird nicht ausgewertet, und ein
`<use>` darauf bekommt schlicht KEINE Fuellung. Im Bildschirmfoto
standen daraufhin fuenf Bruchstuecke -- nur die Strichlinien, keine
Flaechen. Die Zahlen sagten dazu nichts, das Sprite war ja da.
Richtig ist ein Kasten ohne Groesse: Er wird gerendert (Verlaeufe
werden also aufgeloest), nimmt aber keinen Platz ein. -->
<svg width="0" height="0" style="position:absolute;overflow:hidden" aria-hidden="true"><defs>
<linearGradient id="rs-chili-rot" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#ff8a6b"/>
<stop offset=".55" stop-color="#ef4136"/>
<stop offset="1" stop-color="#a8221c"/>
</linearGradient>
<linearGradient id="rs-chili-gruen" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#8fd66a"/>
<stop offset="1" stop-color="#3f7d33"/>
</linearGradient>
<!-- `rs-silber` ist am 09.09.2026 entfallen. Er faerbte den alten,
selbstgebauten Husky; seit dort das echte Logo steht (mit einem
eigenen Duotonie-Filter), benutzte ihn niemand mehr. Ein
Verlauf, den man im Quelltext findet und der nichts faerbt,
kostet den naechsten Leser eine Suche. -->
<!-- DER STERN WIRD LILA (08.09.2026, zweite Ansage von Filipe).
Zuerst hiess es "manager: gelber stern der glitzert", dann nach
dem Bildschirmfoto: "die hauptfarbe von denen ist lila, der stern
soll so bleiben aber was gelb ist soll lila werden."
Die FORM bleibt also, nur die Farbe wechselt -- und das ist auch
stimmiger: Der Manager traegt Lila als Rollenfarbe, ein goldener
Stern daneben waere die einzige Stelle gewesen, an der Zeichen und
Rolle auseinandergehen. Die Wechsel hell/dunkel bleiben, sie sind
es, die aus einer Flaeche einen Koerper machen.
Der Name der Kennung bleibt `rs-gold`: Sie wird an mehreren
Stellen benutzt, und ein Umbenennen waere eine zweite Gelegenheit,
eine davon zu vergessen. -->
<linearGradient id="rs-gold" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#e6d6ff"/>
<stop offset=".45" stop-color="#a78bfa"/>
<stop offset="1" stop-color="#5b3fa8"/>
</linearGradient>
<linearGradient id="rs-schild" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#7fe0ae"/>
<stop offset=".5" stop-color="#3faa78"/>
<stop offset="1" stop-color="#1c5e42"/>
</linearGradient>
<linearGradient id="rs-lila" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#d9c9ff"/>
<stop offset=".38" stop-color="#a78bfa"/>
<stop offset="1" stop-color="#5b3fa8"/>
</linearGradient>
<linearGradient id="rs-lila-silber" x1="0" y1="1" x2="1" y2="0">
<stop offset="0" stop-color="#6d4fc4"/>
<stop offset=".5" stop-color="#cbd5e1"/>
<stop offset="1" stop-color="#a78bfa"/>
</linearGradient>
<radialGradient id="rs-auge" cx=".38" cy=".32" r=".85">
<stop offset="0" stop-color="#bfe9ff"/>
<stop offset=".45" stop-color="#3fa9f5"/>
<stop offset="1" stop-color="#0f4c75"/>
</radialGradient>
<!-- SPICY MEDIA — die Peperoni, rot mit grünem Stiel.
Der Stiel liegt ÜBER der Frucht und ist eine eigene Form: Als
Teil desselben Pfades hätte er die Farbe der Frucht erben müssen,
und genau das wollte Filipe nicht. -->
<g id="r-chili">
<path fill="url(#rs-chili-rot)" d="M13.4 4.6c-.6 1.4-.3 2.6.6 3.4 3 .3 5 2.6 5 5.4 0 3.4-3 6-6.8 6-4.6 0-8.2-2.9-9.7-6.7 3.7.9 6.6-.4 8-3.1.6-1.2.4-2.4-.4-3.1"/>
<path fill="none" stroke="rgba(255,255,255,.5)" stroke-width=".9" stroke-linecap="round" d="M6.2 13.9c2.4 1.9 5 2.6 7.4 2"/>
<path fill="none" stroke="url(#rs-chili-gruen)" stroke-width="1.9" stroke-linecap="round" d="M13.4 4.6c1.5-.6 2.8.1 3 1.4"/>
<path fill="none" stroke="url(#rs-chili-gruen)" stroke-width="1.7" stroke-linecap="round" d="M13.4 4.6c-.5 1.2-.3 2.3.5 3.2"/>
</g>
<!-- DER HUSKY IST JETZT DAS ECHTE LOGO (09.09.2026, screen3).
Filipe: "dieses husky symbol soll ersetzt werden durch den husky
oben in der leiste ... die farbe von der rolle und die barre soll
so richtig geil silber sein ... und der husky soll eine geile
babyblau sein haben."
Hier stand eine geometrische Eigenkonstruktion: ein Fuenfeck mit
zwei dreieckigen Ohren und zwei Punkten. Sie war ordentlich
gebaut, aber sie war nicht DER Husky -- oben in der Leiste steht
die richtige Marke, und zwei verschiedene Huskys auf einer Seite
sind einer zu viel.
DAS BILD KOMMT ALS <image>, DIE FARBE AUS EINEM FILTER. Die
Datei ist schwarz-weiss und freigestellt. `feComponentTransfer`
mit einer zweistufigen Tabelle bildet sie auf zwei Farben ab:
Schwarz wird zu dunklem Stahl (#2a3644), Weiss zu Silber
(#e8eef6). Das ist eine echte Duotonie -- ein `feColorMatrix`
koennte das nicht, der kann nur linear mischen und wuerde die
Mitteltoene flach ziehen.
DAS AUGE IST GEMESSEN, NICHT GESETZT: Ein Durchlauf ueber die
Bildpunkte hat die Pupille als einzige dunkle Insel gefunden,
die ringsum von Hellem umgeben ist -- bei 165/258 von 512, also
32,2 % und 50,4 %. Im 24er Raster sind das 7,73 und 12,1.
Darauf liegen Iris (babyblau), Pupille und ein Glanzpunkt.
Warum ueberhaupt eine Iris: Das Logo hat ein schwarzes Auge.
Babyblau war seit dem ersten Auftrag gewuenscht ("husky: silber
und blaue augen") und ist es jetzt wieder -- es ist der einzige
Farbfleck an einem sonst silbernen Zeichen und traegt damit
genau so viel Farbe wie die anderen Rollen auch. -->
<filter id="rs-husky-duo" color-interpolation-filters="sRGB">
<feComponentTransfer>
<feFuncR type="table" tableValues="0.165 0.910"/>
<feFuncG type="table" tableValues="0.212 0.933"/>
<feFuncB type="table" tableValues="0.267 0.965"/>
</feComponentTransfer>
</filter>
<g id="r-husky">
<image href="assets/img/marke-husky.webp" x="0" y="0" width="24" height="24"
preserveAspectRatio="xMidYMid meet" filter="url(#rs-husky-duo)"/>
<circle fill="#7ec8f2" cx="7.73" cy="12.1" r="1.05"/>
<circle fill="#16232f" cx="7.73" cy="12.1" r="0.52"/>
<circle fill="#ffffff" opacity=".85" cx="7.5" cy="11.85" r="0.2"/>
</g>
<!-- MANAGER — der goldene Stern, der glitzert.
Das Funkeln ist ein schmaler heller Streifen, der einmal quer
über den Stern wandert. Es ist BEWUSST langsam (4,5 s) und
schwach: Ein schnelles Blinken wäre genau die aggressive Optik,
die hier nicht sein soll. Bei "weniger Bewegung" steht es still
(siehe personen.css) -- dann bleibt ein ruhiger goldener Stern. -->
<g id="r-stern">
<path fill="url(#rs-gold)" d="m12 3.4 2.6 5.6 6 .8-4.4 4.2 1.1 6-5.3-2.9-5.3 2.9 1.1-6L3.4 9.8l6-.8z"/>
<path fill="rgba(255,255,255,.45)" d="m12 3.4 2.6 5.6-2.6.7z"/>
<path class="rs-funkel" fill="rgba(255,255,255,.75)" d="m12 3.4 2.6 5.6 6 .8-4.4 4.2 1.1 6-5.3-2.9-5.3 2.9 1.1-6L3.4 9.8l6-.8z"/>
</g>
<!-- SCOUT — grünes Schild mit einer roten Peperoni darin.
Der Haken von früher ist weg: Filipe hat die Peperoni ausdrücklich
verlangt, und beides nebeneinander wäre bei 22 px Matsch. Die
Chili ist stark vereinfacht — bei dieser Größe zählt nur, dass
eine rote, gebogene Form mit grünem Stiel im Schild steht. -->
<g id="r-schutz">
<path fill="url(#rs-schild)" d="M12 3.4 5.8 5.9v5c0 3.5 2.5 6.7 6.2 8 3.7-1.3 6.2-4.5 6.2-8v-5z"/>
<path fill="rgba(255,255,255,.28)" d="M12 3.4 5.8 5.9v5c0 1.4.4 2.7 1.1 3.9L12 3.4z"/>
<path fill="url(#rs-chili-rot)" d="M13.6 8.1c-.4.9-.2 1.7.4 2.2 1.9.2 3.2 1.7 3.2 3.4 0 2.1-1.9 3.8-4.3 3.8-2.9 0-5.2-1.8-6.1-4.2 2.3.6 4.2-.3 5-2 .4-.8.3-1.5-.2-2z" transform="translate(-.6 -.9) scale(.92) translate(1 1)"/>
<path fill="none" stroke="#8fd66a" stroke-width="1.3" stroke-linecap="round" d="M12.9 7.6c.9-.4 1.7 0 1.8.8"/>
</g>
<!-- CREATOR — Lila und Silber.
Statt der alten Person-Silhouette (die aussah wie ein leeres
Benutzerbild und damit wie "niemand") jetzt ein geschliffener
Kristall: lila Kern, silberne Facetten. Er hat als einziges der
fünf Zeichen eine Innenzeichnung, und die trägt auch klein --
weil es gerade Kanten sind, keine Rundungen. -->
<g id="r-person">
<path fill="url(#rs-lila)" d="M12 2.6 20 9l-3 11.4H7L4 9z"/>
<path fill="url(#rs-lila-silber)" opacity=".85" d="M12 2.6 20 9h-5.6zM12 2.6 4 9h5.6z"/>
<path fill="rgba(255,255,255,.4)" d="M12 2.6 14.4 9H9.6z"/>
<path fill="none" stroke="rgba(216,222,233,.75)" stroke-width=".8" stroke-linejoin="round" d="M12 2.6 20 9l-3 11.4H7L4 9zM4 9h16M9.6 9 12 20.4 14.4 9"/>
</g>
</defs></svg>
<!-- ---------- Bühne: Bild + Schleier ---------------------------------- -->
<div class="buehne" aria-hidden="true">
<picture>
<!-- BIS 2560 PIXEL (07.09.2026). Vorher endete die Reihe bei 1600 --
auf einem 2550 px breiten Schirm rechnete der Browser das Bild
also um das 1,6-fache hoch, und jede Kante wurde weich. Genau
das sah man als "nicht hochwertig", ohne es benennen zu koennen.
Eine hoehere Bildguete haette daran nichts geaendert: Man kann
keine Bildpunkte zurueckholen, die nie ausgeliefert wurden.
Ueber srcset laedt trotzdem jeder nur die Stufe, die er
braucht -- ein Handy weiterhin 32 KB. -->
<source media="(min-width: 900px)" type="image/webp"
srcset="assets/img/buehne/gate-960.webp 960w,
assets/img/buehne/gate-1280.webp 1280w,
assets/img/buehne/gate-1600.webp 1600w,
assets/img/buehne/gate-1920.webp 1920w,
assets/img/buehne/gate-2560.webp 2560w" sizes="100vw" />
<source type="image/webp"
srcset="assets/img/buehne/gate-hoch-440.webp 440w,
assets/img/buehne/gate-hoch-580.webp 580w,
assets/img/buehne/gate-hoch-900.webp 900w" sizes="100vw" />
<img class="buehne__bild" src="assets/img/buehne/gate-1280.webp" alt=""
width="1647" height="955" fetchpriority="high" decoding="async" />
</picture>
<div class="buehne__schleier"></div>
</div>
<!-- ---------- Tafel ----------------------------------------------------
DER ANKER (06.09.2026). Im Motiv steht rechts eine LEERE TAFEL mit
Neonrahmen -- dort gehoert die Anmeldekarte hinein, und zwar genau
hinein, nicht ungefaehr.
Das geht nur, wenn man weiss, wo die gemalte Tafel auf dem
Bildschirm landet. Das Bild liegt mit `object-fit: cover` darunter;
je nach Fensterform schneidet der Browser oben/unten oder
links/rechts etwas ab. Dieser Anker rechnet genau dieselbe
Cover-Geometrie noch einmal nach (siehe gate.css) -- er ist damit
deckungsgleich mit dem Bild, und die Karte kann in Prozent des
BILDES sitzen statt in Prozent des Fensters.
Er faengt keine Klicks ab (pointer-events: none); nur die Karte
darin ist bedienbar. -->
<div class="tafel-anker">
<main class="tafel" id="tafel">
<div class="tafel__kante" aria-hidden="true"></div>
<!-- 07.09.2026, Wunsch Filipe: "dogfather universe auch ersetzen durch
SpicyMedia x DogFather" und der Satz darunter soll "nur um manager
scouts und creator von spicy media" gehen, ohne DogFather.
Das "x" steht als eigenes Element, damit es kleiner und in der
Zwischenfarbe gesetzt werden kann -- so liest man zwei Namen und
ein Zeichen dazwischen, nicht drei gleich laute Wörter. Es trägt
aria-hidden nicht: Vorgelesen wird "SpicyMedia x DogFather", und
genau so spricht man es auch aus. -->
<header class="kopf">
<p class="marke marke--paar">
<span class="marke__spicy">SpicyMedia</span>
<span class="marke__x">×</span>
<span class="marke__dogi">DogFather</span>
</p>
<h1 class="titel">Creator&nbsp;Workspace</h1>
<p class="unterzeile">Privater Bereich für die Manager, Scouts und Creator von Spicy&nbsp;Media.</p>
</header>
<div class="rollen" role="radiogroup" aria-labelledby="rollen-schild">
<p class="feldschild" id="rollen-schild">Womit meldest du dich an?</p>
<!-- SPICY MEDIA steht ganz oben (07.09.2026, Wunsch Filipe: "ueber
dogfather auch eine kategorie, eine neue rolle"). Der Chili ist
das Zeichen der Marke -- dieselbe Form wie im Logo, nur als
Umriss, damit sie neben Krone, Stern und Schild dieselbe
Strichstaerke hat. -->
<button type="button" class="rolle" data-rolle="spicy" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-chili"/></svg>
<span class="rolle__text">
<span class="rolle__name">Spicy Media</span>
<span class="rolle__zusatz">Überblick über alle</span>
</span>
</button>
<!-- DER HUSKY FÜR DOGFATHER (07.09.2026). Filipe: "bei dogfather ist
immer noch die krone und da soll ja ein husky sein" -- auf der
Personenseite war er schon getauscht, hier nicht.
Bei 21 Pixeln entscheidet die SILHOUETTE, nicht das Detail: die
spitzen aufrechten Ohren, der breite Kopf, der nach unten schmal
zuläuft, die Gesichtsmaske. Mehr passt nicht hinein, und mehr
braucht es nicht -- ein Husky ist an genau diesen drei Dingen
zu erkennen.
Das Schild ist zum Scout gewandert: Ein Scout schirmt die
Pipeline ab und prüft, bevor etwas weitergereicht wird. -->
<button type="button" class="rolle" data-rolle="admin" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-husky"/></svg>
<span class="rolle__text">
<span class="rolle__name">DogFather</span>
<!-- "Manager & Technik" statt "Gesamtübersicht & Freigaben"
(08.09.2026, screen27). Die alte Zeile beschrieb ein RECHT
("darf alles sehen und freigeben"), die neue eine AUFGABE --
und danach sucht jemand, der vor der Rollenwahl steht: Er
fragt sich nicht, was er dürfte, sondern was er hier tut. -->
<span class="rolle__zusatz">Manager &amp; Technik</span>
</span>
</button>
<!-- Manager: dieselben Rechte wie DogFather, nur die Personen-
verwaltung bleibt DogFather vorbehalten. Der Stern steht fuer
den Rang darunter, ohne "unter" zu sagen. -->
<button type="button" class="rolle" data-rolle="manager" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-stern"/></svg>
<span class="rolle__text">
<span class="rolle__name">Manager</span>
<span class="rolle__zusatz">Betreuung &amp; Freigaben</span>
</span>
</button>
<button type="button" class="rolle" data-rolle="scout" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-schutz"/></svg>
<span class="rolle__text">
<span class="rolle__name">Scout</span>
<span class="rolle__zusatz">Eigene Pipeline &amp; Kontakte</span>
</span>
</button>
<button type="button" class="rolle" data-rolle="creator" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-person"/></svg>
<span class="rolle__text">
<span class="rolle__name">Creator</span>
<span class="rolle__zusatz">Eigener Bereich &amp; Fortschritt</span>
</span>
</button>
</div>
<form class="formular" id="formular" novalidate>
<label class="feldschild" for="code">
Persönlicher Zugangscode <span class="fuer" id="fuer" hidden></span>
</label>
<div class="feld">
<input type="password" id="code" name="code" inputmode="text"
autocomplete="current-password" spellcheck="false"
placeholder="Code eingeben" aria-describedby="hinweis fehler" />
<button type="button" class="feld__auge" id="auge"
aria-label="Code anzeigen" aria-pressed="false">
<svg viewBox="0 0 24 24" aria-hidden="true">
<path class="strich" d="M2.5 12S6 5.8 12 5.8 21.5 12 21.5 12 18 18.2 12 18.2 2.5 12 2.5 12Z"/>
<circle class="strich" cx="12" cy="12" r="2.9"/>
<path class="strich durch" d="m4 20 16-16"/>
</svg>
</button>
</div>
<p class="hinweis" id="hinweis" hidden>Feststelltaste ist aktiv.</p>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<button type="submit" class="knopf" id="knopf">
<span class="knopf__text">Anmelden</span>
<span class="knopf__laden" aria-hidden="true"></span>
</button>
</form>
<!-- EINE TÜR BRAUCHT EINE KLINGEL (ergänzt 19.09.2026).
Hier standen vier Kacheln, ein Feld „Code eingeben" und ein
Knopf. Wer keinen Code hat, fand keinen einzigen Satz, der ihm
sagt, was jetzt zu tun ist. Für die Community ist das besonders
teuer: Sie ist die einzige Rolle, die von außen kommt und
niemanden im Haus kennt. -->
<p class="fuss fuss--woher">Noch keinen Code? Den bekommst du von deinem Manager oder von DogFather.</p>
<p class="fuss">
Verschlüsselte Verbindung · Zugriffe werden protokolliert
</p>
</main>
</div>
␍␍
<script src="assets/js/gate.js?v=202609221359" defer></script>
</body>
</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>Anmeldung · Spicy & Dogi</title>
<meta name="description" content="Privater Arbeitsbereich für Creator, Scouts und DogFather." />
<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" />
<!-- Die Bühne ist der erste Eindruck. Ohne diesen Hinweis lädt der Browser sie erst,
nachdem er das CSS gelesen hat - das kostet spürbar Zeit. Quer- und Hochformat
sind getrennt, damit das Handy nicht die große Fassung zieht.
Hier steht bewusst WebP und nicht AVIF, obwohl die AVIF-Fassungen erzeugt
werden und rund ein Drittel kleiner wären: Der ausliefernde Server läuft auf
Express 4, dessen `send` eine alte MIME-Tabelle ohne AVIF mitbringt. Die
Dateien kämen als application/octet-stream an und würden wegen des
nosniff-Headers vom Browser verweigert - die Bühne bliebe leer. Sobald der
Workspace einen eigenen Server bekommt, kann AVIF wieder eingeschaltet
werden (die Dateien liegen bereit). -->
<link rel="preload" as="image" href="assets/img/buehne/gate-1920.webp"
type="image/webp" media="(min-width: 900px)" />
<link rel="preload" as="image" href="assets/img/buehne/gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
</head>
<body class="gate">
<!-- ====================================================================
DIE FÜNF ROLLENZEICHEN, plastisch (08.09.2026)
Filipe: "die symbole sollen auch noch viel viel viel realistischer
und geiler sein", mit genauen Vorgaben je Rolle:
peperoni rot und grün
husky silber und blaue Augen
manager gelber Stern, der glitzert
scout grünes Schild mit einer roten Peperoni darin
creator lila und silber, "was richtig geiles"
WAS SICH GRUNDSÄTZLICH ÄNDERT: Vorher trug jedes Zeichen genau EINE
Farbe (`currentColor` über `.fuell`/`.linie`). Damit lässt sich
"rot UND grün" nicht darstellen. Jedes Zeichen bekommt deshalb
eigene Verläufe — dieselbe Technik, mit der auch die Kacheln
plastisch wirken: ein heller Rand oben, die Sättigung in der Mitte,
Abdunklung unten. Das ergibt Volumen statt einer flachen Fläche.
WARUM VERLÄUFE UND KEIN DETAIL: Diese Zeichen stehen bei 22 px.
Mehr Linien werden dort zu Matsch — das stand schon beim Husky hier,
und es gilt weiter. "Realistischer" heißt bei dieser Größe also
nicht "mehr Striche", sondern LICHT: eine Form, auf die Licht fällt,
wirkt körperlich; dieselbe Form flach gefüllt wirkt wie ein
Aufkleber. Alle Verläufe laufen deshalb von oben nach unten, als
stünde das Licht über der Seite — so wie bei allem anderen hier auch.
Die Verlaufs-IDs sind mit `rs-` vorangestellt (RollenSymbol), damit
sie mit nichts kollidieren, was später dazukommt.
==================================================================== -->
<!-- NICHT `display:none` VERSTECKEN -- das war ein echter Fehler, und man
sieht ihn erst im Bild (08.09.2026).
Solange die Zeichen einfarbig waren (`currentColor` ueber CSS), war
`display:none` harmlos. Sobald sie ihre Farbe aus einem <linearGradient>
im selben <defs> holen, ist es das nicht mehr: Ein Verlauf in einem
Teilbaum, der `display:none` traegt, wird nicht ausgewertet, und ein
`<use>` darauf bekommt schlicht KEINE Fuellung. Im Bildschirmfoto
standen daraufhin fuenf Bruchstuecke -- nur die Strichlinien, keine
Flaechen. Die Zahlen sagten dazu nichts, das Sprite war ja da.
Richtig ist ein Kasten ohne Groesse: Er wird gerendert (Verlaeufe
werden also aufgeloest), nimmt aber keinen Platz ein. -->
<svg width="0" height="0" style="position:absolute;overflow:hidden" aria-hidden="true"><defs>
<linearGradient id="rs-chili-rot" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#ff8a6b"/>
<stop offset=".55" stop-color="#ef4136"/>
<stop offset="1" stop-color="#a8221c"/>
</linearGradient>
<linearGradient id="rs-chili-gruen" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#8fd66a"/>
<stop offset="1" stop-color="#3f7d33"/>
</linearGradient>
<!-- `rs-silber` ist am 09.09.2026 entfallen. Er faerbte den alten,
selbstgebauten Husky; seit dort das echte Logo steht (mit einem
eigenen Duotonie-Filter), benutzte ihn niemand mehr. Ein
Verlauf, den man im Quelltext findet und der nichts faerbt,
kostet den naechsten Leser eine Suche. -->
<!-- DER STERN WIRD LILA (08.09.2026, zweite Ansage von Filipe).
Zuerst hiess es "manager: gelber stern der glitzert", dann nach
dem Bildschirmfoto: "die hauptfarbe von denen ist lila, der stern
soll so bleiben aber was gelb ist soll lila werden."
Die FORM bleibt also, nur die Farbe wechselt -- und das ist auch
stimmiger: Der Manager traegt Lila als Rollenfarbe, ein goldener
Stern daneben waere die einzige Stelle gewesen, an der Zeichen und
Rolle auseinandergehen. Die Wechsel hell/dunkel bleiben, sie sind
es, die aus einer Flaeche einen Koerper machen.
Der Name der Kennung bleibt `rs-gold`: Sie wird an mehreren
Stellen benutzt, und ein Umbenennen waere eine zweite Gelegenheit,
eine davon zu vergessen. -->
<linearGradient id="rs-gold" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#e6d6ff"/>
<stop offset=".45" stop-color="#a78bfa"/>
<stop offset="1" stop-color="#5b3fa8"/>
</linearGradient>
<linearGradient id="rs-schild" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#7fe0ae"/>
<stop offset=".5" stop-color="#3faa78"/>
<stop offset="1" stop-color="#1c5e42"/>
</linearGradient>
<linearGradient id="rs-lila" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#d9c9ff"/>
<stop offset=".38" stop-color="#a78bfa"/>
<stop offset="1" stop-color="#5b3fa8"/>
</linearGradient>
<linearGradient id="rs-lila-silber" x1="0" y1="1" x2="1" y2="0">
<stop offset="0" stop-color="#6d4fc4"/>
<stop offset=".5" stop-color="#cbd5e1"/>
<stop offset="1" stop-color="#a78bfa"/>
</linearGradient>
<radialGradient id="rs-auge" cx=".38" cy=".32" r=".85">
<stop offset="0" stop-color="#bfe9ff"/>
<stop offset=".45" stop-color="#3fa9f5"/>
<stop offset="1" stop-color="#0f4c75"/>
</radialGradient>
<!-- SPICY MEDIA — die Peperoni, rot mit grünem Stiel.
Der Stiel liegt ÜBER der Frucht und ist eine eigene Form: Als
Teil desselben Pfades hätte er die Farbe der Frucht erben müssen,
und genau das wollte Filipe nicht. -->
<g id="r-chili">
<path fill="url(#rs-chili-rot)" d="M13.4 4.6c-.6 1.4-.3 2.6.6 3.4 3 .3 5 2.6 5 5.4 0 3.4-3 6-6.8 6-4.6 0-8.2-2.9-9.7-6.7 3.7.9 6.6-.4 8-3.1.6-1.2.4-2.4-.4-3.1"/>
<path fill="none" stroke="rgba(255,255,255,.5)" stroke-width=".9" stroke-linecap="round" d="M6.2 13.9c2.4 1.9 5 2.6 7.4 2"/>
<path fill="none" stroke="url(#rs-chili-gruen)" stroke-width="1.9" stroke-linecap="round" d="M13.4 4.6c1.5-.6 2.8.1 3 1.4"/>
<path fill="none" stroke="url(#rs-chili-gruen)" stroke-width="1.7" stroke-linecap="round" d="M13.4 4.6c-.5 1.2-.3 2.3.5 3.2"/>
</g>
<!-- DER HUSKY IST JETZT DAS ECHTE LOGO (09.09.2026, screen3).
Filipe: "dieses husky symbol soll ersetzt werden durch den husky
oben in der leiste ... die farbe von der rolle und die barre soll
so richtig geil silber sein ... und der husky soll eine geile
babyblau sein haben."
Hier stand eine geometrische Eigenkonstruktion: ein Fuenfeck mit
zwei dreieckigen Ohren und zwei Punkten. Sie war ordentlich
gebaut, aber sie war nicht DER Husky -- oben in der Leiste steht
die richtige Marke, und zwei verschiedene Huskys auf einer Seite
sind einer zu viel.
DAS BILD KOMMT ALS <image>, DIE FARBE AUS EINEM FILTER. Die
Datei ist schwarz-weiss und freigestellt. `feComponentTransfer`
mit einer zweistufigen Tabelle bildet sie auf zwei Farben ab:
Schwarz wird zu dunklem Stahl (#2a3644), Weiss zu Silber
(#e8eef6). Das ist eine echte Duotonie -- ein `feColorMatrix`
koennte das nicht, der kann nur linear mischen und wuerde die
Mitteltoene flach ziehen.
DAS AUGE IST GEMESSEN, NICHT GESETZT: Ein Durchlauf ueber die
Bildpunkte hat die Pupille als einzige dunkle Insel gefunden,
die ringsum von Hellem umgeben ist -- bei 165/258 von 512, also
32,2 % und 50,4 %. Im 24er Raster sind das 7,73 und 12,1.
Darauf liegen Iris (babyblau), Pupille und ein Glanzpunkt.
Warum ueberhaupt eine Iris: Das Logo hat ein schwarzes Auge.
Babyblau war seit dem ersten Auftrag gewuenscht ("husky: silber
und blaue augen") und ist es jetzt wieder -- es ist der einzige
Farbfleck an einem sonst silbernen Zeichen und traegt damit
genau so viel Farbe wie die anderen Rollen auch. -->
<filter id="rs-husky-duo" color-interpolation-filters="sRGB">
<feComponentTransfer>
<feFuncR type="table" tableValues="0.165 0.910"/>
<feFuncG type="table" tableValues="0.212 0.933"/>
<feFuncB type="table" tableValues="0.267 0.965"/>
</feComponentTransfer>
</filter>
<g id="r-husky">
<image href="assets/img/marke-husky.webp" x="0" y="0" width="24" height="24"
preserveAspectRatio="xMidYMid meet" filter="url(#rs-husky-duo)"/>
<circle fill="#7ec8f2" cx="7.73" cy="12.1" r="1.05"/>
<circle fill="#16232f" cx="7.73" cy="12.1" r="0.52"/>
<circle fill="#ffffff" opacity=".85" cx="7.5" cy="11.85" r="0.2"/>
</g>
<!-- MANAGER — der goldene Stern, der glitzert.
Das Funkeln ist ein schmaler heller Streifen, der einmal quer
über den Stern wandert. Es ist BEWUSST langsam (4,5 s) und
schwach: Ein schnelles Blinken wäre genau die aggressive Optik,
die hier nicht sein soll. Bei "weniger Bewegung" steht es still
(siehe personen.css) -- dann bleibt ein ruhiger goldener Stern. -->
<g id="r-stern">
<path fill="url(#rs-gold)" d="m12 3.4 2.6 5.6 6 .8-4.4 4.2 1.1 6-5.3-2.9-5.3 2.9 1.1-6L3.4 9.8l6-.8z"/>
<path fill="rgba(255,255,255,.45)" d="m12 3.4 2.6 5.6-2.6.7z"/>
<path class="rs-funkel" fill="rgba(255,255,255,.75)" d="m12 3.4 2.6 5.6 6 .8-4.4 4.2 1.1 6-5.3-2.9-5.3 2.9 1.1-6L3.4 9.8l6-.8z"/>
</g>
<!-- SCOUT — grünes Schild mit einer roten Peperoni darin.
Der Haken von früher ist weg: Filipe hat die Peperoni ausdrücklich
verlangt, und beides nebeneinander wäre bei 22 px Matsch. Die
Chili ist stark vereinfacht — bei dieser Größe zählt nur, dass
eine rote, gebogene Form mit grünem Stiel im Schild steht. -->
<g id="r-schutz">
<path fill="url(#rs-schild)" d="M12 3.4 5.8 5.9v5c0 3.5 2.5 6.7 6.2 8 3.7-1.3 6.2-4.5 6.2-8v-5z"/>
<path fill="rgba(255,255,255,.28)" d="M12 3.4 5.8 5.9v5c0 1.4.4 2.7 1.1 3.9L12 3.4z"/>
<path fill="url(#rs-chili-rot)" d="M13.6 8.1c-.4.9-.2 1.7.4 2.2 1.9.2 3.2 1.7 3.2 3.4 0 2.1-1.9 3.8-4.3 3.8-2.9 0-5.2-1.8-6.1-4.2 2.3.6 4.2-.3 5-2 .4-.8.3-1.5-.2-2z" transform="translate(-.6 -.9) scale(.92) translate(1 1)"/>
<path fill="none" stroke="#8fd66a" stroke-width="1.3" stroke-linecap="round" d="M12.9 7.6c.9-.4 1.7 0 1.8.8"/>
</g>
<!-- CREATOR — Lila und Silber.
Statt der alten Person-Silhouette (die aussah wie ein leeres
Benutzerbild und damit wie "niemand") jetzt ein geschliffener
Kristall: lila Kern, silberne Facetten. Er hat als einziges der
fünf Zeichen eine Innenzeichnung, und die trägt auch klein --
weil es gerade Kanten sind, keine Rundungen. -->
<g id="r-person">
<path fill="url(#rs-lila)" d="M12 2.6 20 9l-3 11.4H7L4 9z"/>
<path fill="url(#rs-lila-silber)" opacity=".85" d="M12 2.6 20 9h-5.6zM12 2.6 4 9h5.6z"/>
<path fill="rgba(255,255,255,.4)" d="M12 2.6 14.4 9H9.6z"/>
<path fill="none" stroke="rgba(216,222,233,.75)" stroke-width=".8" stroke-linejoin="round" d="M12 2.6 20 9l-3 11.4H7L4 9zM4 9h16M9.6 9 12 20.4 14.4 9"/>
</g>
</defs></svg>
<!-- ---------- Bühne: Bild + Schleier ---------------------------------- -->
<div class="buehne" aria-hidden="true">
<picture>
<!-- BIS 2560 PIXEL (07.09.2026). Vorher endete die Reihe bei 1600 --
auf einem 2550 px breiten Schirm rechnete der Browser das Bild
also um das 1,6-fache hoch, und jede Kante wurde weich. Genau
das sah man als "nicht hochwertig", ohne es benennen zu koennen.
Eine hoehere Bildguete haette daran nichts geaendert: Man kann
keine Bildpunkte zurueckholen, die nie ausgeliefert wurden.
Ueber srcset laedt trotzdem jeder nur die Stufe, die er
braucht -- ein Handy weiterhin 32 KB. -->
<source media="(min-width: 900px)" type="image/webp"
srcset="assets/img/buehne/gate-960.webp 960w,
assets/img/buehne/gate-1280.webp 1280w,
assets/img/buehne/gate-1600.webp 1600w,
assets/img/buehne/gate-1920.webp 1920w,
assets/img/buehne/gate-2560.webp 2560w" sizes="100vw" />
<source type="image/webp"
srcset="assets/img/buehne/gate-hoch-440.webp 440w,
assets/img/buehne/gate-hoch-580.webp 580w,
assets/img/buehne/gate-hoch-900.webp 900w" sizes="100vw" />
<img class="buehne__bild" src="assets/img/buehne/gate-1280.webp" alt=""
width="1647" height="955" fetchpriority="high" decoding="async" />
</picture>
<div class="buehne__schleier"></div>
</div>
<!-- ---------- Tafel ----------------------------------------------------
DER ANKER (06.09.2026). Im Motiv steht rechts eine LEERE TAFEL mit
Neonrahmen -- dort gehoert die Anmeldekarte hinein, und zwar genau
hinein, nicht ungefaehr.
Das geht nur, wenn man weiss, wo die gemalte Tafel auf dem
Bildschirm landet. Das Bild liegt mit `object-fit: cover` darunter;
je nach Fensterform schneidet der Browser oben/unten oder
links/rechts etwas ab. Dieser Anker rechnet genau dieselbe
Cover-Geometrie noch einmal nach (siehe gate.css) -- er ist damit
deckungsgleich mit dem Bild, und die Karte kann in Prozent des
BILDES sitzen statt in Prozent des Fensters.
Er faengt keine Klicks ab (pointer-events: none); nur die Karte
darin ist bedienbar. -->
<div class="tafel-anker">
<main class="tafel" id="tafel">
<div class="tafel__kante" aria-hidden="true"></div>
<!-- 07.09.2026, Wunsch Filipe: "dogfather universe auch ersetzen durch
SpicyMedia x DogFather" und der Satz darunter soll "nur um manager
scouts und creator von spicy media" gehen, ohne DogFather.
Das "x" steht als eigenes Element, damit es kleiner und in der
Zwischenfarbe gesetzt werden kann -- so liest man zwei Namen und
ein Zeichen dazwischen, nicht drei gleich laute Wörter. Es trägt
aria-hidden nicht: Vorgelesen wird "SpicyMedia x DogFather", und
genau so spricht man es auch aus. -->
<header class="kopf">
<p class="marke marke--paar">
<span class="marke__spicy">SpicyMedia</span>
<span class="marke__x">×</span>
<span class="marke__dogi">DogFather</span>
</p>
<h1 class="titel">Creator&nbsp;Workspace</h1>
<p class="unterzeile">Privater Bereich für die Manager, Scouts und Creator von Spicy&nbsp;Media.</p>
</header>
<div class="rollen" role="radiogroup" aria-labelledby="rollen-schild">
<p class="feldschild" id="rollen-schild">Womit meldest du dich an?</p>
<!-- SPICY MEDIA steht ganz oben (07.09.2026, Wunsch Filipe: "ueber
dogfather auch eine kategorie, eine neue rolle"). Der Chili ist
das Zeichen der Marke -- dieselbe Form wie im Logo, nur als
Umriss, damit sie neben Krone, Stern und Schild dieselbe
Strichstaerke hat. -->
<button type="button" class="rolle" data-rolle="spicy" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-chili"/></svg>
<span class="rolle__text">
<span class="rolle__name">Spicy Media</span>
<span class="rolle__zusatz">Überblick über alle</span>
</span>
</button>
<!-- DER HUSKY FÜR DOGFATHER (07.09.2026). Filipe: "bei dogfather ist
immer noch die krone und da soll ja ein husky sein" -- auf der
Personenseite war er schon getauscht, hier nicht.
Bei 21 Pixeln entscheidet die SILHOUETTE, nicht das Detail: die
spitzen aufrechten Ohren, der breite Kopf, der nach unten schmal
zuläuft, die Gesichtsmaske. Mehr passt nicht hinein, und mehr
braucht es nicht -- ein Husky ist an genau diesen drei Dingen
zu erkennen.
Das Schild ist zum Scout gewandert: Ein Scout schirmt die
Pipeline ab und prüft, bevor etwas weitergereicht wird. -->
<button type="button" class="rolle" data-rolle="admin" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-husky"/></svg>
<span class="rolle__text">
<span class="rolle__name">DogFather</span>
<!-- "Manager & Technik" statt "Gesamtübersicht & Freigaben"
(08.09.2026, screen27). Die alte Zeile beschrieb ein RECHT
("darf alles sehen und freigeben"), die neue eine AUFGABE --
und danach sucht jemand, der vor der Rollenwahl steht: Er
fragt sich nicht, was er dürfte, sondern was er hier tut. -->
<span class="rolle__zusatz">Manager &amp; Technik</span>
</span>
</button>
<!-- Manager: dieselben Rechte wie DogFather, nur die Personen-
verwaltung bleibt DogFather vorbehalten. Der Stern steht fuer
den Rang darunter, ohne "unter" zu sagen. -->
<button type="button" class="rolle" data-rolle="manager" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-stern"/></svg>
<span class="rolle__text">
<span class="rolle__name">Manager</span>
<span class="rolle__zusatz">Betreuung &amp; Freigaben</span>
</span>
</button>
<button type="button" class="rolle" data-rolle="scout" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-schutz"/></svg>
<span class="rolle__text">
<span class="rolle__name">Scout</span>
<span class="rolle__zusatz">Eigene Pipeline &amp; Kontakte</span>
</span>
</button>
<button type="button" class="rolle" data-rolle="creator" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-person"/></svg>
<span class="rolle__text">
<span class="rolle__name">Creator</span>
<span class="rolle__zusatz">Eigener Bereich &amp; Fortschritt</span>
</span>
</button>
</div>
<form class="formular" id="formular" novalidate>
<label class="feldschild" for="code">
Persönlicher Zugangscode <span class="fuer" id="fuer" hidden></span>
</label>
<div class="feld">
<input type="password" id="code" name="code" inputmode="text"
autocomplete="current-password" spellcheck="false"
placeholder="Code eingeben" aria-describedby="hinweis fehler" />
<button type="button" class="feld__auge" id="auge"
aria-label="Code anzeigen" aria-pressed="false">
<svg viewBox="0 0 24 24" aria-hidden="true">
<path class="strich" d="M2.5 12S6 5.8 12 5.8 21.5 12 21.5 12 18 18.2 12 18.2 2.5 12 2.5 12Z"/>
<circle class="strich" cx="12" cy="12" r="2.9"/>
<path class="strich durch" d="m4 20 16-16"/>
</svg>
</button>
</div>
<p class="hinweis" id="hinweis" hidden>Feststelltaste ist aktiv.</p>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<button type="submit" class="knopf" id="knopf">
<span class="knopf__text">Anmelden</span>
<span class="knopf__laden" aria-hidden="true"></span>
</button>
</form>
<!-- EINE TÜR BRAUCHT EINE KLINGEL (ergänzt 19.09.2026).
Hier standen vier Kacheln, ein Feld „Code eingeben" und ein
Knopf. Wer keinen Code hat, fand keinen einzigen Satz, der ihm
sagt, was jetzt zu tun ist. Für die Community ist das besonders
teuer: Sie ist die einzige Rolle, die von außen kommt und
niemanden im Haus kennt. -->
<p class="fuss fuss--woher">Noch keinen Code? Den bekommst du von deinem Manager oder von DogFather.</p>
<!-- DAS ANGEBOT ZUM INSTALLIEREN GEHOERT HIERHER (22.09.2026).
Filipe: "ich will einen installieren button. damit die leute es
viel einfacher haben die seite auf dem pc oder auf dem handy zu
installieren!!!"
Diese Seite ist die, auf der jeder zuerst landet -- und die
einzige, die keine Kopfleiste hat. Genau deshalb fehlte das
Angebot hier bisher ganz.
UNTER dem Anmelden-Knopf und nicht darueber: Wer hier ist, will
sich anmelden. Das Installieren ist das zweite Anliegen, nicht
das erste. Der Knopf ist von selbst weg, sobald die App liegt. -->
<p class="gate-install" data-install-platz></p>
<p class="fuss">
Verschlüsselte Verbindung · Zugriffe werden protokolliert
</p>
</main>
</div>
<script src="assets/js/gate.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
</body>
</html>
workspace/kalender.html
+17 -16
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/kalender.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -383,14 +383,15 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/kalender.js?v=202609221359" defer></script>
<script src="assets/js/kalender-abo.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/kalender.js?v=202609221415" defer></script>
<script src="assets/js/kalender-abo.js?v=202609221415" defer></script>
</body>
</html>
workspace/leistung.html
+16 -15
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/leistung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/leistung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -444,12 +444,13 @@
</form>
</dialog>
<script src="assets/js/meldung.js?v=202609221359"></script>
<script src="assets/js/nachfrage.js?v=202609221359"></script>
<script src="assets/js/wahl.js?v=202609221359"></script>
<script src="assets/js/bereiche.js?v=202609221359"></script>
<script src="assets/js/kopf.js?v=202609221359"></script>
<script src="assets/js/glocke.js?v=202609221359"></script>
<script src="assets/js/leistung.js?v=202609221359"></script>
<script src="assets/js/meldung.js?v=202609221415"></script>
<script src="assets/js/nachfrage.js?v=202609221415"></script>
<script src="assets/js/wahl.js?v=202609221415"></script>
<script src="assets/js/bereiche.js?v=202609221415"></script>
<script src="assets/js/kopf.js?v=202609221415"></script>
<script src="assets/js/glocke.js?v=202609221415"></script>
<script src="assets/js/leistung.js?v=202609221415"></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
</body>
</html>
workspace/material.html
+16 -15
View File
@@ -12,13 +12,13 @@
vergessen wird. -->
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/material.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/material.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start" data-ton="42" data-buehne="studio">
@@ -138,13 +138,14 @@
<p class="m-laedt" id="laedt">Einen Moment …</p>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/material.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/material.js?v=202609221415" defer></script>
</body>
</html>
workspace/personen.html
+16 -15
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/personen.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -453,13 +453,14 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/personen.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/personen.js?v=202609221415" defer></script>
</body>
</html>
workspace/profil.html
+18 -17
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -214,15 +214,16 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/steckbrief.js?v=202609221359" defer></script>
<script src="assets/js/profil.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/steckbrief.js?v=202609221415" defer></script>
<script src="assets/js/profil.js?v=202609221415" defer></script>
</body>
</html>
workspace/rechte.html
+15 -14
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -134,11 +134,12 @@
Beim ersten Anlauf fehlte die Zeile auf genau diesen beiden neuen
Seiten. Gefunden hat das nicht das Auge, sondern pruef-css-klassen,
die seit dem 07.09. jede Seite danach absucht. -->
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/rechte.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/rechte.js?v=202609221415" defer></script>
</body>
</html>
workspace/report.html
+121 -119
View File
@@ -1,119 +1,121 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Reports &amp; Review · 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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/report.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Review</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">Reports</p>
<h1 class="titel">Review &amp; nächste Schritte</h1>
<p class="unterzeile" id="unterzeile">Fortschritt wird nicht gefühlt, sondern nachvollziehbar gemacht.</p>
</div>
<div class="steuerung">
<div id="creator-block" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
<div>
<label class="feld-schild" for="f-tage">Zeitraum</label>
<select id="f-tage">
<option value="7">7 Tage</option>
<option value="30" selected>30 Tage</option>
<option value="90">90 Tage</option>
</select>
</div>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<div id="bericht" aria-busy="true"><p class="leise">Report wird erstellt …</p></div>
<!-- Der Kern aus dem Konzept: Ein Review endet mit einer Entscheidung. -->
<section class="entscheidung" id="entscheidung-block" hidden>
<p class="marke">Abschluss</p>
<h2 class="entscheidung__titel">Was ist die Entscheidung?</h2>
<p class="entscheidung__text">
Ein Review endet nicht mit einer Zusammenfassung, sondern mit einem nächsten Schritt.
Was hier steht, wird sofort als Aufgabe mit hoher Priorität angelegt.
</p>
<form id="entscheidung">
<div class="entscheidung__raster">
<div>
<label class="feld-schild" for="e-titel">Nächster Schritt</label>
<input id="e-titel" maxlength="160" placeholder="z. B. Mikro-Problem bis Freitag lösen" required />
</div>
<div>
<label class="feld-schild" for="e-frist">Bis wann <span class="leise">(optional)</span></label>
<input id="e-frist" type="date" />
</div>
</div>
<p class="fehler" id="e-fehler" role="alert" aria-live="polite"></p>
<div class="neu__knoepfe">
<button type="submit" class="knopf knopf--klein" id="e-speichern">Als Aufgabe festhalten</button>
<span class="leise" id="e-stand"></span>
</div>
</form>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/ki.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/report.js?v=202609221359" defer></script>
</body>
</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>Reports &amp; Review · 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?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/report.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Review</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">Reports</p>
<h1 class="titel">Review &amp; nächste Schritte</h1>
<p class="unterzeile" id="unterzeile">Fortschritt wird nicht gefühlt, sondern nachvollziehbar gemacht.</p>
</div>
<div class="steuerung">
<div id="creator-block" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
<div>
<label class="feld-schild" for="f-tage">Zeitraum</label>
<select id="f-tage">
<option value="7">7 Tage</option>
<option value="30" selected>30 Tage</option>
<option value="90">90 Tage</option>
</select>
</div>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<div id="bericht" aria-busy="true"><p class="leise">Report wird erstellt …</p></div>
<!-- Der Kern aus dem Konzept: Ein Review endet mit einer Entscheidung. -->
<section class="entscheidung" id="entscheidung-block" hidden>
<p class="marke">Abschluss</p>
<h2 class="entscheidung__titel">Was ist die Entscheidung?</h2>
<p class="entscheidung__text">
Ein Review endet nicht mit einer Zusammenfassung, sondern mit einem nächsten Schritt.
Was hier steht, wird sofort als Aufgabe mit hoher Priorität angelegt.
</p>
<form id="entscheidung">
<div class="entscheidung__raster">
<div>
<label class="feld-schild" for="e-titel">Nächster Schritt</label>
<input id="e-titel" maxlength="160" placeholder="z. B. Mikro-Problem bis Freitag lösen" required />
</div>
<div>
<label class="feld-schild" for="e-frist">Bis wann <span class="leise">(optional)</span></label>
<input id="e-frist" type="date" />
</div>
</div>
<p class="fehler" id="e-fehler" role="alert" aria-live="polite"></p>
<div class="neu__knoepfe">
<button type="submit" class="knopf knopf--klein" id="e-speichern">Als Aufgabe festhalten</button>
<span class="leise" id="e-stand"></span>
</div>
</form>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/ki.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/report.js?v=202609221415" defer></script>
</body>
</html>
workspace/scouting.html
+16 -15
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -173,13 +173,14 @@
</div>
</div>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/scouting.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/scouting.js?v=202609221415" defer></script>
</body>
</html>
workspace/start.html
+16 -15
View File
@@ -12,21 +12,21 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<!-- Nur die Startseite: Begrüßungskachel, Uhr, Glockenmulde. Siehe
den Hinweis in start.css -- dort stand es bis zum 07.09.2026. -->
<link rel="stylesheet" href="assets/css/heim.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/heim.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -678,15 +678,16 @@
</p>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/live.js?v=202609221359" defer></script>
<script src="assets/js/start.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/live.js?v=202609221415" defer></script>
<script src="assets/js/start.js?v=202609221415" defer></script>
</body>
</html>
workspace/startcheck.html
+100 -98
View File
@@ -1,98 +1,100 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Start-Check · 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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Start-Check</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">Onboarding · Erstanalyse</p>
<h1 class="titel">Start-Check</h1>
<p class="unterzeile" id="unterzeile">
Ausgangslage verstehen – und daraus konkrete Arbeitspakete bauen.
</p>
</div>
<div class="steuerung">
<div id="creator-block" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<section class="fortschritt" id="fortschritt" hidden>
<div class="fortschritt__kopf">
<span class="fortschritt__zahl" id="f-zahl">0 von 16</span>
<span class="fortschritt__text" id="f-text">Punkten geprüft</span>
</div>
<div class="fortschritt__balken" role="progressbar" aria-valuemin="0" aria-valuemax="16"
aria-valuenow="0" id="f-balken-aussen">
<div class="fortschritt__fuellung" id="f-balken"></div>
</div>
<p class="fortschritt__hinweis" id="f-hinweis"></p>
</section>
<div id="felder" aria-busy="true"><p class="leise">Start-Check wird geladen …</p></div>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/ki.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/startcheck.js?v=202609221359" defer></script>
</body>
</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>Start-Check · 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?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Start-Check</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">Onboarding · Erstanalyse</p>
<h1 class="titel">Start-Check</h1>
<p class="unterzeile" id="unterzeile">
Ausgangslage verstehen – und daraus konkrete Arbeitspakete bauen.
</p>
</div>
<div class="steuerung">
<div id="creator-block" hidden>
<label class="feld-schild" for="f-creator">Creator</label>
<select id="f-creator"></select>
</div>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<section class="fortschritt" id="fortschritt" hidden>
<div class="fortschritt__kopf">
<span class="fortschritt__zahl" id="f-zahl">0 von 16</span>
<span class="fortschritt__text" id="f-text">Punkten geprüft</span>
</div>
<div class="fortschritt__balken" role="progressbar" aria-valuemin="0" aria-valuemax="16"
aria-valuenow="0" id="f-balken-aussen">
<div class="fortschritt__fuellung" id="f-balken"></div>
</div>
<p class="fortschritt__hinweis" id="f-hinweis"></p>
</section>
<div id="felder" aria-busy="true"><p class="leise">Start-Check wird geladen …</p></div>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/ki.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/startcheck.js?v=202609221415" defer></script>
</body>
</html>
workspace/steckbrief.html
+18 -17
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/profil.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -150,15 +150,16 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/auskunft.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/steckbrief.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/auskunft.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/steckbrief.js?v=202609221415" defer></script>
</body>
</html>
workspace/sw.js
+88 -4
View File
@@ -1,8 +1,10 @@
/* =====================================================================
Service Worker des Creator Workspace.
Er hat GENAU EINE Aufgabe: Benachrichtigungen entgegennehmen und
anzeigen.
Er hat ZWEI Aufgaben:
1. Benachrichtigungen entgegennehmen und anzeigen.
2. Da sein -- damit der Browser die Seite ueberhaupt als App
anbietet (siehe unten, 22.09.2026).
⚠️ BEWUSST OHNE ZWISCHENSPEICHER. Der naheliegende Zusatz waere,
hier auch Seiten und Dateien vorzuhalten ("offline verfuegbar").
@@ -16,8 +18,14 @@
Falsches zeigt, ist schlimmer als gar keiner -- man glaubt ihm
ja. Die Versionsstempel loesen das Problem bereits.
Wer spaeter Offline-Faehigkeit will, faengt hier NICHT einfach an,
sondern klaert vorher, was zwischengespeichert werden darf.
Das gilt weiter, und das Versprechen wird unten eingehalten: Der
`fetch`-Zuhoerer legt NICHTS ab. Er reicht durch, und nur wenn das
Netz weg ist, antwortet er mit einer Seite, die er selbst
zusammensetzt -- ohne je eine Antwort des Servers aufgehoben zu
haben.
Wer spaeter echte Offline-Faehigkeit will, faengt hier NICHT einfach
an, sondern klaert vorher, was zwischengespeichert werden darf.
===================================================================== */
/* Beim Einbauen sofort uebernehmen, statt auf das Schliessen aller
@@ -26,6 +34,82 @@
self.addEventListener("install", (e) => { self.skipWaiting(); });
self.addEventListener("activate", (e) => { e.waitUntil(self.clients.claim()); });
/* ---------------------------------------------------------------------
WARUM HIER EIN `fetch`-ZUHOERER STEHT, OBWOHL NICHTS ZWISCHENGESPEICHERT
WIRD (22.09.2026)
---------------------------------------------------------------------
Filipe, mehrfach und zuletzt deutlich: "ich will einen installieren
button. damit die leute es viel einfacher haben die seite auf dem pc
oder auf dem handy zu installieren!!! ... das hab ich auch schon paar
mal gefragt."
Der Knopf gab es seit dem 10.09. Er war nur nie zu sehen, und daran
waren ZWEI Dinge schuld, die beide hier zusammenkommen:
1. Dieser Service Worker wurde ausschliesslich in `glocke.js`
angemeldet -- also erst, wenn jemand Benachrichtigungen
ERLAUBT. Auf Filipes Rechner stehen sie auf "Vom Browser
blockiert". Damit lief nie einer.
2. Auch mit Anmeldung haette es nicht gereicht: Chrome verlangt
fuer sein Installationsangebot einen Service Worker MIT einem
`fetch`-Zuhoerer. Dieser hier hatte keinen.
Ohne Angebot des Browsers kommt `beforeinstallprompt` nie, und der
Knopf bleibt `hidden` -- fuer immer. Die Pruefung dazu war die ganze
Zeit gruen: Sie hat das Ereignis SELBST ausgeloest und gemessen, ob
der Knopf darauf reagiert. Die eine Frage, auf die es ankam --
"bietet der Browser es ueberhaupt an?" -- hat sie nie gestellt.
DIESER ZUHOERER LEGT NICHTS AB. Er meldet sich nur bei
Seitenaufrufen, reicht sie ans Netz weiter, und wenn das Netz weg
ist, baut er die Antwort selbst. Keine Antwort des Servers wird
aufgehoben, also kann auch nichts Persoenliches auf dem Geraet
liegenbleiben.
------------------------------------------------------------------ */
/* Die Seite fuer den Fall ohne Netz. Sie steht HIER im Quelltext und
nicht in einer abgelegten Datei -- eine abgelegte Datei waere ein
Zwischenspeicher, und genau den soll es nicht geben. */
const OHNE_NETZ = `<!doctype html>
<html lang="de"><head><meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Gerade kein Netz</title>
<style>
html,body{height:100%;margin:0}
body{display:grid;place-items:center;padding:24px;
background:#0a121e;color:#dbe4ef;
font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.k{max-width:26rem;text-align:center}
h1{font-size:1.25rem;margin:0 0 12px}
p{margin:0 0 10px;color:#94a5bb}
button{margin-top:18px;padding:12px 20px;font:inherit;color:#fff;cursor:pointer;
border:1px solid rgba(63,189,245,.55);border-radius:12px;background:#121926}
</style></head>
<body><div class="k">
<h1>Gerade kein Netz</h1>
<p>Dein Gerät ist offline — deshalb konnte die Seite nicht geladen werden.</p>
<p>Es liegt nicht an der App. Sobald du wieder Empfang oder WLAN hast, geht es weiter.</p>
<button type="button" onclick="location.reload()">Noch einmal versuchen</button>
</div></body></html>`;
self.addEventListener("fetch", (e) => {
const a = e.request;
/* NUR SEITENAUFRUFE. Bilder, Stilvorlagen und vor allem die
Schnittstellen bleiben unangetastet -- ein Service Worker, der
sich in eine API einmischt, ist die Sorte Fehler, die man Tage
spaeter an unerklaerlichen Antworten sucht. */
if (a.method !== "GET" || a.mode !== "navigate") return;
e.respondWith(fetch(a).catch(() => new Response(OHNE_NETZ, {
status: 503,
headers: {
"Content-Type": "text/html; charset=utf-8",
/* Nicht aufheben -- auch nicht vom Browser selbst. */
"Cache-Control": "no-store",
},
})));
});
/* ---------------------------------------------------------------------
Eine Benachrichtigung kommt an.
------------------------------------------------------------------ */
workspace/talente.html
+16 -15
View File
@@ -7,18 +7,18 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221415" />
<!-- Wegen des Kastens „Anfragen“ ueber der Liste. Eine eigene Kopie
der Regel hier waere die zweite Stelle, an der dieselbe Sache
anders aussieht. -->
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bewerbung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -111,12 +111,13 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/talente.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/talente.js?v=202609221415" defer></script>
</body>
</html>
workspace/team.html
+123 -121
View File
@@ -1,121 +1,123 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Team · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/team.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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> · Team</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">
<!-- ==== DER KOPF ================================================
Er sagt in einem Satz, was diese Seite ist UND was sie nicht
ist. Der zweite Teil ist der wichtigere: Eine Seite mit Zahlen
über Kollegen wird sonst als Überwachung gelesen -- und dann
arbeitet niemand mehr offen damit.
Aus der Recherche (Fachliteratur zu Arbeitslast-Dashboards):
Der Zweck ist, Stellen zu finden, an denen Unterstützung fehlt.
Wer das nicht dazuschreibt, baut ein Kontrollwerkzeug, auch wenn
er es nicht wollte. -->
<!-- ==== EINE ECHTE KACHEL, IM TON DER KATEGORIE (09.09.2026) ====
Filipe: "perfektionnir das in einer kachel in der farbe von der
kategorie bitte."
`t-kachel` steht in der Modulliste von module.css und bekommt
damit dieselbe Form wie jede Kachel im Haus: gefraeste Fase oben
links, Kantenlicht, Eckwinkel, Raster. Die FARBE kommt aus
`--ton` -- derselben Variablen, aus der die Kachel auf der
Startseite ihren Ton zieht, und dort ist es Ton 22 (#ffd166).
Beide lesen dieselbe Zahl; die Kachel auf der Startseite und die
Ueberschrift hier koennen also nicht auseinanderlaufen. -->
<section class="t-kachel" data-ton="22">
<div class="t-kopf">
<div class="t-kopf__text">
<p class="feldschild">Rund um das Team</p>
<h1 class="t-kopf__titel">Manager &amp; Scouts</h1>
<p class="t-kopf__unter" id="kopf-unter">
Wer betreut wen, wo staut sich etwas, wo fehlt jemand.
</p>
</div>
<p class="t-kopf__grenze">
Termine, Chats und Dateien kommen hier nicht vor – weder Inhalte
noch Zahlen. Das ist eine <strong>Arbeitslage</strong>, keine Überwachung.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ==== DIE LÜCKEN ZUERST ======================================
Eine Kennzahl sagt, wie es läuft. Eine Lücke sagt, wo etwas
fehlt -- und nur das Zweite kann man heute abstellen. Deshalb
steht sie oben und nicht unter den Tabellen. -->
<section class="t-luecken" id="luecken" hidden></section>
<!-- ==== DIE LAGE IN ZAHLEN ===================================== -->
<section class="t-lage" id="lage" hidden></section>
<!-- ==== DIE LEUTE ==============================================
Jede Person einzeln, nicht als Durchschnitt: Zwei Scouts mit je
sechs Creators und einer mit achtzehn ergeben einen Schnitt von
zehn -- und der sagt nichts über den, bei dem es klemmt. -->
<section class="t-gruppe" id="manager-block" hidden>
<h2 class="feldschild">Manager</h2>
<div class="t-liste" id="manager-liste"></div>
</section>
<section class="t-gruppe" id="scout-block" hidden>
<h2 class="feldschild">Scouts</h2>
<div class="t-liste" id="scout-liste"></div>
</section>
<p class="leise" id="laedt">Die Arbeitslage wird geladen …</p>
</main>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/team.js?v=202609221359" defer></script>
</body>
</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>Team · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/team.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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> · Team</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">
<!-- ==== DER KOPF ================================================
Er sagt in einem Satz, was diese Seite ist UND was sie nicht
ist. Der zweite Teil ist der wichtigere: Eine Seite mit Zahlen
über Kollegen wird sonst als Überwachung gelesen -- und dann
arbeitet niemand mehr offen damit.
Aus der Recherche (Fachliteratur zu Arbeitslast-Dashboards):
Der Zweck ist, Stellen zu finden, an denen Unterstützung fehlt.
Wer das nicht dazuschreibt, baut ein Kontrollwerkzeug, auch wenn
er es nicht wollte. -->
<!-- ==== EINE ECHTE KACHEL, IM TON DER KATEGORIE (09.09.2026) ====
Filipe: "perfektionnir das in einer kachel in der farbe von der
kategorie bitte."
`t-kachel` steht in der Modulliste von module.css und bekommt
damit dieselbe Form wie jede Kachel im Haus: gefraeste Fase oben
links, Kantenlicht, Eckwinkel, Raster. Die FARBE kommt aus
`--ton` -- derselben Variablen, aus der die Kachel auf der
Startseite ihren Ton zieht, und dort ist es Ton 22 (#ffd166).
Beide lesen dieselbe Zahl; die Kachel auf der Startseite und die
Ueberschrift hier koennen also nicht auseinanderlaufen. -->
<section class="t-kachel" data-ton="22">
<div class="t-kopf">
<div class="t-kopf__text">
<p class="feldschild">Rund um das Team</p>
<h1 class="t-kopf__titel">Manager &amp; Scouts</h1>
<p class="t-kopf__unter" id="kopf-unter">
Wer betreut wen, wo staut sich etwas, wo fehlt jemand.
</p>
</div>
<p class="t-kopf__grenze">
Termine, Chats und Dateien kommen hier nicht vor – weder Inhalte
noch Zahlen. Das ist eine <strong>Arbeitslage</strong>, keine Überwachung.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ==== DIE LÜCKEN ZUERST ======================================
Eine Kennzahl sagt, wie es läuft. Eine Lücke sagt, wo etwas
fehlt -- und nur das Zweite kann man heute abstellen. Deshalb
steht sie oben und nicht unter den Tabellen. -->
<section class="t-luecken" id="luecken" hidden></section>
<!-- ==== DIE LAGE IN ZAHLEN ===================================== -->
<section class="t-lage" id="lage" hidden></section>
<!-- ==== DIE LEUTE ==============================================
Jede Person einzeln, nicht als Durchschnitt: Zwei Scouts mit je
sechs Creators und einer mit achtzehn ergeben einen Schnitt von
zehn -- und der sagt nichts über den, bei dem es klemmt. -->
<section class="t-gruppe" id="manager-block" hidden>
<h2 class="feldschild">Manager</h2>
<div class="t-liste" id="manager-liste"></div>
</section>
<section class="t-gruppe" id="scout-block" hidden>
<h2 class="feldschild">Scouts</h2>
<div class="t-liste" id="scout-liste"></div>
</section>
<p class="leise" id="laedt">Die Arbeitslage wird geladen …</p>
</main>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/team.js?v=202609221415" defer></script>
</body>
</html>
workspace/teamlage.html
+96 -94
View File
@@ -1,94 +1,96 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Dein Team · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/team.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</head>
<!-- `data-buehne` steht hier fest und nicht im Skript: Die Kachel zu
dieser Seite kommt vom Server, `zuSeite()` in bereiche.js findet
sie deshalb nicht -- und ohne Fund griff der Rueckfall, also die
Szene der anderen Marke. Eine Seite mit genau einer Buehne
braucht dafuer kein Skript. -->
<body class="start" data-buehne="eingang">
<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> · Dein Team</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">
<!-- ==== DER KOPF ================================================
Er sagt, was diese Seite ist UND was sie nicht ist. Der zweite
Teil ist der wichtigere -- dieselbe Ueberlegung steht schon
ueber team.html: Eine Seite mit Zahlen ueber Kollegen wird sonst
als Kontrolle gelesen, und dann arbeitet niemand mehr offen
damit.
"Offen" heisst hier deshalb ausdruecklich: darueber habt ihr
noch nicht geredet. Es ist eine Liste fuer euch beide, keine
Note fuer den anderen. -->
<section class="t-kachel">
<div class="t-kopf">
<div class="t-kopf__text">
<p class="feldschild">Zusammen</p>
<h1 class="t-kopf__titel">Was auf dich wartet</h1>
<p class="t-kopf__unter" id="kopf-unter">…</p>
<p class="t-kopf__grenze">
Was hier steht, ist eine Merkliste für euch beide – keine Bewertung
von Menschen. „Offen“ heißt: darüber habt ihr noch nicht gesprochen.
Eingeschätzt wird dort, wo die Punkte stehen; jede Zahl führt dorthin.
</p>
</div>
</div>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
</section>
<section class="t-lage" id="lage" aria-busy="true"></section>
</main>
<!-- wahl.js VOR kopf.js (nachgetragen 10.09.2026).
kopf.js baut den Sicht-Umschalter; ohne wahl.js sieht er aus wie
ein blankes Browser-Auswahlfeld statt wie der Rest des Hauses.
Kaputt ist dabei nichts -- er funktioniert. Genau deshalb faellt
es niemandem auf, und deshalb prueft pruef-css-klassen die
ABHAENGIGKEIT statt der Optik. Hier hat sie angeschlagen. -->
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/teamlage.js?v=202609221359" defer></script>
</body>
</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>Dein Team · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/team.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<!-- `data-buehne` steht hier fest und nicht im Skript: Die Kachel zu
dieser Seite kommt vom Server, `zuSeite()` in bereiche.js findet
sie deshalb nicht -- und ohne Fund griff der Rueckfall, also die
Szene der anderen Marke. Eine Seite mit genau einer Buehne
braucht dafuer kein Skript. -->
<body class="start" data-buehne="eingang">
<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> · Dein Team</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">
<!-- ==== DER KOPF ================================================
Er sagt, was diese Seite ist UND was sie nicht ist. Der zweite
Teil ist der wichtigere -- dieselbe Ueberlegung steht schon
ueber team.html: Eine Seite mit Zahlen ueber Kollegen wird sonst
als Kontrolle gelesen, und dann arbeitet niemand mehr offen
damit.
"Offen" heisst hier deshalb ausdruecklich: darueber habt ihr
noch nicht geredet. Es ist eine Liste fuer euch beide, keine
Note fuer den anderen. -->
<section class="t-kachel">
<div class="t-kopf">
<div class="t-kopf__text">
<p class="feldschild">Zusammen</p>
<h1 class="t-kopf__titel">Was auf dich wartet</h1>
<p class="t-kopf__unter" id="kopf-unter">…</p>
<p class="t-kopf__grenze">
Was hier steht, ist eine Merkliste für euch beide – keine Bewertung
von Menschen. „Offen“ heißt: darüber habt ihr noch nicht gesprochen.
Eingeschätzt wird dort, wo die Punkte stehen; jede Zahl führt dorthin.
</p>
</div>
</div>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
</section>
<section class="t-lage" id="lage" aria-busy="true"></section>
</main>
<!-- wahl.js VOR kopf.js (nachgetragen 10.09.2026).
kopf.js baut den Sicht-Umschalter; ohne wahl.js sieht er aus wie
ein blankes Browser-Auswahlfeld statt wie der Rest des Hauses.
Kaputt ist dabei nichts -- er funktioniert. Genau deshalb faellt
es niemandem auf, und deshalb prueft pruef-css-klassen die
ABHAENGIGKEIT statt der Optik. Hier hat sie angeschlagen. -->
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/teamlage.js?v=202609221415" defer></script>
</body>
</html>
workspace/teilen.html
+125 -123
View File
@@ -1,123 +1,125 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Video übernehmen · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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">Team&nbsp;Dogi</a> · Video übernehmen</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">
<!-- ==================================================================
AUS „TEILEN" WIRD EIN TIPP (17.09.2026)
Schritt 4 aus dem Video-Plan.
Filipe postet ein Video auf dem Handy. Bisher hätte er den Link
kopieren, die App öffnen, den richtigen Bereich suchen und das
Feld finden müssen – fünf Schritte, von denen jeder einzelne der
Grund sein kann, es später zu machen. Und später heißt nie.
Jetzt: in TikTok auf „Teilen", „DogFather" wählen, fertig. Diese
Seite ist das Ziel dieses Tipps.
WARUM SIE NICHT SOFORT EINTRÄGT: Weil sie nicht wissen kann, ob
der Griff in die Tasche gemeint war. Ein Video, das ungefragt in
den Highlights landet, muss jemand wieder löschen – und das ist
mehr Arbeit als ein Tipp auf „Übernehmen". Sie zeigt also, was
sie verstanden hat, und wartet auf eine Bestätigung.
WOHIN, IST EINE FRAGE UND KEINE ANNAHME: Highlights sind
vorausgewählt, weil dort die Videos hingehören. Aber ein Clip
kann auch eine Antwort auf einen Wunsch sein.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Geteilt</p>
<h1 class="titel">Video übernehmen</h1>
<p class="unterzeile">
Titel und Coverbild werden von TikTok geholt – du musst nichts abtippen.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<section class="tl-seite" id="teilen" aria-busy="true">
<p class="leise" id="ladezeile">einen Moment …</p>
<!-- Was angekommen ist. Steht ganz oben, weil es die erste Frage
beantwortet: „hat er den richtigen Link erwischt?" -->
<div class="tl-fund" id="fund" hidden>
<p class="tl-label">Dieser Link ist angekommen:</p>
<p class="tl-url" id="url-text"></p>
</div>
<!-- Wohin. -->
<div class="tl-wahl" id="wahl" hidden>
<p class="tl-label" id="wohin-label">Wohin soll es?</p>
<div class="tl-bretter" role="group" aria-labelledby="wohin-label" id="bretter"></div>
</div>
<div class="tl-knoepfe" id="knoepfe" hidden>
<button type="button" class="knopf" id="uebernehmen">Übernehmen</button>
<a class="schritt" href="start.html" id="abbrechen">Doch nicht</a>
</div>
<!-- Wenn gar kein Link dabei war. Kein Formular als Strafe, sondern
ein Feld zum Einfügen – man ist ja schon hier. -->
<div class="tl-haendisch" id="haendisch" hidden>
<label class="tl-label" for="eingabe">Link zum Video</label>
<input type="url" id="eingabe" inputmode="url" autocomplete="off"
placeholder="https://www.tiktok.com/@dogfather0804/video/…" />
</div>
<!-- Das Ergebnis. -->
<div class="tl-fertig" id="fertig" hidden>
<p class="tl-fertig-satz" id="fertig-satz"></p>
<div class="tl-knoepfe">
<a class="knopf" id="hin" href="start.html">Ansehen</a>
<a class="schritt" href="start.html">Fertig</a>
</div>
</div>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/teilen.js?v=202609221359" defer></script>
</body>
</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>Video übernehmen · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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">Team&nbsp;Dogi</a> · Video übernehmen</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">
<!-- ==================================================================
AUS „TEILEN" WIRD EIN TIPP (17.09.2026)
Schritt 4 aus dem Video-Plan.
Filipe postet ein Video auf dem Handy. Bisher hätte er den Link
kopieren, die App öffnen, den richtigen Bereich suchen und das
Feld finden müssen – fünf Schritte, von denen jeder einzelne der
Grund sein kann, es später zu machen. Und später heißt nie.
Jetzt: in TikTok auf „Teilen", „DogFather" wählen, fertig. Diese
Seite ist das Ziel dieses Tipps.
WARUM SIE NICHT SOFORT EINTRÄGT: Weil sie nicht wissen kann, ob
der Griff in die Tasche gemeint war. Ein Video, das ungefragt in
den Highlights landet, muss jemand wieder löschen – und das ist
mehr Arbeit als ein Tipp auf „Übernehmen". Sie zeigt also, was
sie verstanden hat, und wartet auf eine Bestätigung.
WOHIN, IST EINE FRAGE UND KEINE ANNAHME: Highlights sind
vorausgewählt, weil dort die Videos hingehören. Aber ein Clip
kann auch eine Antwort auf einen Wunsch sein.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Geteilt</p>
<h1 class="titel">Video übernehmen</h1>
<p class="unterzeile">
Titel und Coverbild werden von TikTok geholt – du musst nichts abtippen.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<section class="tl-seite" id="teilen" aria-busy="true">
<p class="leise" id="ladezeile">einen Moment …</p>
<!-- Was angekommen ist. Steht ganz oben, weil es die erste Frage
beantwortet: „hat er den richtigen Link erwischt?" -->
<div class="tl-fund" id="fund" hidden>
<p class="tl-label">Dieser Link ist angekommen:</p>
<p class="tl-url" id="url-text"></p>
</div>
<!-- Wohin. -->
<div class="tl-wahl" id="wahl" hidden>
<p class="tl-label" id="wohin-label">Wohin soll es?</p>
<div class="tl-bretter" role="group" aria-labelledby="wohin-label" id="bretter"></div>
</div>
<div class="tl-knoepfe" id="knoepfe" hidden>
<button type="button" class="knopf" id="uebernehmen">Übernehmen</button>
<a class="schritt" href="start.html" id="abbrechen">Doch nicht</a>
</div>
<!-- Wenn gar kein Link dabei war. Kein Formular als Strafe, sondern
ein Feld zum Einfügen – man ist ja schon hier. -->
<div class="tl-haendisch" id="haendisch" hidden>
<label class="tl-label" for="eingabe">Link zum Video</label>
<input type="url" id="eingabe" inputmode="url" autocomplete="off"
placeholder="https://www.tiktok.com/@dogfather0804/video/…" />
</div>
<!-- Das Ergebnis. -->
<div class="tl-fertig" id="fertig" hidden>
<p class="tl-fertig-satz" id="fertig-satz"></p>
<div class="tl-knoepfe">
<a class="knopf" id="hin" href="start.html">Ansehen</a>
<a class="schritt" href="start.html">Fertig</a>
</div>
</div>
</section>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/teilen.js?v=202609221415" defer></script>
</body>
</html>
workspace/treff-moderation.html
+15 -14
View File
@@ -7,14 +7,14 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -126,12 +126,13 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/treff-moderation.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/treff-moderation.js?v=202609221415" defer></script>
</body>
</html>
workspace/treff-regeln.html
+233 -231
View File
@@ -1,231 +1,233 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Die Regeln · Der Treff</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein. Auf der Adresse des
Treffs biegt der Server genau diesen Dateinamen auf crew-haus.css
um, und die Seite kommt schon beim ERSTEN Abruf in Lila und
Babyblau an -- ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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">Der&nbsp;Treff</a> · Regeln</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">Der Treff</p>
<!-- HIESS BIS ZUM 18.09.2026 „Regeln & Hilfe" -- genau wie das
BRETT, auf das der Absatz weiter unten verweist. Auf dem
Brett stand damit ein Link „Regeln & Hilfe", der auf eine
Seite namens „Regeln & Hilfe" fuehrte; wer ihn drueckte,
glaubte, im Kreis gelaufen zu sein.
Die beiden sind verschiedene Dinge: Hier stehen die fuenf
Regeln, kurz und fest. Das Brett sammelt daneben haeufige
Fragen, Hilfe und was im Einzelfall passiert. Zwei Namen
fuer zwei Sachen. -->
<h1 class="titel">Die Regeln</h1>
<p class="unterzeile">
Kurz, in normaler Sprache, und alles, was hier steht, gilt auch.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ==================================================================
WARUM DER TEXT HIER STEHT UND DIE ZAHLEN NICHT
Die Saetze sind Text und gehoeren in eine Datei. Die ZAHLEN
darin (sieben Tage, dreissig Tage, drei Beitraege, drei
Anschlaege, 18 Jahre) kommen vom Server -- sie stehen im Code,
und ein Regeltext, der eine andere Zahl nennt als die Regel, ist
schlimmer als gar keiner: Niemand merkt es, und wer es merkt,
glaubt dem Text.
Die Platzhalter tragen deshalb "…" als Vorgabe. Kommt die
Antwort nicht, steht dort sichtbar nichts -- und nicht
versehentlich eine Zahl von gestern.
============================================================== -->
<section class="treff-abschnitt" id="willkommen">
<h2 class="treff-abschnitt__titel">Schön, dass du da bist</h2>
<div class="treff-abschnitt__inhalt">
<p>
Der Treff ist der Ort rund um DogFather: Hier steht, was gerade gilt,
was ansteht, und hier redet ihr miteinander. Er ist nicht öffentlich –
du bist hier, weil dir jemand einen Code gegeben hat.
</p>
<p class="leise">
Gib diesen Code nicht weiter. Er gehört zu dir, und was damit
geschrieben wird, steht unter deinem Namen.
</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Die fünf Regeln</h2>
<div class="treff-abschnitt__inhalt">
<ol class="regel-liste">
<li><strong>Sei anständig.</strong> Keine Beleidigungen, keine Angriffe
auf Menschen, keine Hetze. Streiten über eine Sache ist in Ordnung –
über einen Menschen nicht.</li>
<li><strong>Keine privaten Daten.</strong> Keine Adressen, keine
Telefonnummern, keine Klarnamen von anderen. Auch nicht von dir
selbst, es liest mehr mit, als du denkst.</li>
<li><strong>Nichts Fremdes hochladen.</strong> Was du einstellst, muss
von dir sein oder dir gehören.</li>
<li><strong>Keine Werbung, kein Verkauf.</strong> Auch nicht für
andere Streams.</li>
<li><strong>Was hier passiert, bleibt hier.</strong> Keine
Bildschirmfotos nach draußen.</li>
</ol>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Wie du weiterkommst</h2>
<div class="treff-abschnitt__inhalt">
<p>
In der ersten Zeit kannst du lesen und bei Wünschen mitstimmen.
Das ist kein Misstrauen gegen dich – es ist eines gegen
Wegwerf-Zugänge.
</p>
<ul class="regel-liste" id="stufen">
<li class="leise">wird geladen …</li>
</ul>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Wenn etwas nicht stimmt</h2>
<div class="treff-abschnitt__inhalt">
<p>
An jedem Beitrag, der nicht von dir ist, steht <strong>melden</strong>.
Schreib in einem Satz, was daran nicht in Ordnung ist – ohne das
können wir es nicht prüfen.
</p>
<p>
Wir sehen uns jede Meldung an. Wird ein Beitrag entfernt, halten wir
fest, <strong>warum</strong> – und die Person, die ihn geschrieben hat,
erfährt den Grund. Das ist keine Höflichkeit, sondern
<span class="leise">Artikel 17 des Digital Services Act</span>.
</p>
<p class="leise" id="kontakt">
Du erreichst uns außerdem direkt: Schreib es auf das Brett
<a href="bereich.html?b=treff">Der Treff</a> oder sag es <span
id="kontakt-wem">jemandem aus dem Team</span>.
</p>
<p class="leise">
Häufige Fragen und Antworten stehen auf dem Brett
<a href="bereich.html?b=regeln">Regeln &amp; Hilfe</a>.
</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Was passiert, wenn jemand sich nicht daran hält</h2>
<div class="treff-abschnitt__inhalt">
<p>Wir gehen der Reihe nach vor, und niemand fliegt ohne Ansage:</p>
<ol class="regel-liste">
<li><strong>Hinweis.</strong> Jemand sagt dir, was nicht ging.</li>
<li><strong>Pause.</strong> Ein paar Tage nichts schreiben. Lesen
geht weiter.</li>
<li><strong>Ende.</strong> Der Zugang wird geschlossen.</li>
</ol>
<p class="leise" id="ausschluss">…</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Das Kleingedruckte – kurz</h2>
<div class="treff-abschnitt__inhalt">
<p id="alter">…</p>
<p>
<strong>Was gespeichert wird:</strong> dein Name, dein Zugangscode
(verschlüsselt, niemand kann ihn lesen), was du schreibst, und wann
du dich anmeldest. Mehr nicht – kein Standort, keine Werbe-IDs,
keine Weitergabe an Dritte.
</p>
<p>
<strong>Du willst weg?</strong> Sag Bescheid. Dein Zugang wird
geschlossen und deine Beiträge werden entfernt.
</p>
<p class="leise">
Der Treff ist ein kleiner, geschlossener Bereich. Es gibt keine
Direktnachrichten zwischen Mitgliedern – absichtlich: Ein
öffentlicher Raum lässt sich moderieren, ein privater nicht.
</p>
</div>
</section>
<!-- ==== WAS IST ÜBER MICH GESPEICHERT? (15.09.2026) ==============
Art. 15 DSGVO. Kein Antrag, kein Formular, kein Warten – ein
Knopf. Er steht auf den beiden Seiten, die einem Menschen selbst
gehören: dem Steckbrief und den Treff-Regeln. Die Community hat
keinen Steckbrief; ohne die zweite Stelle hätte ausgerechnet die
Gruppe mit den wenigsten Rechten auch diesen nicht. -->
<section class="meine-daten">
<div class="meine-daten__kopf">
<h2 class="meine-daten__titel">Was ist über mich gespeichert?</h2>
<button type="button" class="knopf-still" id="auskunft-knopf">Datei herunterladen</button>
</div>
<p class="meine-daten__satz">
Alles, was dieser Workspace über dich weiß, als Datei zum Mitnehmen.
Zugangsgeheimnisse sind nicht dabei, und wo andere Menschen vorkommen,
stehen sie nicht mit Namen darin – ihre Daten gehören ihnen.
</p>
<p class="leise" id="auskunft-stand" hidden></p>
</section>
</main>
<!-- WER kopf.js LAEDT, MUSS AUCH wahl.js LADEN (Regel seit 07.09.2026).
Der Umschalter "Meine Sicht" in der Kopfleiste ist ein selbst
gebautes Bedienelement; dahinter liegt ein unsichtbares Systemfeld
fuer Vorleseprogramme. Ohne wahl.js faellt kopf.js auf dieses Feld
zurueck -- ein grauer Kasten von 92 x 19 Pixeln mit weisser
Schrift, mitten in einer dunklen Leiste.
Beim ersten Anlauf fehlte die Zeile auf genau diesen beiden neuen
Seiten. Gefunden hat das nicht das Auge, sondern pruef-css-klassen,
die seit dem 07.09. jede Seite danach absucht. -->
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/auskunft.js?v=202609221359" defer></script>
<script src="assets/js/treff-regeln.js?v=202609221359" defer></script>
</body>
</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>Die Regeln · Der Treff</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein. Auf der Adresse des
Treffs biegt der Server genau diesen Dateinamen auf crew-haus.css
um, und die Seite kommt schon beim ERSTEN Abruf in Lila und
Babyblau an -- ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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">Der&nbsp;Treff</a> · Regeln</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">Der Treff</p>
<!-- HIESS BIS ZUM 18.09.2026 „Regeln & Hilfe" -- genau wie das
BRETT, auf das der Absatz weiter unten verweist. Auf dem
Brett stand damit ein Link „Regeln & Hilfe", der auf eine
Seite namens „Regeln & Hilfe" fuehrte; wer ihn drueckte,
glaubte, im Kreis gelaufen zu sein.
Die beiden sind verschiedene Dinge: Hier stehen die fuenf
Regeln, kurz und fest. Das Brett sammelt daneben haeufige
Fragen, Hilfe und was im Einzelfall passiert. Zwei Namen
fuer zwei Sachen. -->
<h1 class="titel">Die Regeln</h1>
<p class="unterzeile">
Kurz, in normaler Sprache, und alles, was hier steht, gilt auch.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ==================================================================
WARUM DER TEXT HIER STEHT UND DIE ZAHLEN NICHT
Die Saetze sind Text und gehoeren in eine Datei. Die ZAHLEN
darin (sieben Tage, dreissig Tage, drei Beitraege, drei
Anschlaege, 18 Jahre) kommen vom Server -- sie stehen im Code,
und ein Regeltext, der eine andere Zahl nennt als die Regel, ist
schlimmer als gar keiner: Niemand merkt es, und wer es merkt,
glaubt dem Text.
Die Platzhalter tragen deshalb "…" als Vorgabe. Kommt die
Antwort nicht, steht dort sichtbar nichts -- und nicht
versehentlich eine Zahl von gestern.
============================================================== -->
<section class="treff-abschnitt" id="willkommen">
<h2 class="treff-abschnitt__titel">Schön, dass du da bist</h2>
<div class="treff-abschnitt__inhalt">
<p>
Der Treff ist der Ort rund um DogFather: Hier steht, was gerade gilt,
was ansteht, und hier redet ihr miteinander. Er ist nicht öffentlich –
du bist hier, weil dir jemand einen Code gegeben hat.
</p>
<p class="leise">
Gib diesen Code nicht weiter. Er gehört zu dir, und was damit
geschrieben wird, steht unter deinem Namen.
</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Die fünf Regeln</h2>
<div class="treff-abschnitt__inhalt">
<ol class="regel-liste">
<li><strong>Sei anständig.</strong> Keine Beleidigungen, keine Angriffe
auf Menschen, keine Hetze. Streiten über eine Sache ist in Ordnung –
über einen Menschen nicht.</li>
<li><strong>Keine privaten Daten.</strong> Keine Adressen, keine
Telefonnummern, keine Klarnamen von anderen. Auch nicht von dir
selbst, es liest mehr mit, als du denkst.</li>
<li><strong>Nichts Fremdes hochladen.</strong> Was du einstellst, muss
von dir sein oder dir gehören.</li>
<li><strong>Keine Werbung, kein Verkauf.</strong> Auch nicht für
andere Streams.</li>
<li><strong>Was hier passiert, bleibt hier.</strong> Keine
Bildschirmfotos nach draußen.</li>
</ol>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Wie du weiterkommst</h2>
<div class="treff-abschnitt__inhalt">
<p>
In der ersten Zeit kannst du lesen und bei Wünschen mitstimmen.
Das ist kein Misstrauen gegen dich – es ist eines gegen
Wegwerf-Zugänge.
</p>
<ul class="regel-liste" id="stufen">
<li class="leise">wird geladen …</li>
</ul>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Wenn etwas nicht stimmt</h2>
<div class="treff-abschnitt__inhalt">
<p>
An jedem Beitrag, der nicht von dir ist, steht <strong>melden</strong>.
Schreib in einem Satz, was daran nicht in Ordnung ist – ohne das
können wir es nicht prüfen.
</p>
<p>
Wir sehen uns jede Meldung an. Wird ein Beitrag entfernt, halten wir
fest, <strong>warum</strong> – und die Person, die ihn geschrieben hat,
erfährt den Grund. Das ist keine Höflichkeit, sondern
<span class="leise">Artikel 17 des Digital Services Act</span>.
</p>
<p class="leise" id="kontakt">
Du erreichst uns außerdem direkt: Schreib es auf das Brett
<a href="bereich.html?b=treff">Der Treff</a> oder sag es <span
id="kontakt-wem">jemandem aus dem Team</span>.
</p>
<p class="leise">
Häufige Fragen und Antworten stehen auf dem Brett
<a href="bereich.html?b=regeln">Regeln &amp; Hilfe</a>.
</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Was passiert, wenn jemand sich nicht daran hält</h2>
<div class="treff-abschnitt__inhalt">
<p>Wir gehen der Reihe nach vor, und niemand fliegt ohne Ansage:</p>
<ol class="regel-liste">
<li><strong>Hinweis.</strong> Jemand sagt dir, was nicht ging.</li>
<li><strong>Pause.</strong> Ein paar Tage nichts schreiben. Lesen
geht weiter.</li>
<li><strong>Ende.</strong> Der Zugang wird geschlossen.</li>
</ol>
<p class="leise" id="ausschluss">…</p>
</div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Das Kleingedruckte – kurz</h2>
<div class="treff-abschnitt__inhalt">
<p id="alter">…</p>
<p>
<strong>Was gespeichert wird:</strong> dein Name, dein Zugangscode
(verschlüsselt, niemand kann ihn lesen), was du schreibst, und wann
du dich anmeldest. Mehr nicht – kein Standort, keine Werbe-IDs,
keine Weitergabe an Dritte.
</p>
<p>
<strong>Du willst weg?</strong> Sag Bescheid. Dein Zugang wird
geschlossen und deine Beiträge werden entfernt.
</p>
<p class="leise">
Der Treff ist ein kleiner, geschlossener Bereich. Es gibt keine
Direktnachrichten zwischen Mitgliedern – absichtlich: Ein
öffentlicher Raum lässt sich moderieren, ein privater nicht.
</p>
</div>
</section>
<!-- ==== WAS IST ÜBER MICH GESPEICHERT? (15.09.2026) ==============
Art. 15 DSGVO. Kein Antrag, kein Formular, kein Warten – ein
Knopf. Er steht auf den beiden Seiten, die einem Menschen selbst
gehören: dem Steckbrief und den Treff-Regeln. Die Community hat
keinen Steckbrief; ohne die zweite Stelle hätte ausgerechnet die
Gruppe mit den wenigsten Rechten auch diesen nicht. -->
<section class="meine-daten">
<div class="meine-daten__kopf">
<h2 class="meine-daten__titel">Was ist über mich gespeichert?</h2>
<button type="button" class="knopf-still" id="auskunft-knopf">Datei herunterladen</button>
</div>
<p class="meine-daten__satz">
Alles, was dieser Workspace über dich weiß, als Datei zum Mitnehmen.
Zugangsgeheimnisse sind nicht dabei, und wo andere Menschen vorkommen,
stehen sie nicht mit Namen darin – ihre Daten gehören ihnen.
</p>
<p class="leise" id="auskunft-stand" hidden></p>
</section>
</main>
<!-- WER kopf.js LAEDT, MUSS AUCH wahl.js LADEN (Regel seit 07.09.2026).
Der Umschalter "Meine Sicht" in der Kopfleiste ist ein selbst
gebautes Bedienelement; dahinter liegt ein unsichtbares Systemfeld
fuer Vorleseprogramme. Ohne wahl.js faellt kopf.js auf dieses Feld
zurueck -- ein grauer Kasten von 92 x 19 Pixeln mit weisser
Schrift, mitten in einer dunklen Leiste.
Beim ersten Anlauf fehlte die Zeile auf genau diesen beiden neuen
Seiten. Gefunden hat das nicht das Auge, sondern pruef-css-klassen,
die seit dem 07.09. jede Seite danach absucht. -->
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/auskunft.js?v=202609221415" defer></script>
<script src="assets/js/treff-regeln.js?v=202609221415" defer></script>
</body>
</html>
workspace/uebersicht.html
+164 -162
View File
@@ -1,162 +1,164 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Dashboard · 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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<!-- Formular- und Dialogstile: seit dem 07.09.2026 steht hier der
Dialog "Creator anlegen". -->
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Dashboard</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">Alles zentral</p>
<h1 class="titel" id="titel">Dashboard</h1>
<p class="unterzeile" id="unterzeile">
Eine Karte je Creator – mit einem Blick sehen, wo es hakt und wo es läuft.
</p>
</div>
<!-- Der Knopf steht HIER und nicht in der Personenverwaltung
(07.09.2026). Ein Manager kommt dort gar nicht hinein, und er
soll es auch nicht -- dahinter liegen Rollen, Codes, Sperren und
das Protokoll. Hier dagegen sieht er ohnehin seine Creator; der
neue erscheint eine Zeile weiter unten. Das Skript blendet den
Knopf für Scouts und Creator aus, der Server lässt sie ohnehin
nicht durch. -->
<button type="button" class="knopf knopf--klein" id="creator-neu" hidden>Creator anlegen</button>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Creator anlegen. Derselbe Dialog-Aufbau wie überall sonst. -->
<dialog class="dialog" id="creator-dialog">
<form method="dialog" class="neu neu--blank" id="creator-form">
<h2 class="dialog__titel">Creator anlegen</h2>
<p class="dialog__unter">
Der Zugangscode erscheint genau einmal – danach ist er weg und
kann nur neu gesetzt werden.
</p>
<div class="neu__zeile">
<label class="feld-schild" for="cn-name">Name</label>
<input id="cn-name" maxlength="60" required autocomplete="off" />
</div>
<div class="neu__zeile" id="cn-scout-zeile" hidden>
<label class="feld-schild" for="cn-scout">Betreuung</label>
<select id="cn-scout"></select>
<p class="feld-hinweis">
Ohne Auswahl betreust du ihn selbst. Zur Auswahl stehen nur
deine eigenen Scouts.
</p>
</div>
<!-- Der Code. Steht erst nach dem Anlegen da und wird nie
nachgeladen -- die Seite ist die einzige Stelle, an der er je
zu sehen ist. -->
<div class="neu__zeile" id="cn-code-zeile" hidden>
<p class="feld-schild">Zugangscode für <span id="cn-code-name"></span></p>
<p class="code-anzeige" id="cn-code"></p>
<p class="feld-hinweis">
Jetzt weitergeben. Nach dem Schließen ist er nicht mehr abrufbar.
</p>
</div>
<p class="fehler" id="cn-fehler" role="alert" aria-live="polite"></p>
<div class="dialog__knoepfe">
<button type="submit" class="knopf knopf--klein" id="cn-speichern">Anlegen</button>
<button type="button" class="abmelden" id="cn-zu">Schließen</button>
</div>
</form>
</dialog>
<!-- FRÜHWARNUNG (06.09.2026).
Steht GANZ OBEN, noch vor den Summen. Die Summen beantworten "wie
steht es insgesamt", die Karten "wie steht es bei jedem" – aber
die Frage, mit der ein Betreuer morgens ankommt, ist eine dritte:
"wo muss ich HEUTE hin?" Sie stand bis jetzt nirgends.
Bewusst OHNE Punktzahl. Ein Wert wie "Abwanderungsrisiko 73"
klingt nach Wissenschaft und ist eine Behauptung: Man kann ihn
nicht prüfen, nicht widersprechen und nicht erklären. Hier stehen
stattdessen die einzelnen Beobachtungen im Klartext, jede mit
ihrem Beleg – dann entscheidet ein Mensch.
Ein Creator sieht diesen Block nie (der Server liefert ihm gar
keine Daten). Zu lesen, dass ein System einen für gefährdet hält,
ist keine Mitteilung an die betroffene Person. -->
<section class="warnblock" id="fruehwarnung" hidden aria-labelledby="warn-titel">
<div class="klapp-kopf">
<h2 class="feldschild" id="warn-titel">Wo ich diese Woche nachfassen würde</h2>
</div>
<div class="warnliste" id="warnliste"></div>
</section>
<!-- Summen über alle sichtbaren Creator. Steht oben, weil die Frage
"wie steht es insgesamt" vor der Frage "bei wem" kommt. -->
<section class="summen" id="summen" hidden></section>
<div id="liste" aria-busy="true"><p class="leise">Übersicht wird geladen …</p></div>
<p class="stand" id="stand" hidden></p>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/uebersicht.js?v=202609221359" defer></script>
</body>
</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>Dashboard · 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?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<!-- Formular- und Dialogstile: seit dem 07.09.2026 steht hier der
Dialog "Creator anlegen". -->
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
Pseudo-Elements -- body hat nur ::before und ::after. -->
<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> · Dashboard</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">Alles zentral</p>
<h1 class="titel" id="titel">Dashboard</h1>
<p class="unterzeile" id="unterzeile">
Eine Karte je Creator – mit einem Blick sehen, wo es hakt und wo es läuft.
</p>
</div>
<!-- Der Knopf steht HIER und nicht in der Personenverwaltung
(07.09.2026). Ein Manager kommt dort gar nicht hinein, und er
soll es auch nicht -- dahinter liegen Rollen, Codes, Sperren und
das Protokoll. Hier dagegen sieht er ohnehin seine Creator; der
neue erscheint eine Zeile weiter unten. Das Skript blendet den
Knopf für Scouts und Creator aus, der Server lässt sie ohnehin
nicht durch. -->
<button type="button" class="knopf knopf--klein" id="creator-neu" hidden>Creator anlegen</button>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- Creator anlegen. Derselbe Dialog-Aufbau wie überall sonst. -->
<dialog class="dialog" id="creator-dialog">
<form method="dialog" class="neu neu--blank" id="creator-form">
<h2 class="dialog__titel">Creator anlegen</h2>
<p class="dialog__unter">
Der Zugangscode erscheint genau einmal – danach ist er weg und
kann nur neu gesetzt werden.
</p>
<div class="neu__zeile">
<label class="feld-schild" for="cn-name">Name</label>
<input id="cn-name" maxlength="60" required autocomplete="off" />
</div>
<div class="neu__zeile" id="cn-scout-zeile" hidden>
<label class="feld-schild" for="cn-scout">Betreuung</label>
<select id="cn-scout"></select>
<p class="feld-hinweis">
Ohne Auswahl betreust du ihn selbst. Zur Auswahl stehen nur
deine eigenen Scouts.
</p>
</div>
<!-- Der Code. Steht erst nach dem Anlegen da und wird nie
nachgeladen -- die Seite ist die einzige Stelle, an der er je
zu sehen ist. -->
<div class="neu__zeile" id="cn-code-zeile" hidden>
<p class="feld-schild">Zugangscode für <span id="cn-code-name"></span></p>
<p class="code-anzeige" id="cn-code"></p>
<p class="feld-hinweis">
Jetzt weitergeben. Nach dem Schließen ist er nicht mehr abrufbar.
</p>
</div>
<p class="fehler" id="cn-fehler" role="alert" aria-live="polite"></p>
<div class="dialog__knoepfe">
<button type="submit" class="knopf knopf--klein" id="cn-speichern">Anlegen</button>
<button type="button" class="abmelden" id="cn-zu">Schließen</button>
</div>
</form>
</dialog>
<!-- FRÜHWARNUNG (06.09.2026).
Steht GANZ OBEN, noch vor den Summen. Die Summen beantworten "wie
steht es insgesamt", die Karten "wie steht es bei jedem" – aber
die Frage, mit der ein Betreuer morgens ankommt, ist eine dritte:
"wo muss ich HEUTE hin?" Sie stand bis jetzt nirgends.
Bewusst OHNE Punktzahl. Ein Wert wie "Abwanderungsrisiko 73"
klingt nach Wissenschaft und ist eine Behauptung: Man kann ihn
nicht prüfen, nicht widersprechen und nicht erklären. Hier stehen
stattdessen die einzelnen Beobachtungen im Klartext, jede mit
ihrem Beleg – dann entscheidet ein Mensch.
Ein Creator sieht diesen Block nie (der Server liefert ihm gar
keine Daten). Zu lesen, dass ein System einen für gefährdet hält,
ist keine Mitteilung an die betroffene Person. -->
<section class="warnblock" id="fruehwarnung" hidden aria-labelledby="warn-titel">
<div class="klapp-kopf">
<h2 class="feldschild" id="warn-titel">Wo ich diese Woche nachfassen würde</h2>
</div>
<div class="warnliste" id="warnliste"></div>
</section>
<!-- Summen über alle sichtbaren Creator. Steht oben, weil die Frage
"wie steht es insgesamt" vor der Frage "bei wem" kommt. -->
<section class="summen" id="summen" hidden></section>
<div id="liste" aria-busy="true"><p class="leise">Übersicht wird geladen …</p></div>
<p class="stand" id="stand" hidden></p>
</main>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/uebersicht.js?v=202609221415" defer></script>
</body>
</html>
workspace/unsere-seiten.html
+14 -13
View File
@@ -7,13 +7,13 @@
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/unsere-seiten.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/unsere-seiten.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -335,12 +335,13 @@
</main>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/live.js?v=202609221359" defer></script>
<script src="assets/js/unsere-seiten.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/live.js?v=202609221415" defer></script>
<script src="assets/js/unsere-seiten.js?v=202609221415" defer></script>
</body>
</html>
workspace/werdegang.html
+156 -154
View File
@@ -1,154 +1,156 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Entwicklung · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/werdegang.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
</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">Team&nbsp;Dogi</a> · Entwicklung</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">
<!-- ==================================================================
ENTWICKLUNG — die Auswertung je Person (19.09.2026)
Filipe: „dan perfektionierst du eine neue wo diagramme texte und
so zu jedem modi gemacht wird und diese kategorie kannst du
entwicklung nenen."
DIESE SEITE HAT ZWEI GESICHTER, und welches man sieht, entscheidet
der Server:
Leitung -> die Karten aller, die eine haben
Ein Modi -> ausschliesslich die Bewegung in der EIGENEN Karte,
ohne Namen, ohne Anlass, ohne wer-hat-was
WAS HIER NICHT STEHT UND NIE STEHEN WIRD: eine Punktzahl, ein
Prozentwert, ein Durchschnitt, eine Rangliste, ein Vergleich
zwischen zwei Menschen. Eine Zahl ueber einen Menschen wird
gelesen, verglichen und weitererzaehlt — gebraucht wird ein
Gespraechsanlass.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Entwicklung &amp; Nachwuchs</p>
<h1 class="titel" id="titel">Entwicklung</h1>
<p class="unterzeile" id="unterzeile">
Wie sich jemand über die Zeit bewegt. Keine Note, kein Vergleich –
jede Karte nur mit sich selbst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ---- Die Liste (nur Leitung) ---------------------------------- -->
<section id="liste-block" hidden>
<p class="w-hinweis" id="liste-hinweis"></p>
<div id="liste" class="w-liste" aria-busy="true">
<p class="leise">wird geladen …</p>
</div>
</section>
<!-- ---- Eine Karte (nur Leitung) --------------------------------- -->
<section id="karte-block" hidden>
<button type="button" class="knopf knopf--still knopf--klein" id="zur-liste">
← Alle Karten
</button>
<h2 class="w-name" id="karte-name">…</h2>
<p class="w-satz" id="karte-satz">…</p>
<!-- Diagramm 1: Bewegung. Zwei Richtungen um eine Nulllinie —
vorwaerts und rueckwaerts sind dieselbe Groesse mit
verschiedenem Vorzeichen, nicht zwei Themen. -->
<section class="w-teil" id="bewegung-block">
<h3 class="e-abschnitt">Was sich bewegt hat</h3>
<p class="w-teil__satz" id="bewegung-satz"></p>
<div id="bewegung"></div>
</section>
<!-- Diagramm 2: der Streifen. Eine Zeile je Punkt, eine Spalte je
Monat. Das Zeichen sagt die Stufe, die Farbe verstaerkt nur. -->
<section class="w-teil" id="streifen-block">
<h3 class="e-abschnitt">Punkt für Punkt, Monat für Monat</h3>
<p class="w-teil__satz" id="streifen-satz"></p>
<div id="streifen" class="w-streifen"></div>
</section>
<!-- Die Texte. Reihenfolge ist Absicht: erst was sich bewegt hat,
dann was traegt, erst danach was liegt. -->
<section class="w-teil" id="texte-block">
<h3 class="e-abschnitt">Was dazu zu sagen ist</h3>
<div id="texte"></div>
</section>
<p class="w-fuss">
Auf dieser Seite gibt es keine Punktzahl und keinen Vergleich zwischen
Personen. Was hier steht, ist ein Gesprächsanlass – kein Zeugnis.
Einschätzungen setzt und ändert man im Katalog:
<a href="entwicklung.html">Eure Aufgaben</a>.
</p>
</section>
<!-- ---- Die eigene Sicht (Modi) ---------------------------------- -->
<!-- ==================================================================
WAS DER MENSCH SELBST SIEHT.
Hier steht kein fremder Name, keine Beobachtung über jemand
anderen und kein Anlasstext. Nur: ob sich etwas bewegt hat.
Die Lesehilfe und die zwei Wege am Ende sind am 19.09.2026
dazugekommen. Vorher standen hier Balken ohne Erklärung und ein
„Frag danach" ohne Adressaten – eine Sackgasse mit freundlichem
Ton.
============================================================== -->
<section id="mich-block" hidden>
<h2 class="e-abschnitt">Deine Entwicklung</h2>
<p class="w-satz" id="mich-satz">…</p>
<p class="w-lesehilfe" id="mich-lesehilfe" hidden></p>
<div id="mich-bewegung"></div>
<p class="w-fuss" id="mich-hinweis"></p>
<div class="w-wege" id="mich-wege" hidden></div>
</section>
</main>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>␍
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/werdegang.js?v=202609221359" defer></script>
</body>
</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>Entwicklung · Spicy &amp; Dogi</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/entwicklung.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/werdegang.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</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">Team&nbsp;Dogi</a> · Entwicklung</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">
<!-- ==================================================================
ENTWICKLUNG — die Auswertung je Person (19.09.2026)
Filipe: „dan perfektionierst du eine neue wo diagramme texte und
so zu jedem modi gemacht wird und diese kategorie kannst du
entwicklung nenen."
DIESE SEITE HAT ZWEI GESICHTER, und welches man sieht, entscheidet
der Server:
Leitung -> die Karten aller, die eine haben
Ein Modi -> ausschliesslich die Bewegung in der EIGENEN Karte,
ohne Namen, ohne Anlass, ohne wer-hat-was
WAS HIER NICHT STEHT UND NIE STEHEN WIRD: eine Punktzahl, ein
Prozentwert, ein Durchschnitt, eine Rangliste, ein Vergleich
zwischen zwei Menschen. Eine Zahl ueber einen Menschen wird
gelesen, verglichen und weitererzaehlt — gebraucht wird ein
Gespraechsanlass.
============================================================== -->
<section class="kopf-zeile">
<div>
<p class="marke">Entwicklung &amp; Nachwuchs</p>
<h1 class="titel" id="titel">Entwicklung</h1>
<p class="unterzeile" id="unterzeile">
Wie sich jemand über die Zeit bewegt. Keine Note, kein Vergleich –
jede Karte nur mit sich selbst.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ---- Die Liste (nur Leitung) ---------------------------------- -->
<section id="liste-block" hidden>
<p class="w-hinweis" id="liste-hinweis"></p>
<div id="liste" class="w-liste" aria-busy="true">
<p class="leise">wird geladen …</p>
</div>
</section>
<!-- ---- Eine Karte (nur Leitung) --------------------------------- -->
<section id="karte-block" hidden>
<button type="button" class="knopf knopf--still knopf--klein" id="zur-liste">
← Alle Karten
</button>
<h2 class="w-name" id="karte-name">…</h2>
<p class="w-satz" id="karte-satz">…</p>
<!-- Diagramm 1: Bewegung. Zwei Richtungen um eine Nulllinie —
vorwaerts und rueckwaerts sind dieselbe Groesse mit
verschiedenem Vorzeichen, nicht zwei Themen. -->
<section class="w-teil" id="bewegung-block">
<h3 class="e-abschnitt">Was sich bewegt hat</h3>
<p class="w-teil__satz" id="bewegung-satz"></p>
<div id="bewegung"></div>
</section>
<!-- Diagramm 2: der Streifen. Eine Zeile je Punkt, eine Spalte je
Monat. Das Zeichen sagt die Stufe, die Farbe verstaerkt nur. -->
<section class="w-teil" id="streifen-block">
<h3 class="e-abschnitt">Punkt für Punkt, Monat für Monat</h3>
<p class="w-teil__satz" id="streifen-satz"></p>
<div id="streifen" class="w-streifen"></div>
</section>
<!-- Die Texte. Reihenfolge ist Absicht: erst was sich bewegt hat,
dann was traegt, erst danach was liegt. -->
<section class="w-teil" id="texte-block">
<h3 class="e-abschnitt">Was dazu zu sagen ist</h3>
<div id="texte"></div>
</section>
<p class="w-fuss">
Auf dieser Seite gibt es keine Punktzahl und keinen Vergleich zwischen
Personen. Was hier steht, ist ein Gesprächsanlass – kein Zeugnis.
Einschätzungen setzt und ändert man im Katalog:
<a href="entwicklung.html">Eure Aufgaben</a>.
</p>
</section>
<!-- ---- Die eigene Sicht (Modi) ---------------------------------- -->
<!-- ==================================================================
WAS DER MENSCH SELBST SIEHT.
Hier steht kein fremder Name, keine Beobachtung über jemand
anderen und kein Anlasstext. Nur: ob sich etwas bewegt hat.
Die Lesehilfe und die zwei Wege am Ende sind am 19.09.2026
dazugekommen. Vorher standen hier Balken ohne Erklärung und ein
„Frag danach" ohne Adressaten – eine Sackgasse mit freundlichem
Ton.
============================================================== -->
<section id="mich-block" hidden>
<h2 class="e-abschnitt">Deine Entwicklung</h2>
<p class="w-satz" id="mich-satz">…</p>
<p class="w-lesehilfe" id="mich-lesehilfe" hidden></p>
<div id="mich-bewegung"></div>
<p class="w-fuss" id="mich-hinweis"></p>
<div class="w-wege" id="mich-wege" hidden></div>
</section>
</main>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/werdegang.js?v=202609221415" defer></script>
</body>
</html>
workspace/willkommen.html
+15 -14
View File
@@ -12,13 +12,13 @@
vergessen wird. -->
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#06090f" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/willkommen.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/willkommen.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<!-- KOERPERKLASSE "start", NICHT "gate" (berichtigt 21.09.2026).
`body.gate` ist die Anmeldewand: `display:flex; align-items:center`,
@@ -75,12 +75,13 @@
<p class="fehler" id="fehler" hidden></p>
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/willkommen.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/willkommen.js?v=202609221415" defer></script>
</body>
</html>
workspace/wissen.html
+17 -16
View File
@@ -12,20 +12,20 @@
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?v=202609221359" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221359" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221359" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609221415" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609221415" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/start.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/wissen.css?v=202609221415" />
<link rel="stylesheet" href="assets/css/module.css?v=202609221415" />
<!-- haus.css MUSS die letzte Stilvorlage sein (10.09.2026).
Auf der Agenturadresse ist sie leer -- das Haus hier IST der
Grundzustand. Auf der Adresse von Team Dogi biegt der Server
genau diesen Dateinamen auf crew-haus.css um, und die Seite
kommt schon beim ERSTEN Abruf in Lila und Babyblau an --
ohne Umfaerben im Browser, ohne Flackern. -->
<link rel="stylesheet" href="assets/css/haus.css?v=202609221359" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609221415" />
</head>
<body class="start">
@@ -190,14 +190,15 @@
</main>
<script src="assets/js/meldung.js?v=202609221359" defer></script>
<script src="assets/js/hochladen.js?v=202609221359" defer></script>
<script src="assets/js/nachfrage.js?v=202609221359" defer></script>
<script src="assets/js/meldung.js?v=202609221415" defer></script>
<script src="assets/js/hochladen.js?v=202609221415" defer></script>
<script src="assets/js/nachfrage.js?v=202609221415" defer></script>
<script src="assets/js/wahl.js?v=202609221359" defer></script>
<script src="assets/js/bereiche.js?v=202609221359" defer></script>
<script src="assets/js/kopf.js?v=202609221359" defer></script>
<script src="assets/js/glocke.js?v=202609221359" defer></script>
<script src="assets/js/wissen.js?v=202609221359" defer></script>
<script src="assets/js/wahl.js?v=202609221415" defer></script>
<script src="assets/js/bereiche.js?v=202609221415" defer></script>
<script src="assets/js/installieren.js?v=202609221415" defer></script>
<script src="assets/js/kopf.js?v=202609221415" defer></script>
<script src="assets/js/glocke.js?v=202609221415" defer></script>
<script src="assets/js/wissen.js?v=202609221415" defer></script>
</body>
</html>