diff --git a/workspace/assets/css/calls.css b/workspace/assets/css/calls.css index 568a7445..5bbb1c02 100644 --- a/workspace/assets/css/calls.css +++ b/workspace/assets/css/calls.css @@ -655,3 +655,42 @@ @media (forced-colors: active) { .call-brett .gruppe { background: Canvas; box-shadow: none; border: 1px solid CanvasText; } } + +/* EINE LEERE TAFEL BLEIBT STEHEN -- gedaempft (08.09.2026). + + Filipe hatte zwei Bildschirmfotos nebeneinander gestellt: bei einem + Scout EINE Tafel ueber die volle Breite, bei einer Managerin vier + nebeneinander. Der Grund war, dass leere Gruppen gar nicht gebaut + wurden (calls.js) -- die Seite war damit nicht nur leerer, sondern + anders aufgeteilt. + + Jetzt stehen immer alle vier. Die leeren treten zurueck, statt zu + verschwinden: weniger Deckkraft, die Null in Grau. Dieselbe Sprache + wie bei den Aufgabenzahlen auf der Startseite -- gedaempft ist auch + eine Antwort, nur eine leise. */ +.gruppe[data-leer="ja"] { opacity: .58; } +.gruppe[data-leer="ja"] .stufe__zahl { + color: var(--text-still); + background: rgba(150, 186, 220, .09); + border-color: rgba(150, 186, 220, .14); +} +.gruppe[data-leer="ja"] .stufe__titel { color: var(--text-leise); } + +/* DER LEER-HINWEIS STEHT UEBER DEN TAFELN, NICHT NEBEN IHNEN. + + Seit dem 08.09.2026 bleiben alle vier Tafeln stehen, auch wenn nichts + drin ist -- damit die Seite bei jeder Rolle gleich aufgebaut ist. + Der Hinweis "Noch keine Calls" ist damit zum GESCHWISTER der Tafeln + geworden, und `.call-brett` ist ein Flex-Kasten in einer Reihe: Er + nahm sich eine Spalte und quetschte die vier Tafeln daneben auf je + 80 Pixel zusammen. Im Bildschirmfoto standen vier Stummel neben + einem breiten Satz. + + `width: 100%` plus Umbruch loest das: Der Hinweis nimmt die ganze + erste Zeile, die vier Tafeln stehen darunter nebeneinander wie + immer. */ +.call-brett { flex-wrap: wrap; } +.call-brett > .leer-hinweis { + width: 100%; + margin-bottom: 4px; +} diff --git a/workspace/assets/css/start.css b/workspace/assets/css/start.css index 64845e15..aad2bd05 100644 --- a/workspace/assets/css/start.css +++ b/workspace/assets/css/start.css @@ -3932,7 +3932,19 @@ body[data-fremde-sicht="ja"]::after { gap: 14px; padding: 13px 15px 13px 17px; border: 1px solid var(--rand); - border-radius: var(--radius-klein); + /* DIE FASE STATT RUNDER ECKEN (08.09.2026). + + Gefunden durch den Formvergleich ueber alle fuenf Rollen: Dieser + Baustein war einer von zweien, die noch runde Ecken trugen -- und + er faellt auf, weil er auf der Startseite direkt unter Kacheln mit + Fase steht. + + Nicht ueber die Modulliste, sondern hier: `::before` traegt die + Farbkante links, und die Modulliste braucht dasselbe Pseudo-Element + fuer ihre Eckwinkel. Die Kante ist an einer Terminzeile die + wichtigere Aussage -- sie sagt, um welche Art Termin es geht. */ + clip-path: polygon(var(--fase, 18px) 0, 100% 0, 100% 100%, 0 100%, 0 var(--fase, 18px)); + border-radius: 0; /* Ein Hauch der Terminfarbe von links, dann nichts mehr. Die Fläche bleibt fast schwarz -- die Farbe soll die Kante betonen, nicht die Karte einfärben. */ @@ -4111,7 +4123,11 @@ body[data-fremde-sicht="ja"]::after { aria-label sagt den ganzen Satz. */ .tagesliste__link { position: absolute; inset: 0; - border-radius: var(--radius-klein); + /* Kein eigener Radius mehr: Die Zeile darueber traegt seit dem + 08.09.2026 die Fase und schneidet mit `overflow: hidden` ohnehin + zu. Ein runder Rand hier wuerde nur beim Lesen behaupten, hier sei + etwas rund -- sichtbar ist er nie. */ + border-radius: 0; } /* "3 weitere Termine heute" -- der Hinweis auf das, was nicht mehr in die Kachel passte. Still gehalten: Er ist ein Wegweiser, keine diff --git a/workspace/assets/js/calls.js b/workspace/assets/js/calls.js index d9774e12..1c2607d0 100644 --- a/workspace/assets/js/calls.js +++ b/workspace/assets/js/calls.js @@ -471,6 +471,17 @@ ziel.textContent = ''; ziel.setAttribute('aria-busy', 'false'); + /* GANZ LEER? DANN TROTZDEM DIE VIER REITER (08.09.2026). + + Hier stand ein `return`: Sind alle vier Gruppen leer, wurde NUR + ein Satz gezeigt und die Seite bestand aus einer Zeile. Wer noch + keine Calls hat -- ein neuer Scout zum Beispiel -- sah damit eine + voellig andere Seite als alle anderen. + + Der Hinweis bleibt, er ist nuetzlich. Er steht jetzt ZUSAETZLICH + ueber den vier gedaempften Reitern statt an ihrer Stelle: Man + sieht auf einen Blick, welche vier Faecher es gibt, dass alle + leer sind, und was zu tun ist, damit sich das aendert. */ if (!daten.offen.length && !daten.anstehend.length && !(daten.serien || []).length && !daten.erledigt.length) { const leer = el('div', 'leer-hinweis'); @@ -479,7 +490,6 @@ a.href = 'kalender.html'; leer.append(a, document.createTextNode(' erscheinen automatisch hier.')); ziel.append(leer); - return; } /* =================================================================== @@ -525,9 +535,31 @@ kommt, der Dienst aber schon neu ist. Eine Oberflaeche, die daran abstuerzt, waere der schlechtere Ausgang. */ const liste = daten[g.schluessel] || []; - if (!liste.length) continue; + + /* ALLE VIER REITER STEHEN IMMER (08.09.2026). + + Filipe, mit zwei Bildschirmfotos nebeneinander: "wieso bei den + scouts so und bei den manager so?" Bei Patrick stand EINE Tafel + ueber die volle Breite, bei Schulle vier nebeneinander. + + Hier stand `if (!liste.length) continue;` -- eine leere Gruppe + wurde gar nicht erst gebaut. Wer nichts Offenes hat, sah + deshalb eine voellig andere Seite als jemand mit Eintraegen, + und zwar nicht "weniger", sondern anders AUFGETEILT: Bei einer + Tafel zieht sich diese ueber die ganze Reihe. + + Derselbe Fehler wie bei den Aufgabenzahlen auf der Startseite, + nur an anderer Stelle -- und dieselbe Loesung: Die Tafel bleibt + stehen, wird GEDAEMPFT (siehe `[data-leer]` in calls.css) und + zeigt eine Null. "Protokoll fehlt: 0" ist eine Aussage, ein + fehlender Reiter ist keine. + + Zugeklappt, wenn leer: Aufklappen wuerde nur eine leere Liste + zeigen. */ + const leer = !liste.length; const s = el('section', 'gruppe'); s.dataset.gruppe = g.schluessel; + if (leer) s.dataset.leer = 'ja'; /* JEDE TAFEL LAESST SICH ZUKLAPPEN, und der Zustand wird gemerkt ("so wie es einem lieb ist gerade"). Der Kopf ist der Schalter, @@ -553,7 +585,7 @@ if (g.frage) koerper.append(el('p', 'block__frage', g.frage)); const schluessel = `calls:${g.schluessel}`; - let zu = g.schluessel === 'erledigt'; + let zu = leer || g.schluessel === 'erledigt'; try { const gemerkt = localStorage.getItem(schluessel); if (gemerkt) zu = gemerkt === 'zu';