Files
dogfather-universe/webdesign/portal.html
T
DogFatherGitandClaude Opus 5 1afb38258c Anfuehrungszeichen: drei Loecher in meiner eigenen Wache
Die zweite Sitzung hat in den Praesentationen des Vaults 83 Stellen
gefunden — und damit auf Loecher in MEINER Wache gezeigt. Ich habe
sie nachgemessen, alle drei waren echt.

LOCH 1 — SIE SAH NUR `server/workspace-*.js`

Also ausgerechnet nicht `workspace.js`, die groesste Datei des
Hauses. Der weitere Filter fand dort sofort drei Stellen:

    workspace.js:3404  Kanal „Chat-Moderation"     (Protokoll)
    workspace.js:3422  „${titel}" -> ${haus}       (Protokoll)
    workspace.js:3304  „${… || "ohne Titel"}"      (siehe Loch 3)

Das ist heute der DRITTE Fall von „die Wache kennt nur die halbe
Menge" — nach pruef-struktur (sah nur die Pruefdateien, nicht die
Anwendung) und pruef-fingermass (sah keine variable Breite).

LOCH 2 — IHR AUSDRUCK GILT JE ZEILE

Ein `„`, das erst in der naechsten Zeile mit einem geraden `"`
schliesst, fiel durch. Gemessen: drei echte Faelle, zwei davon
sichtbarer Seitentext.

    workspace/leistung.html       „nicht / zugeordnet"
    workspace/leistung.html       „Backstage-Tabelle / einfuegen"
    workspace/assets/js/ampel.js  „noch ' + 'verbessern"

Beim letzten laeuft das Zitat ueber eine Zeichenketten-Verkettung.

Neue Regel ohne Fehlalarme: erst alle RICHTIG geschlossenen Paare
entfernen (auch mehrzeilig), dann die einzeilig falschen (die meldet
die alte Regel). Was danach noch ein `„` hat und binnen drei Zeilen
ein gerades `"`, ist ein Fund. Ausgenommen bleibt das Zeichen ALS
WERT — in `content: "„";` und in den Sprachtabellen ist das `„` der
Inhalt und das `"` die Begrenzung.

LOCH 3 — EINE AUSNAHME, DIE EINEN FUND VERSCHLUCKT HAT

Gefunden durch die ZAHL, nicht durch den Blick: Der weitere Filter
liess die Ausnahmen von 12 auf 13 steigen. Die dreizehnte war

    `… „${zeile[titelSpalte] || "ohne Titel"}"`

Der Ausdruck blieb am `"` von `"ohne Titel"` haengen; als Inhalt kam
`${zeile[titelSpalte] || ` heraus, das endet auf ein Leerzeichen,
und damit galt „der Satz geht in der naechsten Zeile weiter". Das
echte Schlusszeichen stand hinter dem `}` und war gerade.

Dass die Ausnahmen gezaehlt UND genannt werden, hat ihn gefunden.
Genau dafuer steht die Zeile dort.

Behoben an der Wurzel: Anfuehrungszeichen innerhalb einer Einsetzung
`${…}` werden vorher durch X ersetzt, bei gleicher Laenge und
gleichen Zeilenumbruechen. Das nimmt einer ganzen Sorte
Fehlklassifizierung die Grundlage — die Ausnahmen fielen danach von
13 auf 11.

UND EIN VIERTES, BEIM MESSEN AUFGEFALLEN

`„Van-Van”` in assets/js/data-modis.js schliesst mit U+201D, dem
ENGLISCHEN Zeichen. Zweimal, beide Male in einer DEUTSCHEN Zeile
(`de:` und `"de-CH":`) — nicht einmal eine Uebersetzung, in der es
richtig waere. Eigene Regel dafuer, die keine Ausnahme braucht: Wer
mit `„` oeffnet, schliesst deutsch; in fremdsprachigen Zeilen steht
gar kein `„` am Anfang.

DIE AUSNAHMEZAHL IST JETZT STRENG. Sie stand auf „hoechstens 12" —
damit waere der Anstieg auf 13 nicht aufgefallen. Jetzt genau 11,
wie bei den Grundlinien in pruef-fingermass.

GEPRUEFT: pruef-struktur 68 -> 75 Pruefungen, 0 Fehler. Dazu
leistung-optik 59/0, ampel 47/0, treff 85/0, modi-verborgen 87/0 —
die Seiten, deren Text ich angefasst habe. Steuerzeichen: 830
Dateien, keines. Beide Stempel gesetzt.

Sechs echte Stellen berichtigt, vier neue Gegenproben.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-10-01 19:28:38 +02:00

207 lines
10 KiB
HTML

<!DOCTYPE html>
<html lang="de" data-i18n-titel="seiten_titel">
<head>
<meta charset="UTF-8" />
<!-- viewport-fit=cover ist die Voraussetzung dafuer, dass env(safe-area-inset-*)
ueberhaupt einen Wert liefert. Ohne diese Angabe gibt jedes env() null zurueck
-- die Sicherheitsabstaende im CSS waeren totes Recht. Zusammen mit
apple-mobile-web-app-status-bar-style=black-translucent (siehe unten) laeuft
der Inhalt sonst installiert unter Uhr und Akkuanzeige. -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<title>Kundenportal — Dogfather Webdesign</title>
<meta name="robots" content="noindex, nofollow, noarchive" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/portal-32.png?v=202610011927" />
<meta name="theme-color" content="#924985" />
<link rel="manifest" href="/webdesign/portal.webmanifest" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/portal-180.png?v=202610011927" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Dogfather Webdesign" />
<link rel="stylesheet" href="/assets/css/main.css?v=202610011927" />
<link rel="stylesheet" href="/assets/css/webdesign.css?v=202610011927" />
<style>
.po-login { max-width: 440px; margin: clamp(1.5rem,6vh,4rem) auto; }
.po-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-bottom: 1.4rem; }
.po-kopf h1 { margin: 0; font-size: clamp(1.4rem,3.4vw,2rem); }
.po-kopf .wd-btn { margin-left: auto; }
/* Projektkarte in der Übersicht */
.po-projekt { display: block; width: 100%; text-align: left; cursor: pointer; margin-bottom: .8rem; }
.po-projekt-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: .5rem; }
.po-projekt-nr { font-family: var(--font-head); font-weight: 800; font-size: .8rem; color: var(--wd-blau); }
.po-projekt h3 { margin: 0; flex: 1; min-width: 0; }
/* Fortschrittsleiste über die Projektphasen.
Zeigt auf einen Blick, wo das Projekt steht — die häufigste Frage
überhaupt, und der Grund, warum Kunden anrufen. */
.po-phasen { display: flex; gap: 3px; margin: .8rem 0 .6rem; }
.po-phase { flex: 1; height: 6px; border-radius: 999px; background: rgb(var(--wd-blau-rgb) / .13); }
.po-phase.po-erledigt { background: var(--wd-blau-tief); }
.po-phase.po-jetzt { background: var(--wd-blau); box-shadow: 0 0 10px rgb(var(--wd-blau-rgb) / .6); }
.po-phasen-text { font-size: .82rem; color: var(--wd-text-soft); }
/* Frist-Marke neben dem Liefertermin.
Bewusst zurueckhaltend im Normalfall: Ein Kunde, dessen Projekt
entspannt laeuft, soll keine Alarmfarbe sehen. Erst wenn es eng
wird, kommt Farbe dazu -- und der TEXT sagt es ebenfalls, damit die
Aussage auch ankommt, wenn man Farben nicht unterscheiden kann. */
/* ---------- Angebot ----------
Deutlich hervorgehoben, aber nicht schreiend: Es ist das Einzige im
Portal, das eine Entscheidung verlangt, und es soll auffallen —
ohne dass die Seite dabei nach Werbung aussieht. Deshalb ein
ruhiger Goldton am Rand statt einer farbigen Fläche. */
.po-angebot { position: relative; }
.po-angebot--offen {
border-color: rgb(var(--wd-gold-rgb) / .45);
box-shadow: 0 0 0 1px rgb(var(--wd-gold-rgb) / .12), var(--wd-hoehe-1);
}
.po-ag-marke {
display: inline-block; margin-bottom: .5rem;
padding: .16rem .6rem; border-radius: 999px;
font-size: .74rem; font-weight: 800; letter-spacing: .04em;
text-transform: uppercase;
background: rgb(var(--wd-gold-rgb) / .16); color: var(--wd-gold);
}
.wd .po-ag-preis {
font-size: clamp(1.5rem, 4vw, 2rem); font-weight: 700;
color: var(--wd-blau); margin: .2rem 0 .3rem;
font-variant-numeric: tabular-nums;
}
.po-ag-leistungen { margin: 1rem 0; }
.wd .po-ag-gruppe {
font-size: .9rem; font-weight: 700; margin: .9rem 0 .3rem;
color: var(--wd-text);
}
.po-ag-liste { margin: 0 0 .2rem; padding-left: 1.1rem; }
.wd .po-ag-liste li { font-size: .88rem; margin-bottom: .2rem; color: var(--wd-text-soft); }
.po-ag-knoepfe {
display: flex; flex-wrap: wrap; gap: .6rem; align-items: center;
margin-top: 1rem; padding-top: .9rem;
border-top: 1px solid var(--wd-rand);
}
/* Der Zusage-Knopf nimmt auf dem Handy die volle Breite — er ist das
Ziel dieser Karte, und ein halbbreiter Knopf neben einem
Abbrechen-Knopf lädt zum Verwechseln ein. */
@media (max-width: 560px) {
.po-ag-knoepfe > .wd-btn--haupt { width: 100%; }
}
.po-frist {
display: inline-block; margin-left: .35rem;
padding: .1rem .5rem; border-radius: 999px;
font-size: .76rem; font-weight: 700;
background: rgb(var(--wd-blau-rgb) / .14); color: var(--wd-blau);
font-variant-numeric: tabular-nums;
}
.po-frist--warn { background: rgb(233 196 106 / .16); color: #e9c46a; }
/* Gedaempftes Korallrot statt reinem Rot: auf dunklem Grund ist volles
Rot blendend und schlecht lesbar. */
.po-frist--rot { background: rgb(231 130 120 / .16); color: #e78278; }
.po-wartet {
display: inline-flex; align-items: center; gap: .35rem;
padding: .25rem .65rem; border-radius: 999px; font-size: .78rem; font-weight: 700;
}
.po-wartet--kunde { background: rgb(var(--wd-gold-rgb) / .16); color: var(--wd-gold); }
.po-wartet--dogfather { background: rgb(var(--wd-blau-rgb) / .14); color: var(--wd-blau); }
.po-liste { list-style: none; margin: 0; padding: 0; }
.po-eintrag {
display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem;
padding: .8rem 0; border-bottom: 1px solid var(--wd-rand);
}
.po-eintrag:last-child { border-bottom: none; }
.po-eintrag-haupt { flex: 1; min-width: 0; }
.po-eintrag-name { color: var(--wd-text); font-weight: 600; overflow-wrap: break-word; }
.po-eintrag-neben { font-size: .84rem; color: var(--wd-text-soft); }
.po-nachricht { padding: .8rem 1rem; border-radius: 14px; margin-bottom: .6rem; max-width: 88%; }
.po-nachricht--ich { background: rgb(var(--wd-blau-rgb) / .1); border: 1px solid var(--wd-rand-stark); margin-left: auto; }
.po-nachricht--du { background: rgb(var(--wd-glas-rgb) / .7); border: 1px solid var(--wd-rand); }
.po-nachricht-kopf { font-size: 0.8rem; color: var(--wd-text-soft); margin-bottom: .25rem; }
.po-nachricht p { margin: 0; font-size: .95rem; white-space: pre-wrap; color: var(--wd-text); }
.po-idee { padding: 1rem; border-radius: 14px; border: 1px solid var(--wd-rand); background: rgb(var(--wd-glas-rgb) / .5); margin-bottom: .7rem; }
.po-idee-kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; margin-bottom: .4rem; }
.po-idee-kopf h4 { margin: 0; flex: 1; min-width: 0; }
.po-idee--offen { border-color: rgb(var(--wd-gold-rgb) / .4); background: rgb(var(--wd-gold-rgb) / .05); }
.po-laedt { text-align: center; padding: 2.5rem 1rem; color: var(--wd-text-soft); }
</style>
</head>
<body class="wd">
<div id="wd-kopf" data-wd-kopf="minimal"></div>
<main id="wd-inhalt" class="wd-motiv wd-motiv--ring">
<section class="wd-abschnitt" style="padding-top:1.6rem">
<div class="wd-container wd-container--schmal">
<div class="wd-meldung" id="po-meldung" hidden></div>
<!-- ============ ANMELDUNG ============ -->
<div id="po-anmeldung" class="wd-karte po-login" hidden>
<h1 style="font-size:1.5rem" data-i18n="po_login_h1">Dein Projektraum</h1>
<p class="wd-klein wd-leise" data-i18n="po_login_text">Hier siehst du deinen Projektstand, alle Dateien und offene Punkte.</p>
<form id="po-login-form" novalidate>
<div class="wd-feld" id="po-feld-email">
<label for="po-email" data-i18n="po_email">E-Mail</label>
<input type="email" id="po-email" autocomplete="username" inputmode="email" />
</div>
<div class="wd-feld" id="po-feld-passwort">
<label for="po-passwort" data-i18n="po_passwort">Passwort</label>
<input type="password" id="po-passwort" autocomplete="current-password" />
<p class="wd-feld-fehler"></p>
</div>
<button type="submit" class="wd-btn wd-btn--haupt wd-btn--breit" data-i18n="po_anmelden">Anmelden</button>
</form>
<p class="wd-klein wd-leise" style="margin-top:1rem" data-i18n="po_kein_zugang">Noch keinen Zugang? Der Projektraum wird freigeschaltet, sobald dein Projekt beginnt.</p>
</div>
<!-- ============ PASSWORT SETZEN ============ -->
<div id="po-setzen" class="wd-karte po-login" hidden>
<h1 style="font-size:1.5rem" data-i18n="po_setz_h1">Passwort festlegen</h1>
<p class="wd-klein wd-leise" data-i18n="po_setz_text">Wähl ein Passwort für deinen Projektraum. Ein kurzer Satz ist sicherer und leichter zu merken als ein kryptisches Wort.</p>
<p id="po-setz-fuer" class="wd-klein" style="color:var(--wd-blau)"></p>
<form id="po-setz-form" novalidate>
<div class="wd-feld" id="po-feld-neu">
<label for="po-neu" data-i18n="po_passwort">Passwort</label>
<input type="password" id="po-neu" autocomplete="new-password" />
<p class="wd-feld-fehler"></p>
</div>
<button type="submit" class="wd-btn wd-btn--haupt wd-btn--breit" data-i18n="po_setz_knopf">Passwort speichern</button>
</form>
</div>
<!-- ============ ÜBERSICHT ============ -->
<div id="po-uebersicht" hidden>
<div class="po-kopf">
<h1><span data-i18n="po_hallo">Hallo</span> <span id="po-name">—</span></h1>
<button type="button" class="wd-btn wd-btn--still wd-btn--klein" id="po-abmelden" data-i18n="po_abmelden">Abmelden</button>
</div>
<div id="po-inhalt"><div class="po-laedt" data-i18n="laedt">Wird geladen…</div></div>
</div>
<!-- ============ PROJEKTDETAIL ============ -->
<div id="po-detail" hidden>
<div class="po-kopf">
<button type="button" class="wd-btn wd-btn--still wd-btn--klein" id="po-zurueck" data-i18n="po_zurueck">Zurück zur Übersicht</button>
</div>
<div id="po-detail-inhalt"><div class="po-laedt" data-i18n="laedt">Wird geladen…</div></div>
</div>
</div>
</section>
</main>
<div id="wd-fuss"></div>
<script src="/assets/js/i18n-wd-portal.js?v=202610011927"></script>
<script src="/assets/js/wd-core.js?v=202610011927"></script>
<script src="/assets/js/wd-portal.js?v=202610011927"></script>
</body>
</html>