Files
dogfather-universe/workspace/treff-moderation.html
T
DogFatherGitandClaude Opus 5 cbaa529350 Eure Aufgaben: die Reihenfolge, in der man denkt
Filipe: "die seite eure aufgaben, ich will dass du die so krass
perfektionierst, ich will dass du die so krass uebersichtlich machst."

ERST GEMESSEN, DANN ANGEFASST. Mit sechs Leuten, so wie im echten
Team:

  Handy, Person gewaehlt      8281 px  = 10,6 Bildschirme
  Handy, Katalog offen       11636 px  = 14,9 Bildschirme

Und die Personenwahl -- der ERSTE Schritt -- begann am Handy bei
Bildschirm 5,3. Man scrollte an allem vorbei, um anzufangen; und was
man dabei ueberscrollte (Formular, Katalog), betraf genau die Person,
die man noch gar nicht gewaehlt hatte.

DER PLAN STAND SCHON DA. Im HTML steht seit dem 15.09. ein Kommentar:
"1. Die Ampel. 2. Die Personen. 3. Die Karte." Genau so war es gedacht
-- und genau so war es nicht mehr: Am 22.09. kam das Verteilen auf die
Seite, am 23.09. der Katalog, und beide sind davor gerutscht. Der
Kommentar beschrieb eine Ordnung, die es nicht mehr gab. Wieder eine
Bestandsliste, die altert, waehrend jemand weiterarbeitet.

Die Reihenfolge ist jetzt die, in der man denkt: Wie steht das Team?
-> Wen nehme ich mir vor? -> Was gebe ich ihm? -> Was liegt schon bei
ihm? -> Wie steht er da?

  Handy: Personenwahl beginnt bei Bildschirm 0,5 statt 5,3
  Rechner: bei 0,4 statt 2,0

DIE KACHELN AM HANDY kosteten 1176 px fuer sechs Leute -- anderthalb
Bildschirme nur fuer die Frage, wen man sich vornimmt. Grund war
"min-width: 260px", und der Grund DAFUER steht daneben: Die drei
Bilanz-Kaesten wurden sonst gequetscht. Das stimmt, solange sie
NEBENEINANDER stehen. Am Handy stehen sie jetzt untereinander, jeder
eine Zeile (Ziffer links, Wort rechts) -- so kommt die Kachel mit der
halben Bildschirmbreite aus und zwei passen nebeneinander: 618 px.

KEINE ZAHL FAELLT WEG. Wer verteilt, muss sehen, wer schon wie viel
hat; das ist der Zweck dieser Kaesten. Sie werden kleiner, nicht
weniger. Unter 380 px wieder eine Kachel je Zeile -- zwei haetten dort
je 145 px, und "verschieden gesehen" waere nicht mehr zu lesen.

DER SPRUNG BEIM KACHELKLICK IST WEG. Er war richtig, solange die Karte
direkt unter der Auswahl stand. Jetzt liegen Formular, Katalog und ihre
Aufgaben dazwischen -- ein Sprung zur Karte uebersaehe genau die drei
Dinge, die man nach der Wahl zuerst braucht. (Filipe, 15.09.: "die
seite soll sich nicht immer bewegen wenn ich auf was druecke.") Der
Sprung von der Talentseite bleibt, dort ist er gemeint.

UND DER CHAT KEHRT DAHIN ZURUECK, WO MAN AUFGEHOERT HAT. Die Linie
"Ab hier neu" gibt es seit Tagen -- sie wurde gezeichnet und sofort
ueberscrollt, weil der Verlauf beim Oeffnen ans Ende sprang. Wer nach
zwei Tagen zurueckkam, landete unten und suchte die Stelle, indem er
Uhrzeiten las. Jetzt springt er EINMAL beim Oeffnen dorthin, auf ein
Viertel Hoehe: darueber der Zusammenhang, darunter das Neue. Danach
gilt wieder die alte Regel, damit eine eintreffende Nachricht einen
nicht aus dem Lesen reisst.

Gemessen: entwicklung 48, entwicklung-kacheln 15, modi-katalog 133,
bewerbung-aufgaben 101, chat-optik -- alle ohne Befund.

NOCH NICHT FERTIG: Die Entwicklungskarte ist mit 5975 px weiterhin
72 % der Seite. Das ist der naechste Schritt.

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

139 lines
5.6 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>Meldungen &amp; Maßnahmen · Das Rudel</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=202609232306" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609232306" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609232306" />
<link rel="stylesheet" href="assets/css/start.css?v=202609232306" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609232306" />
<link rel="stylesheet" href="assets/css/treff.css?v=202609232306" />
<link rel="stylesheet" href="assets/css/module.css?v=202609232306" />
<link rel="stylesheet" href="assets/css/haus.css?v=202609232306" />
</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">Das&nbsp;Rudel</a> · Meldungen</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">Das Rudel · Moderation</p>
<h1 class="titel">Meldungen &amp; Maßnahmen</h1>
<p class="unterzeile">
Was gemeldet wurde, was entfernt wurde und mit welcher Begründung –
alles an einer Stelle.
</p>
</div>
</section>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<!-- ==================================================================
WARUM DIESE SEITE EXISTIERT
Die Schnittstellen dafür gab es zuerst, die Seite nicht. Eine
Meldung, die nur über eine Schnittstelle abrufbar ist, ist keine
Meldung — sie ist eine Zeile in einer Datenbank, die niemand
liest. Der DSA verlangt in Artikel 16, dass Meldungen
BEARBEITET werden; ohne eine Stelle, an der sie erscheinen,
wäre das ein Versprechen an eine Schublade.
DREI ABSCHNITTE, IN DIESER REIHENFOLGE: Was liegt an (Meldungen)
— was wurde getan (Entfernt) — wer ist gesperrt (Maßnahmen). Wer
diese Seite öffnet, hat fast immer die erste Frage.
============================================================== -->
<!-- WAS HEREINKOMMT (17.09.2026). Steht GANZ OBEN, vor den offenen
Meldungen: Eine Meldung setzt voraus, dass jemand etwas gesehen
hat. Wer acht Bretter durchklicken muss, um zu sehen, ob etwas
Neues da ist, tut es nicht achtmal am Tag -- und was niemand
ansieht, moderiert auch niemand. -->
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Was hereinkommt</h2>
<div class="treff-abschnitt__inhalt">
<p>
Die neuesten Beiträge aus allen Bereichen der Community –
an einer Stelle, damit niemand acht Bretter durchklicken muss.
</p>
</div>
<div id="zulauf" aria-busy="true"><p class="leise">wird geladen …</p></div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Offene Meldungen</h2>
<div class="treff-abschnitt__inhalt">
<p>
Zu jeder Entscheidung gehört ein Satz. Er wird festgehalten –
auch damit man später weiß, warum etwas so entschieden wurde.
</p>
</div>
<div id="meldungen" aria-busy="true"><p class="leise">wird geladen …</p></div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Entfernt</h2>
<div class="treff-abschnitt__inhalt">
<p>
Was entfernt wurde, und warum. Die Begründung überlebt den Beitrag –
das ist der Sinn der Sache
<span class="leise">(Digital Services Act, Artikel 17)</span>.
</p>
</div>
<div id="entfernt" aria-busy="true"><p class="leise">wird geladen …</p></div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Die Mitglieder</h2>
<div class="treff-abschnitt__inhalt">
<p>
Wer da ist, seit wann, auf welcher Stufe – und wer gerade eine Pause
hat. Von hier aus wird gehandelt; die Stufe steht nur hier und
<strong>nie</strong> neben dem Namen im Rudel.
</p>
</div>
<div id="mitglieder" aria-busy="true"><p class="leise">wird geladen …</p></div>
</section>
<section class="treff-abschnitt">
<h2 class="treff-abschnitt__titel">Hinweise, Pausen, Ausschlüsse</h2>
<div class="treff-abschnitt__inhalt">
<p id="leiter">…</p>
</div>
<div id="massnahmen" aria-busy="true"><p class="leise">wird geladen …</p></div>
</section>
</main>
<script src="assets/js/meldung.js?v=202609232306" defer></script>
<script src="assets/js/nachfrage.js?v=202609232306" defer></script>
<script src="assets/js/wahl.js?v=202609232306" defer></script>
<script src="assets/js/bereiche.js?v=202609232306" defer></script>
<script src="assets/js/installieren.js?v=202609232306" defer></script>
<script src="assets/js/kopf.js?v=202609232306" defer></script>
<script src="assets/js/treff-moderation.js?v=202609232306" defer></script>
</body>
</html>