NEU & WICHTIG zeigte bis zu sechs Karten mit je vier Knoepfen -- eine
halbe Bildschirmseite, bevor ueberhaupt eine Kategorie zu sehen war.
Jetzt stehen genau ZWEI da: der wichtigste und der neueste. Bewusst je
einer und nicht die ersten zwei -- das sind zwei verschiedene Antworten
("was soll ich unbedingt lesen" und "was ist dazugekommen"). Alles
Weitere ist einen Klick entfernt, der Knopf nennt die Zahl.
"WICHTIG" LAEUFT JETZT EBENFALLS NACH 48 STUNDEN AB. Vorher blieb es
stehen, bis es jemand von Hand abschaltete -- mit dem absehbaren
Ergebnis, dass oben nach ein paar Wochen eine Liste von Dingen steht,
die laengst niemanden mehr angehen. Niemand raeumt so etwas auf.
Der Schalter bleibt trotzdem sinnvoll: Er hebt einen Eintrag fuer zwei
Tage nach oben, auch wenn dieser aelter ist. Er ist damit ein
Scheinwerfer, kein Regal.
DER AKTIONSKNOPF SPRANG -- "einmal rechts, einmal links". Die Ursache
war nicht die Seite, sondern die TEXTLAENGE: Die Kopfzeile ist eine
umbrechende Flex-Zeile, und der Textblock daneben durfte wachsen. Bei
kurzer Unterzeile blieb der Knopf rechts, bei langer ("Community-
Richtlinien, erlaubte und verbotene Inhalte, Altersprüfung, Sperren,
Verwarnungen, Datenschutz, Jugendschutz und sicheres Verhalten")
rutschte er darunter. Es sah aus wie zwei verschiedene Seiten und war
dieselbe Regel.
Jetzt schrumpft der Textblock und der Knopf nicht -- er steht auf jeder
Seite an derselben Stelle. Auf dem Handy rutscht er bewusst darunter und
nimmt die volle Breite, dort ist nebeneinander kein Platz.
NEUE PRUEFUNG pruef-wissen-neu.mjs. Sie legt ausdruecklich Eintraege mit
einem Zeitstempel von VOR DREI TAGEN an. Mit frischen Daten waere alles
neu, ein abgelaufener Eintrag kaeme nie vor, und die Pruefung waere
gruen, ohne den Fall je gesehen zu haben. Geprueft wird ausserdem, dass
das Aufklappen WIRKLICH mehr zeigt -- ein Knopf, der nur seine
Beschriftung aendert, ist keiner.
Zwei Fehler in der Pruefung selbst gefunden: Sie schrieb in Spalten, die
so nicht heissen (datei statt name_datei), und suchte die Karten unter
".karte" -- sie heissen .pdf, und der Ausdruck zaehlte stattdessen die
umschliessenden Container.
Co-Authored-By: Claude Opus 5 <[email protected]>
108 lines
4.4 KiB
HTML
108 lines
4.4 KiB
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>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=202609011547" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609011547" />
|
||
</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 Universe · Creator 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=202609011547" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609011547" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609011547" defer></script>
|
||
<script src="assets/js/start.js?v=202609011547" defer></script>
|
||
</body>
|
||
</html>
|