/* --------------------------------------------------------------------- * Profilstatus-Icon in der Topbar - die Auswahl * * ARBEITSTEILUNG: * Plugin setzt den Zustand am : * * (includes/profil-status-icon.php) * Bricks liefert Icon und Panel samt Gestaltung * Diese entscheidet, welche Teile zu sehen sind, wie das Icon * Datei aussieht und wo der Punkt sitzt * * Design-Vorlage: profilstatus-panel-mockup.html (Sven, 12.09.2026). * * DOM-Vertrag (in Bricks zu setzen): * * [data-sw-dropdown="status"] Wrapper * [data-sw-dropdown-ausloeser] Div mit HTML-Tag "button" * [data-sw-status-icon] das Icon * [data-sw-dropdown-panel] Klappteil * Kopf "Deine öffentliche Seite" ohne Attribut, steht fest * [data-sw-status-badge="…"] × 6 das Etikett * Trenner ohne Attribut, steht fest * [data-sw-status-text="…"] × 6 der Absatz * [data-sw-status-aktion="…"] × 5 EIN Element je Zustand mit * Aktion; bei zwei Knöpfen * ein Wrapper um beide * [data-sw-einreichen] Knopf "Seite einreichen" / * "Erneut einreichen" * [data-sw-einreichen-notiz] Zeile unter dem gesperrten * Knopf * [data-sw-einreichen-fehler] Fehlerzeile, hidden * * Die Aktion kennt sieben Werte: not_published, bereit, submitted, * revision_required, published, incomplete, paused - ohne paused als * Element (siehe --sw-status-ohne-aktion). * * ETIKETT UND ABSATZ KENNEN ZWEI MEHR: published-uebungsberatung und * published-regulaer. Bei published zeigen beide den Modus * ("Übungsphase" / "Regulär"); das Etikett seit 18.09.2026, der Absatz * seit 28.09.2026 - vorher teilten sich Übung, regulär und der Rückfall * denselben Absatz. * * 🔴 DIESELBE WEICHE, NICHT ZWEI: Etikett und Absatz stehen unten * untereinander und nennen dieselben drei Fälle in derselben * Reihenfolge. Wer einen ändert, ändert beide. * * Seit 20.09.2026 sind Etikett und Absatz die einzigen Stellen im * Statusmenü, an denen der Modus steht - am Icon steht er nicht mehr. * Das schlichte "published" bleibt als Rückfall, wenn der Modus leer * oder unbekannt ist - sonst stünde dort gar nichts. * * ACHT ANZEIGEN, HÖCHSTENS EIN MARKER JE ANZEIGE (18./19.09.2026): * (Der Marker ist seit 20.09.2026 immer der Punkt - siehe unten.) * * # Anzeige Globus Marker * 1 nicht öffentlich grau - not_published + data-sw-weg-offen * 2 bereit zum Einreichen grau Punkt grün not_published ohne data-sw-weg-offen * 3 in Prüfung grau Punkt gelb submitted * 4 Überarbeitung nötig grau Punkt rot revision_required * 5 öffentlich, Übung grün - published + data-sw-profil-modus="uebungsberatung" * 6 öffentlich, regulär grün - published + data-sw-profil-modus="regulaer" * 7 pausiert grau - paused * 8 pausiert (automatisch) grau Punkt rot incomplete * * Globus = "bin ich öffentlich?", Punkt = Ampel ("gibt es etwas zu * tun?"). MEHR STEHT AM ICON NICHT. Der Globus ist in beiden Phasen * grün und in beiden gleich. * * 🔴 AM ICON STEHT NICHTS ÜBER DEN MODUS (20.09.2026, Entscheidung * Sven). Vier Versuche an einem Tag sind gescheitert - Buchstabe, * Pflanze, Blatt, gefüllter Globus -, jeder aus einem anderen Grund. * Das lag nicht an den Lösungen, sondern an der Aufgabe: Der Modus * ändert sich EINMAL im ganzen Weg, sie weiss ihn, er kann ihr nicht * entgehen, und er steht an zwei Stellen in Worten (Etikett im * Statusmenü, Statusleiste der Seite). * * 🔴 REGEL FÜR DAS NÄCHSTE MAL: Ein Marker verdient seinen Platz nur, * wenn er etwas zeigt, das sich ÄNDERT und OFT GEBRAUCHT wird. Der * Punkt erfüllt beides, der Modus keines von beidem. Wer hier wieder * ein Zeichen anbringen will, prüft zuerst diese zwei Fragen - nicht * die Form. * * ✅ Damit ist auch die Kopplung an den Untergrund von .app-button * aufgelöst: Es gibt kein Element mehr, das den Hintergrund des * Auslösers nachahmen müsste. Der Abnahmepunkt "kein heller Rand im * Hover und Fokus" entfällt ersatzlos - er war nie prüfbar. * * data-sw-profil-modus bleibt am und bleibt gültig: Die * ETIKETTEN unterscheiden die Phasen weiterhin * (published-uebungsberatung / published-regulaer). Nur am Icon wirkt * das Attribut nicht mehr. * * 🔴 ZUSTAND 8 IST EIN STATUSWERT: incomplete. Die Automatik * schreibt ihn (src/Application/Profile/StatusAutomatik.php), und die * Seite ist dann offline. Etikett, Absatz und Aktion tragen den Wert * "incomplete" und sagen "Pausiert" (Wortlaut 23.09.2026). * * ✅ DER ABGELEITETE WEG IST WEG (23.09.2026): kein * data-sw-profil-unvollstaendig mehr, kein zweiter Wert am Etikett, * und damit auch keine Vorrangregel "paused schlägt unvollständig" - * zwei Zustände können sich nicht mehr überlagern, weil es nur noch * EINEN Wert gibt. * * 🔴 "bereit" IST KEIN profile_status (16.09.2026). Es heisst: * not_published, und der Weg ist vollständig. Dafür setzt das Plugin ein * ZWEITES Attribut am , data-sw-weg-offen, solange noch etwas fehlt * - nur bei not_published und revision_required, im Zweifel gesetzt * (includes/profil-status-icon.php, sichtwechsel_profil_weg_offen()). * Die Regeln unten kombinieren beide Attribute. * * Ein Zustand ohne Aktion (paused) bekommt in Bricks schlicht * kein Aktions-Element. WELCHE das sind, steht in * --sw-status-ohne-aktion (unten) - der Kopplungsdraht liest die * Soll-Anzahl daraus, nicht aus einer getippten Zahl. * * 🔴 DIE MARKER BEKOMMEN FESTE WERTE, NIEMALS EINEN * DYNAMIC-DATA-TAG. Löst ein Tag leer auf, lässt Bricks das gesamte * Attribut weg - der Marker verschwände genau im Zustand, in dem er * gebraucht wird (Stolperstein 01.09.2026). * * ⚠️ KEIN AUFBLITZEN: Das Attribut kommt vom Server mit dem HTML. * Diese Regeln greifen ab der ersten gerenderten Zeile - anders als am * 09.09., wo JavaScript nachträglich versteckt hat. * * ⚠️ ZWEI SPEZIFITÄTS-EBENEN MIT ABSICHT - wie in dropdown.css: * Zustandsregeln (0,3,0) und mehr, müssen gegen Bricks' * .klasse.brxe-div (0,2,0) gewinnen * Badge-Flächen (0,1,0), sollen gegen jede Bricks-Klasse * VERLIEREN - sie sind ein Vorgabewert, keine * Vorschrift * ------------------------------------------------------------------- */ :root { /* --------------------------------------------------------------- * Icon * --------------------------------------------------------------- */ /* Inaktiv: heller als der Fließtext, damit es zurückgenommen wirkt (Mockup). ⚠️ KEIN CORE-FRAMEWORK-TOKEN - das nächste, --status-neutral-dark #B7B7B2, liegt ΔE 6,6 daneben und ist warm statt kühl. Kontrast auf Weiss 2,21, unter dem Grafik-Mindestwert 3,0; tragbar nur, weil der Zustand zusätzlich als Text im Panel steht. Siehe Bericht vom 12.09.2026. */ --sw-status-grau: #A7B0B4; --sw-status-gruen: var(--brand-green-900); /* --------------------------------------------------------------- * Der Punkt in der Topbar - gemeinsam mit der Glocke * * 🔴 NEUTRAL BENANNT, NICHT --sw-status-…: Die Glocke bekommt * später denselben Punkt und liest DIESE Variablen, keine eigenen. * Beide Punkte stehen gleichzeitig nebeneinander - jede Abweichung * in Farbe, Grösse oder Lage fiele sofort auf. Eine Stelle, * zwei Punkte. * * Geladen wird die Datei auf jeder App-Seite (class-assets.php, ohne * Bedingung) - die Glocke findet die Werte also überall, wo sie * steht. Kommt eine gemeinsame Topbar-Datei, zieht dieser Block * dorthin um, nicht in eine Kopie. * * Bewusst NICHT --status-dot-size aus list-engine.css: Das ist der * Terminstatus in der Liste, ein anderes Signal an anderem Ort. * Beide sind heute 8px, sollen sich aber getrennt ändern können. * --------------------------------------------------------------- */ /* ⚠️ KEIN PASSENDES TOKEN für den Ton im Mockup (#D08A14). --status-yellow-dark ist das nächste, liegt aber ΔE 14,9 daneben - gelber, weniger orange. Referenziert statt erfunden, bis Sven ein Token anlegt. */ --sw-topbar-punkt-farbe: var(--status-yellow-dark); /* Grün bei "bereit": du KANNST einreichen. Gelb oben: du MUSST etwas tun. Kein Punkt: nichts zu tun. --status-green-dark (#7EAC67) ist deutlich heller als das Dunkelgrün des Icons bei published - grüner Punkt heisst "kannst einreichen", grünes Icon "ist online" (Entscheidung E, 15.09.2026). Nur das Statusicon liest diese Variable; die Glocke kennt keinen "bereit"-Zustand. */ --sw-topbar-punkt-farbe-bereit: var(--status-green-dark); /* Punktfarben des Statusicons (18.09.2026). Farbabstand ΔE (CIE76) zum Untergrund des Auslösers: Ruhe weiss, Hover/Offen --brand-green-60 #EDEDE6. warten --status-yellow-dark #D7A82D ΔE 71 / 66 in Prüfung handeln --status-red-dark #C9786C ΔE 55 / 50 Überarbeitung, etwas fehlt bereit --status-green-dark #7EAC67 ΔE 54 / 48 (oben) Untereinander: rot-gelb ΔE 53, rot-grün 60, gelb-grün 49 - als Farben klar getrennt. Kontrast auf Weiss 3,3 / 2,2 / 2,6: nur Rot erreicht den Grafik-Mindestwert 3,0. Tragbar, weil der Zustand immer auch als Text im Panel steht (Etikett und Absatz). Rot ist --status-red-dark, nicht die "Brand Red"-Gruppe: Die enthält Orange- und Pfirsichtöne (15_Design_Tokens, Abschnitt 7d). --sw-topbar-punkt-farbe (oben, gelb) bleibt der Vorgabewert für die Glocke; das Statusicon setzt je Zustand eine eigene Farbe. */ --sw-topbar-punkt-farbe-warten: var(--status-yellow-dark); --sw-topbar-punkt-farbe-handeln: var(--status-red-dark); --sw-topbar-punkt-groesse: 8px; /* Abstand von der oberen und rechten Kante des Auslösers. Geht von 38 × 38 aus (Klickfläche im Mockup); hat die Glocke eine andere Grösse, stimmt die Lage nur, wenn sie ebenfalls 38 × 38 hat. 7px / 5px (Sven, Sichtprüfung live 14.09.2026). Bei 4px stand der Punkt zu weit vom Globus ab. DIE RECHNUNG DAZU - der Globus-Kreis füllt die Icon-Box NICHT aus: Phosphor zeichnet ihn in viewBox 256 mit r = 96, also rund 75 % der Box. (Die 4px-Rechnung davor setzte Kreis = Box und war deshalb zu vorsichtig.) Punktmitte (38 - 5 - 4 | 7 + 4) = (29 | 11) Iconmitte (19 | 19) Abstand √(10² + 8²) = 12,8px nächster Rand 12,8 - 4 (Punktradius) = 8,8px Kreis bei 20px 96/256 × 20 = 7,5px -> 1,3px Luft ⚠️ DIE 1,3px GELTEN FÜR EIN 20px-ICON UND BIS ZUR MITTELLINIE DES STRICHS. Bis zum äusseren Strichrand (regular: 16/256) bleiben bei 20px rund 0,7px. Bei 22px (Icongrösse im Mockup) berührt der Punkt den Strich. Wird das Icon grösser, muss der Punkt nach aussen. Die gerundete Fläche verlässt der Punkt bei keinem Eckradius, auch nicht vollrund (38px Kreis). Deshalb braucht er keinen Ring - Begründung an der Punktregel unten. Wer oben/rechts VERKLEINERT oder das Icon VERGRÖSSERT, holt die Überlappung und damit die Ringfrage zurück; Schwelle ist, wo "nächster Rand" unter den äusseren Strichrand des Kreises fällt. */ --sw-topbar-punkt-oben: 7px; --sw-topbar-punkt-rechts: 5px; /* --------------------------------------------------------------- * Badge-Flächen - vier Töne für fünf Zustände * * 🔴 ZWEI TÖNE, NICHT EINER, für "in Prüfung" und "Überarbeitung * nötig": Trügen beide dieselbe Warnfarbe, sagte die Farbe * "Achtung" und der fehlende Punkt "alles gut" - zwei Aussagen im * selben Bild (Mockup). * * Neutral und Online treffen ein Token genau bzw. nah. Die beiden * warmen Töne sind VORSCHLÄGE aus bestehenden Tokens, gemessen gegen * das Mockup und gegeneinander - Bestätigung durch Sven steht aus. * Das naheliegendste Sand-Token, --brand-yellow-50, fällt aus: Es * liegt nur ΔE 2,5 neben der neutralen Fläche, "in Prüfung" sähe * dann aus wie "noch nicht veröffentlicht". * * --brand-red-100 ist im Framework doppelt vergeben und wird nicht * verwendet (15_Design_Tokens_Core_Framework.md, Abschnitt 7c). * --------------------------------------------------------------- */ --sw-status-badge-neutral: var(--brand-green-60); /* ΔE 0,0 zum Mockup */ --sw-status-badge-pruefung: var(--status-yellow-light); /* Vorschlag, ΔE 6,4 */ --sw-status-badge-anmerkung: var(--brand-red-700); /* Vorschlag, ΔE 2,7 */ --sw-status-badge-online: var(--status-green-light); /* ΔE 3,5 zum Mockup */ /* ⚠️ VORSCHLAG, nicht entschieden (16.09.2026): "bereit" trägt die neutrale Fläche von "nicht online". Grün ist dem Online-Etikett vorbehalten; das Signal für "bereit" sind grüner Punkt und Wortlaut. */ --sw-status-badge-bereit: var(--sw-status-badge-neutral); /* incomplete ("Pausiert") trägt die Fläche von "Überarbeitung nötig": dieselbe Aussage - du musst etwas tun. Der Unterschied steht im Wortlaut. Der Name des Tokens stammt aus der Zeit des abgeleiteten Wegs; er bleibt, damit nicht dieselbe Runde zweimal angefasst wird. */ --sw-status-badge-unvollstaendig: var(--sw-status-badge-anmerkung); /* --------------------------------------------------------------- * Vertrag für den Kopplungsdraht: Zustände OHNE Aktions-Element * * 🔴 DIE EINE STELLE, AN DER DAS STEHT (Entscheidung D, 15.09.2026). * Das CSS unten nennt für data-sw-status-aktion alle sechs Werte - es * blendet je Zustand "alles andere" aus und kann nicht ausdrücken, * dass ein Zustand gar keine Aktion hat. Deshalb hier. Der Draht * rechnet: Werte im CSS minus diese Liste = Soll-Anzahl. Kommt ein * Zustand dazu, bringt er seine Zahl selbst mit; nirgends steht eine. * * Wird von keiner Regel benutzt - nur gelesen. Kommaliste, oder * "none", wenn jeder Zustand eine Aktion hat. * * paused (19.09.2026, wieder): Der Weg aus der gesetzten Pause führt * über uns, nicht über eine Seite - der Absatz sagt es. Die Fassung * "none" vom 18.09. ist zurückgenommen. * --------------------------------------------------------------- */ --sw-status-ohne-aktion: paused; /* Gesperrter Einreichen-Knopf (Abschnitt 3b). */ --sw-einreichen-gesperrt-deckkraft: 0.5; } /* --------------------------------------------------------------------- * 1. Welche Teile sind zu sehen * * 🔴 VERSTECKEN, WAS NICHT GILT - NIE ANZEIGEN, WAS GILT. * * Je Zustand eine Regel: "blende aus, was NICHT dieser Zustand ist." * Die passenden Teile werden nie angefasst. Dreimal dieselbe Mechanik, * einmal je Attribut. * * Warum keine An-Regel (Befund 12.09.2026, zwei Fehler): * * 1. Ein Paar aus Aus- und An-Regel überholt sich selbst: Die * Aus-Regel braucht (0,3,0) gegen Bricks und liegt damit über * der eigenen An-Regel. In der ersten Fassung war in KEINEM * Zustand eine Zeile sichtbar. * 2. Eine An-Regel MUSS einen display-Wert setzen und überschreibt * damit Bricks' Layout. Die Zeilen sind Flex-Container; eine * An-Regel hätte daraus block gemacht. * * Negativ formuliert gibt es nichts einzublenden - keine * Gegenrichtung, keinen geratenen display-Wert, keinen * Spezifitätsträger. Dasselbe Muster wie beim Dropdown-Panel. * * Spezifität je Selektor: Attribut am (0,1,0) + Attribut am * Element (0,1,0) + :not(), das die Spezifität seines Arguments erbt * (0,1,0) = (0,3,0). * * ⚠️ OHNE ATTRIBUT AM GREIFT KEINE DIESER REGELN - und dann * wäre ALLES zu sehen. Dafür steht 1-0 direkt darunter. * ------------------------------------------------------------------- */ /* 1-0. Kein Zustand: das Statusmenü als Ganzes ausblenden * * 🔴 "VERSTECKEN STATT ANZEIGEN" IST INNERHALB EINES ZUSTANDS RICHTIG - * DER FALL "GAR KEIN ZUSTAND" IST DAMIT NICHT ABGEDECKT UND BRAUCHT * EINE EIGENE REGEL. Wer nur versteckt, was nicht passt, zeigt alles, * wenn nichts passt. * * Kein Attribut am heisst: abgemeldet, kein * familienbegleitung-Profil oder ein unbekannter Wert im Feld * (includes/profil-status-icon.php lässt es dann ganz weg). Bricks gibt * das Statusmenü trotzdem aus. Ohne diese Regel sah am 14.09.2026 jede * Person ohne Profil alle fünf Badges, alle fünf Absätze und alle * Aktionen zugleich - live bemerkt, als Sven als Administrator ohne * Profil eingeloggt war. Abnahmepunkt 7 im Auftrag war deshalb nie * erfüllt. * * Doppeltes Attribut: (0,3,1), wie die übrigen Zustandsregeln - eine * Bricks-Klasse mit display am Wrapper ist (0,2,0) und verliert. Eine * Element-ID von Bricks (#brxe-…) würde gewinnen; display am Wrapper * gehört deshalb an die Klasse, nicht ans Element. */ html:not([data-sw-profil-status]) [data-sw-dropdown="status"][data-sw-dropdown] { display: none; } /* 1-0b. Kein Zustand: JEDES Werte-Element ausblenden, wo es auch steht * * 🔴 NICHT NUR IM STATUSMENÜ (19.09.2026). data-sw-status-badge steht * seit dem 19.09. auch in der Statusleiste der App-Seite "Öffentliche * Seite" - dort mit allen neun Werten, ausserhalb des Statusmenüs. Die * Regel oben blendet nur das Menü aus; ohne Zustand am griffe dort * keine Versteck-Regel, und alle neun Etiketten stünden zugleich da. * Derselbe Fehler wie am 13./14.09., an einer neuen Stelle. * * Deshalb auf die Werte verallgemeinert: ohne Zustand ist jedes Etikett, * jeder Absatz und jede Aktion verdeckt, unabhängig vom Ort. Die Regel * für das Menü bleibt, damit auch Auslöser und Hülle verschwinden. * * Doppeltes Attribut: (0,3,1) - gewinnt gegen eine Bricks-Klasse * (0,2,0), wie die übrigen Zustandsregeln. */ html:not([data-sw-profil-status]) [data-sw-status-badge][data-sw-status-badge], html:not([data-sw-profil-status]) [data-sw-status-text][data-sw-status-text], html:not([data-sw-profil-status]) [data-sw-status-aktion][data-sw-status-aktion], html:not([data-sw-profil-status]) [data-sw-status-icon][data-sw-status-icon] { display: none; } /* not_published IST ZWEI ZUSTÄNDE (16.09.2026): mit data-sw-weg-offen * gelten die Teile "not_published", ohne die Teile "bereit". Spezifität * dieser Selektoren (0,4,0) - ein Attribut mehr als die übrigen, gewinnt * also ebenso gegen Bricks. */ /* 1a. Das Etikett */ [data-sw-profil-status="not_published"][data-sw-weg-offen] [data-sw-status-badge]:not([data-sw-status-badge="not_published"]), [data-sw-profil-status="not_published"]:not([data-sw-weg-offen]) [data-sw-status-badge]:not([data-sw-status-badge="bereit"]), [data-sw-profil-status="submitted"] [data-sw-status-badge]:not([data-sw-status-badge="submitted"]), [data-sw-profil-status="revision_required"] [data-sw-status-badge]:not([data-sw-status-badge="revision_required"]), [data-sw-profil-status="published"]:not([data-sw-profil-modus="uebungsberatung"]):not([data-sw-profil-modus="regulaer"]) [data-sw-status-badge]:not([data-sw-status-badge="published"]), [data-sw-profil-status="published"][data-sw-profil-modus="uebungsberatung"] [data-sw-status-badge]:not([data-sw-status-badge="published-uebungsberatung"]), [data-sw-profil-status="published"][data-sw-profil-modus="regulaer"] [data-sw-status-badge]:not([data-sw-status-badge="published-regulaer"]), [data-sw-profil-status="incomplete"] [data-sw-status-badge]:not([data-sw-status-badge="incomplete"]), [data-sw-profil-status="paused"] [data-sw-status-badge]:not([data-sw-status-badge="paused"]) { display: none; } /* Ohne Modus UND bei einem Modus, den diese Datei nicht kennt, gilt das * schlichte Etikett "published" (erste der drei Regeln) - so ist in * jedem Fall genau eines zu sehen. Das Plugin setzt ohnehin nur * uebungsberatung und regulaer (SICHTWECHSEL_PROFIL_STATUS_MODI). */ /* 1b. Der Absatz */ [data-sw-profil-status="not_published"][data-sw-weg-offen] [data-sw-status-text]:not([data-sw-status-text="not_published"]), [data-sw-profil-status="not_published"]:not([data-sw-weg-offen]) [data-sw-status-text]:not([data-sw-status-text="bereit"]), [data-sw-profil-status="submitted"] [data-sw-status-text]:not([data-sw-status-text="submitted"]), [data-sw-profil-status="revision_required"] [data-sw-status-text]:not([data-sw-status-text="revision_required"]), [data-sw-profil-status="published"]:not([data-sw-profil-modus="uebungsberatung"]):not([data-sw-profil-modus="regulaer"]) [data-sw-status-text]:not([data-sw-status-text="published"]), [data-sw-profil-status="published"][data-sw-profil-modus="uebungsberatung"] [data-sw-status-text]:not([data-sw-status-text="published-uebungsberatung"]), [data-sw-profil-status="published"][data-sw-profil-modus="regulaer"] [data-sw-status-text]:not([data-sw-status-text="published-regulaer"]), [data-sw-profil-status="incomplete"] [data-sw-status-text]:not([data-sw-status-text="incomplete"]), [data-sw-profil-status="paused"] [data-sw-status-text]:not([data-sw-status-text="paused"]) { display: none; } /* 1c. Knopf und Link */ [data-sw-profil-status="not_published"][data-sw-weg-offen] [data-sw-status-aktion]:not([data-sw-status-aktion="not_published"]), [data-sw-profil-status="not_published"]:not([data-sw-weg-offen]) [data-sw-status-aktion]:not([data-sw-status-aktion="bereit"]), [data-sw-profil-status="submitted"] [data-sw-status-aktion]:not([data-sw-status-aktion="submitted"]), [data-sw-profil-status="revision_required"] [data-sw-status-aktion]:not([data-sw-status-aktion="revision_required"]), [data-sw-profil-status="published"] [data-sw-status-aktion]:not([data-sw-status-aktion="published"]), [data-sw-profil-status="incomplete"] [data-sw-status-aktion]:not([data-sw-status-aktion="incomplete"]), [data-sw-profil-status="paused"] [data-sw-status-aktion]:not([data-sw-status-aktion="paused"]) { display: none; } /* --------------------------------------------------------------------- * 1d. Die offenen Punkte im Panel - dieselben Zeilen, kleinere Kreise * * Die Zeilen im Aktions-Wrapper kommen aus [sichtwechsel_offene_punkte] * und tragen die Klassen der Weg-Karte; ihre Gestaltung liegt in * assets/css/weg-karte.css und wird geteilt, nicht nachgebaut * (includes/weg-karte.php, sichtwechsel_weg_karte_punkte_html()). * * 🔴 NUR DIE GRÖSSE WEICHT AB (Sven, 29.09.2026): 22px statt 30px. In * der Karte trägt der Kreis eine ganze Zeile, im Panel steht er in einem * schmalen Kasten. Geändert wird deshalb NUR die Variable, nicht die * Regel - Abstände, Farben und der Pfeil bleiben, wie sie sind, und eine * Änderung an der Karte zieht hier weiterhin mit. * * Auf dem Panel und nicht auf der Liste selbst: So gilt sie für alles, * was künftig im Panel dieselben Zeilen benutzt. * ------------------------------------------------------------------- */ [data-sw-dropdown-panel] { --sw-weg-zeichen-groesse: 22px; /* Die Fläche der Zeilen. Im Panel liegen sie neben den übrigen Aktionen und sollen aussehen wie diese: grauer Grund, abgerundet. Der Radius kommt aus der geteilten Regel, nur die Farbe von hier. Der Überfahr-Ton bleibt der geteilte (--sw-weg-hover, #F7F7F4): Auf der weissen Karte dunkelt er ab, auf der grauen Fläche hellt er auf - beide Male ist der Wechsel sichtbar. Zwei Töne für dieselbe Geste wären zwei Wahrheiten. ⚠️ VORSCHLAG, KEINE VORSCHRIFT: Der Ton ist der neutrale der App (--brand-green-60, #EDEDE6 - derselbe wie das Etikett "Nicht online"). Die übrigen Aktionen im Panel gestaltet Sven in Bricks; weicht sein Ton ab, gewinnt er. Diese Regel setzt nur eine Variable und trägt keine eigene Spezifität in die Zeile. */ --sw-weg-schritt-flaeche: var(--sw-status-badge-neutral); } /* --------------------------------------------------------------------- * 2. Die Badge-Flächen * * Jedes Badge-Element steht in Bricks für genau einen Zustand - es * braucht deshalb keine Zustandsregel, nur den festen Wert am Element. * * BEWUSST (0,1,0): Setzt Sven in Bricks eine eigene Fläche, gewinnt * seine. Diese Regeln sind der Vorgabewert, nicht die Vorschrift. * Schrift, Innenabstand und Radius bleiben ganz in Bricks. * ------------------------------------------------------------------- */ [data-sw-status-badge="not_published"], [data-sw-status-badge="paused"] { background-color: var(--sw-status-badge-neutral); } [data-sw-status-badge="incomplete"] { background-color: var(--sw-status-badge-unvollstaendig); } [data-sw-status-badge="submitted"] { background-color: var(--sw-status-badge-pruefung); } [data-sw-status-badge="revision_required"] { background-color: var(--sw-status-badge-anmerkung); } [data-sw-status-badge="published"], [data-sw-status-badge="published-uebungsberatung"], [data-sw-status-badge="published-regulaer"] { background-color: var(--sw-status-badge-online); } [data-sw-status-badge="bereit"] { background-color: var(--sw-status-badge-bereit); } /* --------------------------------------------------------------------- * 3. Das Icon * * Grau ist der Normalfall, dunkelgrün der eine Zustand, der gut * ausgeht. Über color und currentColor - das wirkt an einem * genauso wie an einem , anders als der Punkt unten. * ------------------------------------------------------------------- */ [data-sw-profil-status] [data-sw-status-icon][data-sw-status-icon] { color: var(--sw-status-grau); } [data-sw-profil-status="published"] [data-sw-status-icon][data-sw-status-icon] { color: var(--sw-status-gruen); } /* Farbe auch am AUSLÖSER, ausdrücklich (18.09.2026). Er ist ein Div mit HTML-Tag "button" und erbte sonst color: buttontext - auf iOS blau. Seit 20.09.2026 hängt kein Pseudoelement mehr daran; die Regel bleibt trotzdem nötig, sie färbt das Icon über die Vererbung. (0,4,0) wie die Punktregeln - gewinnt gegen .app-button:hover und jede Bricks-Klasse. */ [data-sw-profil-status] [data-sw-dropdown="status"][data-sw-dropdown] [data-sw-dropdown-ausloeser] { color: var(--sw-status-grau); } [data-sw-profil-status="published"] [data-sw-dropdown="status"][data-sw-dropdown] [data-sw-dropdown-ausloeser] { color: var(--sw-status-gruen); } /* --------------------------------------------------------------------- * 3b. Einreichen - gesperrt, solange der Weg offen ist * * Betrifft den Knopf "Erneut einreichen" bei revision_required. Der Knopf * "Seite einreichen" steht nur im Zustand "bereit" und ist dort nie * gesperrt. * * Sichtbar gesperrt ab der ersten Zeile - das Attribut am kommt * vom Server. Für Vorlesesoftware setzt assets/js/modules/app/weg-karte.js * aria-disabled und verbindet die Notiz; einen Klick schickt es nicht ab. * * Die Notiz ("Sobald alle Schritte erledigt sind, kannst du * einreichen.", "Schritte" als Link aufs Dashboard) ist nur zu sehen, * solange der Weg offen ist. * * Doppelte Attribute: (0,3,0) bzw. (0,3,1) - gewinnen gegen eine * Bricks-Klasse am Element. Die Deckkraft ist eine Variable. * ------------------------------------------------------------------- */ [data-sw-weg-offen] [data-sw-einreichen][data-sw-einreichen] { opacity: var(--sw-einreichen-gesperrt-deckkraft); cursor: not-allowed; } html:not([data-sw-weg-offen]) [data-sw-einreichen-notiz][data-sw-einreichen-notiz] { display: none; } /* --------------------------------------------------------------------- * 4. Der Punkt * * rot du MUSST etwas tun revision_required, published + unvollständig * gelb es läuft, warte submitted * grün du KANNST einreichen not_published, Weg vollständig * keiner not_published mit offenem Weg, published, paused * * Nicht bei not_published mit offenem Weg: Ein Punkt, der während der * ganzen Einrichtung leuchtet, wird Teil des Icons. Nicht bei published: * Dort ist das Icon selbst grün - das ist die ganze Aussage, ein zweites * Zeichen kommt nicht dazu. * * ⚠️ submitted MIT GELBEM PUNKT (18.09.2026): Am 14.09. war ein Punkt bei * submitted abgelehnt ("dort gibt es nichts zu tun"). Das Konzept * Sichtbarkeitsstatus ist neuer; der Punkt ist gebaut. Zurücknehmen ist * eine Zeile: den submitted-Selektor unten streichen. * * 🔴 KEIN PUNKT BEI paused (19.09.2026, Entscheidung_Zwei_Pausen_getrennt): * Die gesetzte Pause ist entschieden - für die Begleiterin gibt es dort * nichts zu tun. Ein Marker, der bei "nichts zu tun" leuchtet, ist nach * zwei Wochen keiner mehr. Der rote Punkt vom 18.09. ist zurückgenommen. * * revision_required und "etwas fehlt" (Zustand 8) sehen gleich aus und * verlangen dasselbe; sie unterscheiden sich im Panel, nicht im Icon. * Rot war bei revision_required bis 18.09. gelb. * * 🔴 DAS ICON BLEIBT BEI "bereit" GRAU, nur der Punkt ist grün * (Entscheidung C, 15.09.2026). * * 🔴 DER PUNKT HÄNGT AM AUSLÖSER, NICHT AM ICON (12.09.2026). * * In der vorigen Fassung stand er als ::after am [data-sw-status-icon]. * Die Messung meldete "8px" - und war hohl. Im Browser nachgestellt: * * ::after an berechneter Stil 8px, NICHTS gezeichnet * ::after an berechneter Stil 8px, NICHTS gezeichnet * ::after an gezeichnet * ::after an