Alles fertig: Konsole montiert, Tageskachel als Instrument, zwei Seiten repariert

DIE KONSOLE -- DREI STUFEN DRAUF

  1. VIER NIETEN in den vier Fasen. Das Einzige, was eine Flaeche
     endgueltig zu einem GEGENSTAND macht, ist die Frage, wie sie
     befestigt ist. Ein Gehaeuse haengt nicht in der Luft.
  2. EINE GEFRAESTE NUT trennt Text von Instrumenten -- dunkel auf der
     Lichtseite, hell auf der Schattenseite. Genau umgekehrt zu einer
     aufgemalten Linie, und deshalb sieht sie nach Material aus.
  3. DIE UHR SITZT IN EINER MULDE statt auf der Platte.

Drei Fehler dabei, alle im Bildschirmfoto gesehen: Die Nieten waren
QUADRATE (eine Hintergrundebene laesst sich nicht runden -- jetzt aus
Radialverlaeufen, die selbst rund sind). Die Mulde lag UEBER der Uhr
und hat die polierte Luenette zu mattem Grau gedaempft (`::after` wird
nach allen Kindern gezeichnet). Und das Raster musste von der
Nieten-Ebene herunter: Eine Ebene hat nur EINE Deckkraft.

DIE TAGESKACHEL "WAS IST DRAN"

Die drei Zeilen sind jetzt MODULE -- Fase, Kantenlicht in der Farbe
ihres Bereichs, Eckwinkel. Sie sind damit kleine Ausgaben derselben
Bauteile, zu denen sie fuehren, was sie ja auch sind. Die ZAHL wurde
zum gefassten Schild wie das Zeichen auf den Kacheln, und zwischen den
Haelften laeuft dieselbe gefraeste Nut wie auf der Konsole.

Ein Rueckschritt dabei, von der Pruefung sofort gemeldet: Ich hatte
die Ziffer weiss gemacht, weil das auf Metall gut aussieht -- damit
war ihre Aussage weg. Die Zahl traegt die Farbe ihres Bereichs und bei
etwas Ueberfaelligem die Warnfarbe; das ist die schnellste Auskunft der
ganzen Kachel. Die Farbe gehoert in die Ziffer, nicht ins Schild.

SPICY MEDIA SIEHT DIE ZAHLEN JETZT NIRGENDS

Vorher nur Kachel und Seite -- die Creator-Zahlen standen weiterhin im
Dashboard, weil das sie ueber eine eigene Schnittstelle holt. Die ist
jetzt zu (404 am Server, nicht in der Oberflaeche). Das Dashboard
bleibt fuer sie stehen: Es faengt den Fehlschlag ausdruecklich ab.
Mit Pruefung und Gegenprobe.

UND ZWEI SEITEN, DIE BEIM ANSEHEN AUFFIELEN

Das ist der Ertrag der Durchsicht jener zwoelf Seiten, die bisher nur
GEPRUEFT und nie ANGESEHEN worden waren:

  * chat.html und uebersicht.html luden kopf.js OHNE wahl.js. Der
    Umschalter "Meine Sicht" fiel dort auf das nackte Systemfeld
    zurueck: 92 x 19 px, grauer Kasten, Systemschrift -- auf allen
    anderen Seiten ist es ein selbst gebautes Bedienelement, hinter dem
    dasselbe Feld unsichtbar bei 2 x 2 px liegt. Kaputt war nichts. Es
    sah nur aus wie aus einem anderen Programm, und genau das findet
    keine Pruefung, die auf Fehlermeldungen achtet.
    Neue Pruefung: Wer kopf.js laedt, muss wahl.js laden -- und vorher.
  * Der Chat-Rahmen gehoerte als einzige grosse Flaeche noch nicht zum
    Modulsystem. Jetzt schon.

18 Pruefungen gelaufen, alle gruen. Rechner und Handy angesehen,
dazu Kalender, Chat, Automationen, Uebersicht, Start-Check,
Steckbrief, Bereiche, Profil, Content, Scouting und Report.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-07 14:31:14 +02:00
co-authored by Claude Opus 5
parent 90d5898640
commit 532daa3edf
25 changed files with 526 additions and 209 deletions
+95 -7
View File
@@ -89,7 +89,7 @@
}
/* MODULLISTE */
:is(.eintrag-karte, .call, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu) {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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) {
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, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu)::before {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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)::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, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu)::after {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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)::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, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu) {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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) {
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, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu) {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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) {
filter: none; border: 1px solid CanvasText;
}
/* MODULLISTE */
:is(.eintrag-karte, .call, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu)::after {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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)::after {
display: none;
}
/* MODULLISTE */
:is(.eintrag-karte, .call, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .spalte, .balance, .saeulen-kasten, .neu, .call-raum, .creator, .summe, .pdf, .pdf-ablage, .suchleiste, .person, .kk, .fortschritt, .punkt, .unterweisung, .warnkarte, .kachel, .tagesblick, .leer-hinweis, .team-karte, .zahl, .k-listentag, .import-vorschau, .code-fenster, .schulung__neu)::before {
:is(.eintrag-karte, .call, .chat, .datei, .ablage, .zahlkarte, .regel, .zustand, .ki-kasten, .k-ansicht, .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)::before {
display: none;
}
}
@@ -354,3 +354,91 @@
.kachel__zeichen { background: Canvas; border: 1px solid CanvasText; box-shadow: none; }
.kachel__zeichen::before { display: none; }
}
/* =====================================================================
DIE TAGESKACHEL "WAS IST DRAN" (07.09.2026)
Filipe: "soll auch besser und auffaelliger aussehen bitte."
Sie bestand aus drei abgerundeten Zeilen mit einem Farbstreifen
links -- also aus der Form, die es hier bis heute Frueh ueberall
gab. Sie bekommt jetzt dieselbe Behandlung wie alles andere, und
zwar konsequent:
* Die drei Zeilen sind MODULE. `.dran__punkt` steht seit heute in
der Modulliste oben: abgeschnittene Ecke, Kantenlicht in der
Farbe des Bereichs, Eckwinkel, Fase. Damit sind sie kleine
Ausgaben derselben Bauteile, zu denen sie fuehren -- was sie ja
auch sind.
* Die ZAHL wird zum gefassten Schild, wie das Zeichen auf den
Kacheln. Sie ist die eigentliche Aussage der Zeile ("EINS
wartet"), und sie stand bisher als blosse Ziffer daneben.
* Zwischen den beiden Haelften laeuft eine gefraeste Nut statt
einer Linie -- dieselbe Sprache wie auf der Konsole.
===================================================================== */
/* Der Farbstreifen links entfaellt: Die Zeile hat jetzt ein
Kantenlicht, und beides zusammen waeren zwei Kanten fuer dieselbe
Aussage. */
.dran__punkt::before { width: 0; }
.dran__zahl {
--z-fase: 7px;
display: grid; place-items: center;
min-width: 30px; min-height: 26px;
padding: 2px;
font-size: 1.02rem;
/* DIE FARBE BLEIBT IN DER ZIFFER, nicht im Schild.
Im ersten Anlauf stand hier Weiss, weil das auf Metall gut
aussieht. Damit war die Aussage weg: Die Zahl traegt die Farbe des
Bereichs, zu dem die Zeile fuehrt -- und bei etwas Ueberfaelligem
die Warnfarbe. Das ist kein Schmuck, sondern die schnellste
Auskunft der ganzen Kachel. pruef-start-ansicht hat es sofort
gemeldet ("ueberfaellige Zeilen sind rot": weiss statt rot), und
die Pruefung hatte recht.
Das Schild darunter bleibt deshalb fast neutral -- nur eine Spur
Farbton, damit die Ziffer nicht auf Grau steht. */
color: var(--ton, var(--akzent));
text-align: center;
clip-path: polygon(var(--z-fase) 0, 100% 0, 100% 100%, 0 100%, 0 var(--z-fase));
background:
conic-gradient(from 210deg,
#b9c8da 0deg, #5a6b80 44deg, #d6e2ef 88deg, #44536a 140deg,
#aebdd0 196deg, #64758c 244deg, #cddaea 296deg, #4e5d73 340deg,
#b9c8da 360deg);
box-shadow: 0 4px 12px -7px rgba(0, 0, 0, .9), 0 0 0 1px rgba(6, 10, 18, .5);
}
/* Das Schild IM Ring traegt die Farbe des Bereichs -- wie bei den
Kacheln liegt die Farbe innen, das Metall bleibt ueberall gleich. */
.dran__zahl::before {
content: ""; position: absolute; inset: 2px; z-index: -1;
clip-path: polygon(
calc(var(--z-fase) - 2px) 0, 100% 0, 100% 100%, 0 100%,
0 calc(var(--z-fase) - 2px));
background:
linear-gradient(150deg, rgba(255, 255, 255, .10) 0%, transparent 48%),
linear-gradient(color-mix(in srgb, var(--ton, var(--akzent)) 14%, #080d15),
color-mix(in srgb, var(--ton, var(--akzent)) 6%, #080d15));
}
.dran__zahl { position: relative; isolation: isolate; }
/* Die Nut zwischen "Was ist dran" und "Heute". Dunkel auf der
Lichtseite, hell auf der Schattenseite -- so liest sich eine
Vertiefung. Eine aufgemalte Linie kann das nicht. */
.tagesblick__seite--heute::before {
content: ""; position: absolute;
left: -21px; top: -6px; bottom: -6px; width: 2px;
pointer-events: none;
background: linear-gradient(90deg,
rgba(0, 0, 0, .75) 0 1px,
rgba(255, 255, 255, .12) 1px 2px);
}
@media (forced-colors: active) {
.dran__zahl { background: Canvas; box-shadow: none; border: 1px solid CanvasText; }
.dran__zahl::before { display: none; }
.tagesblick__seite--heute::before { background: CanvasText; }
}