Die Kopfleiste war nie klebend -- und das Call-Brett hatte eine leere Haelfte

DIE LEISTE BLEIBT JETZT OBEN (screen 3)

Filipe: "diese leiste soll immer da stehen bleiben, egal ob man die
seite runterscrollt oder nicht, auf allen seiten."

In start.css steht seit jeher `.kopfleiste { position: sticky; top: 0 }`.
Zwanzig Zeilen darueber steht aber

    body.start > .kopfleiste { position: relative; z-index: 1; }

und das ist (0,2,1) gegen (0,1,0) -- die staerkere Regel gewinnt,
unabhaengig von der Reihenfolge. Gemessen im Browser: `position:
relative`, und bei 600 px Scrollen wanderte die Leiste 600 px aus dem
Bild. Sie hat also nie geklebt, obwohl es im Code so dasteht.

Das ist heute die VIERTE Spielart derselben Falle: `:where()` zu
schwach, `body.start .willkommen` zu stark, die Kachel-Verschachtelung
zu stark -- und hier eine Regel, die etwas ganz anderes wollte (den
Stapelwert ueber der Buehne) und dabei die Positionierung mitgenommen
hat. Merksatz: Wer `position` setzt, nur um `z-index` zu bekommen,
greift jedes Mal daneben.

Nachgemessen: 700 px gescrollt, Leiste steht bei 0.

DAS CALL-BRETT: DREI TAFELN STATT ZWEIER SPALTEN (screen 2)

Filipe: "das bewegt sich immer noch mit, das ist so scheissen."

DAS PROBLEM WAR DIE AUFTEILUNG, nicht die Gestaltung. Zwei Spalten, und
"Steht an" hatte siebenundzwanzig Karten: Die rechte Spalte lief ueber
mehrere Bildschirmhoehen, die linke war nach zwei Koepfen zu Ende. Wer
scrollt, sieht dann eine leere halbe Seite mit einer Ueberschrift, die
scheinbar mitwandert -- sie steht bloss still, waehrend daneben alles
laeuft.

Jetzt bekommt jede Tafel DIESELBE Hoehe und einen EIGENEN Lauf. Alle
drei Gruppen sind damit immer gleichzeitig zu sehen, egal wie viel in
einer steckt, und die Seite selbst scrollt kaum noch. Das ist die
Bauart jedes Aufgabenbretts, und sie ist es aus genau diesem Grund.

Die Hoehe haengt am Fenster (`min(62vh, 620px)`) statt an einer festen
Zahl. Unter 900 px stehen die Tafeln untereinander und laufen wieder
frei -- auf dem Handy ist ein Kaestchen mit eigenem Balken eine Falle,
keine Hilfe. Der Balken ist selbst gestaltet; der Systembalken reisst
ein weisses Band in eine dunkle Flaeche.

NOCH OFFEN aus derselben Nachricht: der Erinnerungswecker fuer Termine
(ein-/ausschaltbar je Eintrag, mehrere Zeitpunkte, von jedem selbst
einstellbar) -- dazu will Filipe ausdruecklich Recherche, und der baut
sich nicht nebenbei.

Zehn Pruefungen gelaufen, alle gruen.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-07 18:24:58 +02:00
co-authored by Claude Opus 5
parent 28a260fab2
commit af4a00dce2
21 changed files with 272 additions and 198 deletions
+25 -1
View File
@@ -204,7 +204,31 @@ body.start > .schleier {
/* Alles Bedienbare liegt über der Bühne. Ohne das läge der Inhalt zwar
sichtbar darüber, aber Klicks landeten teils am falschen Ort. */
body.start > .kopfleiste,
/* DIE KOPFLEISTE BLEIBT OBEN STEHEN (07.09.2026).
Filipe: "diese leiste soll immer da stehen bleiben, egal ob man die
seite runterscrollt oder nicht, auf allen seiten."
Sie WAR nie klebend, obwohl es zwanzig Zeilen weiter unten so
dasteht (`.kopfleiste { position: sticky; top: 0 }`). Diese Regel
hier hat es ueberschrieben: `body.start > .kopfleiste` ist (0,2,1),
`.kopfleiste` nur (0,1,0) -- die staerkere gewinnt, unabhaengig von
der Reihenfolge. Gemessen im Browser: `position: relative`, und beim
Scrollen um 600 px wanderte die Leiste um 600 px nach oben aus dem
Bild.
Das ist heute die VIERTE Spielart derselben Falle: `:where()` war zu
schwach, `body.start .willkommen` zu stark, die Kachel-Verschachtelung
zu stark -- und hier eine Regel, die etwas ganz anderes wollte (den
Stapelwert ueber der Buehne) und dabei die Positionierung mitnahm.
Wer `position` setzt, nur um `z-index` zu bekommen, greift jedes Mal
daneben.
Der Stapelwert bleibt: 6 statt 1, damit die Leiste ueber den Modulen
liegt -- sie steht ja jetzt auf ihnen. */
body.start > .kopfleiste {
position: sticky; top: 0; z-index: 6;
}
body.start > .inhalt,
body.start > main { position: relative; z-index: 1; }