Files
dogfather-universe/workspace/start.html
T
DogFatherGitandClaude Opus 5 0391a91d14 Neun Buehnen statt einer - jede Seite hat ihre eigene Szene
Filipe hat neun Bilder geschickt, damit es VERSCHIEDENE Hintergruende
gibt. Benutzt wurde davon genau eines (das Studio), die uebrigen acht
lagen unbenutzt im Ordner -- lounge.png und skyline.png sogar schon
fertig kopiert. Zu Recht beanstandet.

Jetzt wird aus jeder Szene eine Buehne, breit und schmal, und jede Seite
bekommt die, die zu ihr passt:

  studio      Startseite            der neutrale Ort, alles beginnt hier
  showbuehne  Dashboard, Review     die grosse Buehne, alles im Blick
  garage      Aufgaben, Technik     Werkstatt, hier wird gearbeitet
  skyline     Kalender              Nacht ueber der Stadt, Zeit
  lounge      Calls, Community      Sitzecke, hier wird geredet
  arena       Dateien, Wissen       Archiv hinter dem Portal
  halle       Profil, Personen      die Halle, in der jemand steht
  wald        Start-Check, Scouting der Weg, den man erst sucht
  portal      Content, LIVE         Durchgang, hier entsteht etwas

Die Zuordnung steht in bereiche.js -- derselben Liste, aus der schon
Zeichen und Farbton kommen. Eine Seite traegt damit dreierlei aus einer
einzigen Quelle: Farbe, Zeichen und Buehne. Sie koennen nicht
auseinanderlaufen.

Alle neun bekommen dieselbe Behandlung (abgedunkelt auf 0.42, Vignette
in der Mitte, wo der Text steht, oben ausgeblendet, wo die Kopfleiste
sitzt). Sie sehen verschieden aus und verhalten sich gleich -- eine
Buehne, die je Seite anders hell waere, waere Unruhe statt Vielfalt.
Der schmale Ausschnitt ist je Szene ein anderer, weil ein auf 9:16
gequetschtes Breitbild nur noch Wand zeigt; genommen wird der Bereich,
in dem die Figuren stehen.

18 Dateien, zusammen 580 KB -- pro Seite werden davon zwei geladen
(breit ODER schmal), also 16 bis 48 KB. Die Rohbilder waren 2,4 MB je
Stueck.

Kontrast auf allen sechs geprueften Seiten an echten Bildpunkten
nachgemessen: haelt (schlechtester Wert 4,59:1).

FUND: Die Buehnenpruefung suchte nach "buehne-breit" und fand die neuen
Namen nicht mehr -- sie meldete "die Buehne liegt im Hintergrund: FEHL",
obwohl sie da war.

Die Seitenpruefung sieht jetzt nach, dass jede Seite ihre Szene hat UND
dass das Bild wirklich ankommt: Ein data-buehne ohne passende CSS-Regel
waere still wirkungslos.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-01 10:36:16 +02:00

108 lines
4.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Dogfather Universe · Creator Workspace</title>
<meta name="robots" content="noindex, nofollow" />
<meta name="theme-color" content="#05070d" />
<link rel="icon" href="assets/img/favicon.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609011035" />
<link rel="stylesheet" href="assets/css/start.css?v=202609011035" />
</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">
<p class="marke"><span class="marke__text">Dogfather&nbsp;Universe · Creator&nbsp;Workspace</span></p>
<div class="kopfleiste__rechts">
<span class="wer" id="wer">…</span>
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
</div>
</header>
<!-- Volle Breite: Bei 880 px waren drei Kacheln je 285 px breit, und in
den groesseren Schriften brach der Text ab. Mehr Breite ist hier die
ehrlichere Loesung als kleinere Schrift. -->
<main class="inhalt inhalt--breit">
<!-- Die Begrüßung sagt jetzt etwas. "Angemeldet" stand vorher da, obwohl
man das oben rechts ohnehin sieht – die Zeile war verschenkt. An
ihrer Stelle steht der Tag, die Kalenderwoche und, wenn der Tag
einen Charakter hat, ein kurzes Wort dazu (neue Woche, Endspurt,
Wochenende). Darunter die Lage in einem Satz. -->
<section class="willkommen">
<p class="marke willkommen__datum">
<span id="datum">…</span>
<span class="willkommen__marker" id="tagesmarker" hidden></span>
</p>
<div class="willkommen__reihe">
<span class="willkommen__plakette" id="plakette" aria-hidden="true"></span>
<div class="willkommen__text">
<h1 class="titel" id="gruss">Willkommen</h1>
<p class="unterzeile">
<span id="rollentext">…</span>
<span class="willkommen__lage" id="lage" hidden></span>
</p>
</div>
</div>
</section>
<!-- Was ist dran? Steht VOR den Zahlen, weil es der Unterschied
zwischen "wie viel liegt an" und "was muss ich jetzt tun" ist.
Bleibt komplett weg, wenn nichts anliegt. -->
<section class="dran" id="dran-block" hidden>
<div class="klapp-kopf">
<p class="feldschild">Was ist dran</p>
<button type="button" class="knopf-still" id="dran-schalter"
aria-expanded="false" aria-controls="dran" hidden>
<span id="dran-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>
<ul class="dran__liste" id="dran" data-klapp="zu"></ul>
</section>
<!-- Zahlen zuerst: Das Konzept will "Prioritäten statt Datenfriedhof".
Sind alle sechs null, steht dort ein Satz statt sechs Nullen. -->
<section class="zahlen-block" id="zahlen-block">
<p class="feldschild">Deine Aufgaben</p>
<ul class="zahlen" id="zahlen"></ul>
<!-- Kein Grau-in-Grau, wenn alles erledigt ist: Ein leerer Posteingang
ist eine gute Nachricht und darf auch so aussehen. -->
<div class="zahlen-leer" id="zahlen-leer" hidden>
<span class="zahlen-leer__haken" aria-hidden="true">
<svg viewBox="0 0 24 24"><path d="m5 12.6 4.4 4.4L19 7.4" /></svg>
</span>
<span>
<strong>Nichts offen.</strong>
<span class="zahlen-leer__still">Alles abgearbeitet – gönn dir was.</span>
</span>
</div>
</section>
<!-- Die Bereiche, in drei Gruppen: was man täglich braucht, was zu
einem Creator gehört, was den Laden am Laufen hält. Aufgebaut von
start.js – dort steht auch, warum. -->
<div id="bereiche"></div>
<p class="fuss">
„Was ist dran" führt keine eigene Liste, sondern zeigt, was in den Bereichen
schon liegt – ein Punkt verschwindet von selbst, sobald die Sache erledigt ist.
Angezeigt wird nur, was du ohnehin sehen darfst.
</p>
</main>
<script src="assets/js/wahl.js?v=202609011035" defer></script>
<script src="assets/js/bereiche.js?v=202609011035" defer></script>
<script src="assets/js/kopf.js?v=202609011035" defer></script>
<script src="assets/js/start.js?v=202609011035" defer></script>
</body>
</html>