DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
3b356d6eefc3e18f429ead647549d47ff14f090a
dogfather-universe/workspace/bereich.html
T
DogFatherGitandClaude Opus 5 3b356d6eef Ein Material fuer die ganze Website -- und die Uhr wird zum Chronographen 
DIE UHR: Sekunde nach AUSSEN, Minute in die Mitte, Stunde nach innen
(Wunsch Filipe). Das ist die Anordnung eines Chronographen und nicht die
eines Fortschrittsbalkens: Der schnellste Zeiger laeuft auf der
laengsten Bahn, weil man Bewegung dort am besten sieht -- der langsamste
innen, wo eine kleine Drehung viel bedeutet. Die drei Umfaenge sind
mitgewandert; ein vertauschter Ring ohne vertauschte Zahlen endet nie
dort, wo er soll.

EIN MATERIAL FUER ALLE SEITEN. Die Startseite hatte seit heute
beleuchtete Platten, die anderen sechzehn Seiten flache Rechtecke -- man
wechselte die Seite und fiel aus einer Oberflaeche in eine andere. Ich
habe das bisher Seite fuer Seite nachgezogen, und genau deshalb war es
nie fertig: Es sind FUENFUNDVIERZIG Stellen.

Jetzt EINE Regel. Die Klassenliste ist nicht erfunden, sondern gemessen
-- es sind genau die, die `var(--flaeche)` als Kartenflaeche benutzen.
`:where()` ist der Kniff dabei: Spezifitaet null, also ueberschreibt die
Regel nichts, was eine Seite selbst festlegt. Eine Warnkarte bleibt rot,
eine Spalte behaelt ihre Statusfarbe. Ohne das haette ich an dreissig
Stellen `!important` gebraucht.

DREI FUNDE DER PRUEFUNGEN, alle berechtigt:

1. `.profil-gruppe` gibt es nicht -- ich hatte den Namen aus dem Kopf
   geschrieben statt aus der Datei. pruef-struktur meldete totes CSS.
   Die Karten auf profil.html heissen `.gruppe`, und genau der Name darf
   NICHT in die Liste: Auf der Startseite heissen die Kachelgruppen
   ebenso und haetten ploetzlich eine Kartenflaeche.

2. Der erste Verlauf war HELLER als das, was er ersetzt. Ein Material,
   das die ganze Website aufhellt, hellt auch jeden Text darauf auf --
   und das faellt an der leisesten Schrift zuerst auf.

3. `.gruppe__unter` stand auf 4,21:1. Und das ist der interessante Fall:
   Die Farbe war nicht schuld, eine VERSCHIEBUNG war es. Mit der fuenften
   Rolle rutschte auf personen.html alles eine Zeile nach unten, und die
   Zeile landete auf einer helleren Stelle des Buehnenbilds. Sie ist die
   einzige Beschriftung ohne Karte -- ein Text, dessen Untergrund ein
   FOTO ist, bekommt nicht den leisesten Ton. Jetzt 5,51:1.

Der zweite Fund fiel nur auf, weil die Zahl sich nach meiner ersten
Korrektur KEIN Stueck bewegte (zweimal exakt 4,21) -- dasselbe Zeichen
wie schon zweimal heute: falsche Stelle, nicht zu wenig.

Gruen: buehne (38), css-klassen (15), struktur (32), handy (59),
breiten (23), start-ansicht (136), lesbarkeit (14), tempo (8),
personen-liste (33).

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-07 05:14:01 +02:00

157 lines
7.0 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>Bereich · Creator Workspace</title>
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<meta name="theme-color" content="#0674b9" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609070507" />
<link rel="stylesheet" href="assets/css/start.css?v=202609070507" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609070507" />
<link rel="stylesheet" href="assets/css/bereich.css?v=202609070507" />
</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>
<!-- Der innere span.marke__text fehlte hier als einziger Seite. Damit
griffen weder die Überlauf-Kürzung noch der Rang im Schriftzug --
aufgefallen erst, als die Seitenprüfung die Marke auf allen
dreizehn Seiten nachgesehen hat. -->
<p class="marke"><span class="marke__text"><a class="zurueck" href="start.html">Creator&nbsp;Workspace</a> ·
<span id="marke-bereich">…</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 inhalt--breit">
<section class="kopf-zeile">
<div>
<p class="marke" id="ober">Betreuung</p>
<h1 class="titel" id="titel">…</h1>
<p class="unterzeile" id="unterzeile"></p>
</div>
<button type="button" class="knopf knopf--klein" id="neu-oeffnen">Neuer Eintrag</button>
</section>
<form class="neu" id="neu" hidden>
<div class="neu__raster">
<div>
<label class="feld-schild" for="f-art">Art</label>
<select id="f-art"></select>
</div>
<div>
<label class="feld-schild" for="f-datum" id="schild-datum">Datum</label>
<input id="f-datum" type="date" />
</div>
<!-- Nur bei Agentur-Events: das Ende des Zeitraums. Der Beginn ist
das Feld darueber -- ein zweites Datumsfeld daneben liest sich
als Spanne, ein Feld "Zeitraum" mit Text darin nicht. -->
<div id="feld-ende" hidden>
<label class="feld-schild" for="f-ende">Bis</label>
<input id="f-ende" type="date" />
</div>
<div id="feld-dringlich" hidden>
<label class="feld-schild" for="f-dringlich">Dringlichkeit</label>
<select id="f-dringlich">
<option value="hoch">hoch</option>
<option value="mittel" selected>mittel</option>
<option value="niedrig">niedrig</option>
</select>
</div>
<div id="feld-bewertung" hidden>
<label class="feld-schild" for="f-bewertung">Bewertung (1–5)</label>
<select id="f-bewertung">
<option value="">—</option>
<option value="1">1 – schwach</option>
<option value="2">2</option>
<option value="3">3 – solide</option>
<option value="4">4</option>
<option value="5">5 – stark</option>
</select>
</div>
<div id="feld-creator" hidden>
<label class="feld-schild" for="f-creator" id="schild-creator">Creator</label>
<select id="f-creator"><option value="">—</option></select>
<p class="feld-hinweis" id="hinweis-creator" hidden></p>
</div>
</div>
<div class="neu__zeile">
<label class="feld-schild" for="f-titel" id="schild-titel">Überschrift</label>
<input id="f-titel" maxlength="160" required />
</div>
<div class="neu__zeile">
<label class="feld-schild" for="f-text" id="schild-text">Text <span class="leise">(optional)</span></label>
<textarea id="f-text" rows="4" maxlength="6000"></textarea>
</div>
<!-- ==== Nur bei Agentur-Events ====================================
Zwei Felder, die den Unterschied zwischen einem Aufruf und einer
Aktion ausmachen, an der jemand teilnehmen kann: WAS ist zu tun
(und was springt dabei heraus) und WAS GILT dabei. Beides stand
bisher irgendwo im Fliesstext oder gar nicht -- und jede
Rueckfrage dazu kostet eine Nachricht. -->
<div class="neu__zeile" id="feld-aufgaben" hidden>
<label class="feld-schild" for="f-aufgaben">Aufgaben
<span class="leise">– womit sammelt man Punkte, was gibt es zu gewinnen</span></label>
<textarea id="f-aufgaben" rows="5" maxlength="6000"
placeholder="z. B.&#10;· 1 Punkt je Live-Stunde&#10;· 3 Punkte je neuem Abo&#10;· Platz 1 gewinnt …"></textarea>
</div>
<div class="neu__zeile" id="feld-regeln" hidden>
<label class="feld-schild" for="f-regeln">Regeln
<span class="leise">– was zählt, was nicht, bis wann</span></label>
<textarea id="f-regeln" rows="5" maxlength="6000"
placeholder="z. B.&#10;· Nur Streams auf dem eigenen Konto&#10;· Punkte zählen bis 23:59 am letzten Tag"></textarea>
</div>
<p class="fehler" id="neu-fehler" role="alert" aria-live="polite"></p>
<div class="neu__knoepfe">
<button type="submit" class="knopf knopf--klein" id="neu-speichern">Eintragen</button>
<button type="button" class="abmelden" id="neu-abbrechen">Abbrechen</button>
</div>
</form>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<div class="filter" id="filter"></div>
<!-- Fertige Punkte zum Uebernehmen -- nur in Bereichen, fuer die es
welche gibt (derzeit LIVE-Analyse). -->
<!-- Unterweisungen mit beidseitiger Bestaetigung. Nur im Bereich
"Schutz & Regeln" -- dort gehoeren Richtlinien hin. -->
<div id="schulung" hidden></div>
<div id="vorlagen" hidden></div>
<div id="liste" aria-busy="true"><p class="leise">Einträge werden geladen …</p></div>
</main>
<script src="assets/js/wahl.js?v=202609070507" defer></script>
<script src="assets/js/bereiche.js?v=202609070507" defer></script>
<script src="assets/js/kopf.js?v=202609070507" defer></script>
<script src="assets/js/glocke.js?v=202609070507" defer></script>
<script src="assets/js/checkliste.js?v=202609070507" defer></script>
<script src="assets/js/ampel.js?v=202609070507" defer></script>
<script src="assets/js/schulung.js?v=202609070507" defer></script>
<script src="assets/js/vorlagen.js?v=202609070507" defer></script>
<script src="assets/js/bereich.js?v=202609070507" defer></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink