From bd21062d29b599d7cef557ded16494bf50667762 Mon Sep 17 00:00:00 2001 From: Dogfather Date: Tue, 8 Sep 2026 17:21:44 +0200 Subject: [PATCH] Alle Seiten folgen derselben Form -- gemessen ueber 18 Seiten und fuenf Rollen Filipe: "die seiten sollen bei jedem aussehen wie bei mir, bei patrick zumbeispiel sieht sehr viel noch nach dem alten muster aus ... alles was sie sehen soll dan auch nach der neuen struktur aufgebaut sein." GEMESSEN STATT GESCHAUT. Das "alte Muster" ist praezise benennbar: runde Ecken (border-radius 18px) statt der gefraesten Fase (clip-path polygon mit 18px). Damit laesst es sich SUCHEN, nicht nur ahnen -- ein Durchlauf ueber alle 18 Seiten in allen fuenf Rollen, der jedes Element ab 260x90 px meldet, das eine eigene Flaeche und runde Ecken hat. vorher 5 Klassen im alten Muster, 90 Seitenaufrufe jetzt 0 Klassen DER GROESSTE EINZELPOSTEN war der Seitenkopf. `.kopf-zeile` trug runde Ecken -- auf VIERZEHN Seiten das erste, was man sieht, direkt neben Kacheln mit Fase. Dazu `.k-kopf` (Kalender), `.steckbrief`, `.k-anlasskarte`, `.k-raster`, `.entscheidung` und die Formulargruppen auf der Profilseite. ZWEI SELEKTOREN MIT BEDACHT, weil derselbe Klassenname zweierlei meint: `.gruppe[data-gruppe]` nur die Reiter auf der Calls-Seite. Auf der Startseite heissen die Bereichsgruppen ebenso, sind aber BEHAELTER fuer Kacheln und duerfen selbst keine sein. `data-gruppe` setzt ausschliesslich calls.js -- nachgeprueft. `fieldset.gruppe` nur die Formularbloecke auf profil.html. Die Startseite baut `section.gruppe`. Das Element unterscheidet sie sauber, die Klasse nicht. BEINAHE FALSCH GEMACHT: Ich war sicher, `.steckbrief` und `.k-anlasskarte` staenden bereits in der Modulliste, und wollte weitersuchen, warum die Regel bei ihnen nicht greift. Nachgesehen: Sie standen gar nicht drin -- ich hatte sie mit `.k-listentag` und einer Liste aus kopf.js verwechselt. Eine plausible Erinnerung ersetzt keinen Blick in die Datei. DIE MODULLISTE STEHT SIEBENMAL WORTGLEICH. Alle sieben ergaenzt; pruef-css-klassen prueft "alle sieben Kopien sind Zeichen fuer Zeichen gleich" und zaehlt jetzt 43 Klassen statt 36. GEPRUEFT: 90 Seitenaufrufe (18 Seiten x 5 Rollen) -> 0 Bausteine im alten Muster 36 Seitenaufrufe auf 360/390/412 px -> 0 px waagerechter Ueberstand pruef-css-klassen EXIT=0, pruef-start-ansicht EXIT=0 (140), pruef-rollen EXIT=0 (97), pruef-abbrechen-optik EXIT=0 (27) Die Handy-Messung gezielt selbst gefahren statt pruef-handy zu starten: Die eine Frage, die diese Aenderung aufwirft, ist der Ueberstand -- in 40 Sekunden beantwortet statt in drei Minuten. Co-Authored-By: Claude Opus 5 --- workspace/assets/css/module.css | 14 +++++++------- workspace/assets/css/start.css | 15 ++++++++++++++- 2 files changed, 21 insertions(+), 8 deletions(-) diff --git a/workspace/assets/css/module.css b/workspace/assets/css/module.css index 73dae7ce..ae2e54b5 100644 --- a/workspace/assets/css/module.css +++ b/workspace/assets/css/module.css @@ -89,7 +89,7 @@ } /* MODULLISTE */ -:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe]) { +:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe) { position: relative; clip-path: polygon(var(--fase) 0, 100% 0, 100% 100%, 0 100%, 0 var(--fase)); border-radius: 0; @@ -117,7 +117,7 @@ was übrig bleibt, ist eine Linie, die exakt der Form folgt, Schräge inklusive. Ein `border` könnte das nicht: Er folgt dem Rechteck. */ /* MODULLISTE */ -:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe])::before { +:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe)::before { content: ""; position: absolute; inset: 0; pointer-events: none; @@ -140,7 +140,7 @@ /* RASTER UND ECKWINKEL. Beides auf ::after -- ein drittes Element gibt es nicht, und beides ist reine Optik ohne Klicks. */ /* MODULLISTE */ -:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe])::after { +:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe)::after { content: ""; position: absolute; inset: 0; pointer-events: none; @@ -224,7 +224,7 @@ /* Dieselbe Form, kleiner -- keine zweite Gestaltung. */ :root { --fase: 12px; } /* MODULLISTE */ - :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe]) { + :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe) { filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .7)); } } @@ -238,15 +238,15 @@ /* Im Kontrastmodus zählt die Kante, und die muss ein echter `border` sein. Die Schräge bleibt: Sie ist Geometrie, keine Farbe. */ /* MODULLISTE */ - :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe]) { + :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe) { filter: none; border: 1px solid CanvasText; } /* MODULLISTE */ - :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe])::after { + :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe)::after { display: none; } /* MODULLISTE */ - :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe])::before { + :is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .dran__punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu, .gruppe[data-gruppe], .kopf-zeile, .k-kopf, .steckbrief, .k-anlasskarte, .k-raster, .entscheidung, fieldset.gruppe)::before { display: none; } } diff --git a/workspace/assets/css/start.css b/workspace/assets/css/start.css index 4a2f98a6..64845e15 100644 --- a/workspace/assets/css/start.css +++ b/workspace/assets/css/start.css @@ -2091,10 +2091,23 @@ body.start > main { position: relative; z-index: 1; } Der Weichzeichner faellt damit auch weg, und das ist gut so: Er holt die Neonfarben von AUSSERHALB der Flaeche herein und hat schon zweimal dafuer gesorgt, dass eine Karte grau statt dunkelblau aussah. */ +/* KEIN `border-radius` MEHR (08.09.2026). + + Filipe: "die seiten sollen bei jedem aussehen wie bei mir, bei + patrick zumbeispiel sieht sehr viel noch nach dem alten muster aus." + + Der Seitenkopf trug runde Ecken, waehrend jede Kachel daneben die + gefraeste Fase hat -- auf VIERZEHN Seiten das erste, was man sieht. + Er steht jetzt in der Modulliste von module.css und bekommt damit + dieselbe Form, dieselben Eckwinkel und denselben Innenschatten wie + alles andere. + + Der Radius entfaellt ersatzlos: `clip-path` schneidet ohnehin nach + der Fase, ein zusaetzlicher Radius waere wirkungslos und wuerde beim + Lesen nur behaupten, hier sei etwas rund. */ body.start .kopf-zeile, body.start .k-kopf { padding: 20px 24px; - border-radius: var(--radius); background: linear-gradient(180deg, rgba(6, 9, 16, .74), rgba(6, 9, 16, .58)); backdrop-filter: blur(14px) saturate(.9); -webkit-backdrop-filter: blur(14px) saturate(.9);