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:
@@ -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; }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user