"Dein Team": neuer Name, ein falsches Schild weniger und ein eigener Grund

Filipe, drei Bildschirmfotos: den Namen der Kachel aendern, "diese zwei
kacheln noch mehr perfektionieren", "veraender den hintergrund von
diesen kacheln komplett", "perfektionnier diese seite einfach komplett".

DER NAME, DRITTE FASSUNG. Zuerst "Team-Lage" -- das klang nach Bericht
UEBER Menschen. Dann "Eingang" -- das beschrieb nur die eine Haelfte
(was hereinkommt) und liess die groessere weg: wer da ist, wer heute
kann, wer was offen hat. "Dein Team" sagt beides und stellt niemanden
ueber jemanden.

DREI SACHEN WAREN NICHT GESCHMACK, SONDERN FEHLER -- und alle drei hat
erst das Nachmessen am fertigen Bildschirm gezeigt:

  UEBER SIEBEN TAGEN STAND "Kann heute". Im Singular, ueber einer
  ganzen Woche. Wer nur die Ueberschrift liest -- und das tut man bei
  einer Zeile in Versalien --, haelt den ganzen Streifen fuer den
  heutigen Tag und liest sechs Kaestchen falsch. Der Satz DARUNTER war
  immer richtig; zwei Aussagen ueber demselben Bild, und die
  auffaelligere war die falsche.

  DIE VIER ZAHLEN BRACHEN 3 + 1. Gemessen: Die Karte ist innen 536 px
  breit, die Regel verlangte je Spalte mindestens 130 px, vier Spalten
  braeuchten 544. Acht Pixel zu wenig. Die Lehre ist NICHT "130 auf 122
  senken" -- das waere dieselbe Rechnung mit einer anderen Zahl. Vier
  Dinge sehen nur in 1x4, 2x2 oder 4x1 richtig aus; 3+1 ist die eine
  Anordnung, die immer falsch wirkt, und eine `auto-fit`-Regel kann
  jederzeit dort landen. Zwei feste Spalten koennen es nicht.

  DER WEG IN DEN CHAT war ein unterstrichener Satz ueber die volle
  Kartenbreite -- er sah aus wie eine Ueberschrift, nicht wie ein Knopf.

DER GRUND DER KARTEN, und hier hat mich das erste Ergebnis widerlegt:
Der Schein aus der oberen Ecke nahm `var(--r)`, die Farbe der STUFE.
Das war logisch und unsichtbar -- bei "Probe" ist sie ein gedaempftes
Grau, und ein Grauschein auf fast Schwarz ist kein Schein. Nach der
Aenderung sah die Karte auf dem Bildschirmfoto genauso aus wie davor.
Jetzt tragen die beiden Ecken die Hausfarben (Lila oben links, Babyblau
unten rechts), dazu ein Lichtstreifen quer und ein Kantenlicht oben.
Die Stufe bleibt, wo sie hingehoert: im Kantenlicht und am Schild.

AUGENSCHONEND BLEIBT PFLICHT: Keine Lage geht ueber 26 %, der
Lichtstreifen liegt bei 3 %, und die hellsten Stellen sitzen in den
ECKEN -- nicht hinter dem Text. Ein Schein hinter einer Zahl macht sie
schwerer lesbar, egal wie schoen er ist.

Dazu: HEUTE ist im Wochenstreifen markiert (sieben gleich aussehende
Kaestchen zwingen sonst dazu, den Wochentag im Kopf auszurechnen), ein
freier Tag hat eine Andeutung statt gar nichts (sieben leere Rahmen
sahen aus wie "noch nicht geladen"), und der Erklaerkasten im Kopf darf
68 statt 44 Zeichen breit sein -- auf einem breiten Bildschirm stand er
als schmale Saeule mit sechs Zeilen zu je vier Woertern neben viel Bild.

WARUM DIE FALSCHE UEBERSCHRIFT UEBERLEBEN KONNTE: pruef-team-ampel
prueft seit dem ersten Tag, dass SIEBEN Tage kommen und der erste heute
ist. Was sie nie angesehen hat, ist der Text darueber -- die Zahl
stimmte ja. Sie prueft ihn ab jetzt, an derselben Stelle wie die Zahl,
damit beide zusammen gelesen werden. Mit Gegenprobe: Die Suche muss das
Wort "heute" auch finden koennen, sonst waere sie gruen, weil sie nie
etwas liest.

pruef-team-ampel 28 -> 32 · pruef-team-stufen 24 · pruef-css-klassen
gruen · pruef-start-ansicht 143 · pruef-rollen 278 · pruef-modi-wortleck 5.

OFFEN GEBLIEBEN und ihm gemeldet: Auf einem 1920er Bildschirm steht der
Inhalt in einer Saeule von rund 1150 px, links und rechts bleibt Bild.
Das ist die Breite ALLER zwanzig Seiten; sie hier allein zu aendern
hiesse, eine Seite anders zu bauen als die anderen neunzehn.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-11 00:30:18 +02:00
co-authored by Claude Opus 5
parent da7ddf7b5e
commit a16e4cb337
28 changed files with 488 additions and 293 deletions
+26 -4
View File
@@ -167,19 +167,37 @@
noch einmal. */
if (Array.isArray(m.verfuegbar) && m.verfuegbar.length) {
const woche = el('div', 'tampel');
woche.append(el('span', 'tampel__schild', 'Kann heute'));
/* DIE ÜBERSCHRIFT SAGTE „Kann heute" ÜBER SIEBEN TAGEN
(11.09.2026).
Darunter stand eine ganze Woche. Wer nur die Überschrift liest
-- und das tut man bei einer Zeile in Versalien --, hält den
ganzen Streifen für den heutigen Tag und liest sechs Kästchen
falsch. Der Satz DARUNTER war immer richtig; er spricht
ausdrücklich von heute. Zwei Aussagen über demselben Bild, und
die auffälligere war die falsche.
Gefunden nicht beim Lesen des Codes, sondern beim Nachmessen
am fertigen Bildschirm: sieben Kästchen, eine Überschrift im
Singular. */
woche.append(el('span', 'tampel__schild', 'Die nächsten sieben Tage'));
const streifen = el('div', 'tampel__woche');
for (const t of m.verfuegbar) {
m.verfuegbar.forEach((t, i) => {
const d = new Date(`${t.tag}T12:00:00Z`);
const tag = el('span', `tampel__tag tampel__tag--${t.ampel}`,
['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'][d.getUTCDay()]);
/* HEUTE WIRD MARKIERT. Ohne das sind es sieben gleich aussehende
Kästchen, und man muss den Wochentag im Kopf ausrechnen, um zu
wissen, wo man steht. Der erste Eintrag IST heute -- die
Abfrage im Server beginnt dort. */
if (i === 0) tag.dataset.heute = 'ja';
const dauer = t.minuten
? `${Math.floor(t.minuten / 60)} Std ${String(t.minuten % 60).padStart(2, '0')}`
: null;
tag.title = `${d.toLocaleDateString('de-DE', { weekday: 'long', day: 'numeric', month: 'long' })}`
+ (t.termine ? ` · ${t.termine} ${t.termine === 1 ? 'Termin' : 'Termine'}, ${dauer}` : ' · nichts eingetragen');
streifen.append(tag);
}
});
woche.append(streifen);
/* Der Satz sagt, was die Farben bedeuten -- einmal je Karte, nicht
als Legende irgendwo. Wer die Seite zum ersten Mal sieht, soll
@@ -215,8 +233,12 @@
seit dem 06.09. und wird hier nur benutzt, nicht neu gebaut.
Nachgemessen: Die rechte Hand und die Modis duerfen einander
schreiben, ein Manager ist fuer beide nicht erreichbar. */
/* EIN KNOPF, KEIN UNTERSTRICHENER SATZ (11.09.2026). Die Klasse
`schritt` zeichnet einen Textweg -- über die volle Breite einer
Karte gezogen sah er aus wie eine Überschrift mit Unterstrich.
`tschreiben` ist derselbe Weg, nur als Knopf erkennbar. */
const aktionen = el('div', 'tpipe__reihe');
const schreiben = el('a', 'schritt', `${m.name} schreiben`);
const schreiben = el('a', 'tschreiben', `${m.name} schreiben`);
schreiben.href = `chat.html?mit=${m.id}`;
aktionen.append(schreiben);
k.append(aktionen);