Ein eigenes Haus fuer Team Dogi -- Lila und Babyblau statt Rot
Filipe, screen1: "die leiste da und alles andere was noch rot ist auf
team dogi seite soll lila werden. richtig geiles lila und babyblau
mischung ueberall."
Und screen2: "ich will doch dass der eingang hier getrennt ist von der
workspace seite ... aber es soll trotzdem so bleiben dass ich die daten
hier und da sehe."
GETRENNT WIRD DAS AUSSEHEN, NICHT DER BESTAND. Dieselbe Datenbank,
dieselben Seiten, dasselbe Programm -- und zwei Haeuser, die man nicht
verwechseln kann. Filipe und die rechte Hand sehen ihre Zahlen
weiterhin auf beiden Adressen.
EINE ZEILE JE SEITE, EINE REGEL IM SERVER. Jede Seite laedt als LETZTE
Stilvorlage `haus.css`. Auf der Agenturadresse ist die leer -- das Haus
dort IST der Grundzustand. Auf crew.dogfather-universe.com biegt die
Weiche genau diesen Dateinamen auf `crew-haus.css` um.
Drei Wege habe ich dafuer verworfen, und jeder hat einen Grund:
* `data-haus` per JavaScript -> die Seite laedt erst im falschen Ton
und faerbt sich um. Sichtbar, auf jeder Seite, bei jedem Aufruf.
* dasselbe Attribut serverseitig in den HTML-Text schreiben -> jede
HTML-Antwort muesste durch einen Umschreiber statt als Datei
ausgeliefert zu werden, nur wegen einer Farbe.
* zwanzig zweite <link>-Zeilen -> die muesste jemand bei jeder neuen
Seite mitschreiben, und wer sie vergisst, bekommt eine Seite, die
still zum falschen Haus gehoert.
DAS HAUS SIND FAST NUR VARIABLEN. Wer zwei Dutzend Farbwerte tauscht,
tauscht jede Kachel, jeden Rand, jeden Knopf und jedes Leuchten auf
einmal -- auch an Stellen, die man beim Nachbauen uebersehen wuerde.
Eine Datei, die stattdessen Regel fuer Regel umfaerbt, waere beim
naechsten neuen Bauteil sofort unvollstaendig, ohne dass es auffiele.
WO KEINE VARIABLE STAND, HAT DAS MESSEN SIE GEFUNDEN. Ich habe nicht
im Quelltext gesucht, sondern am fertigen Bildschirm jedes Element nach
Farben abgefragt, bei denen der Rotkanal deutlich ueber den anderen
liegt -- ueber alle Farbquellen, nicht nur `color` und
`background-color`. Erst das brachte die eigentliche Stelle ans Licht:
DIE KOPFLEISTE HAT EINEN ROTEN VERLAUF. Genau die Leiste aus Filipes
Bildschirmfoto. Sie glimmt im Agenturhaus wie Feuer -- sein eigener
Wunsch von screen36, und dort bleibt das auch so. Hier schimmert sie
jetzt lila, in derselben Bauweise: unten waermer, nach oben dunkel,
in der Mitte kraeftiger, alles unter 30 % Deckkraft.
Dazu die Fassung der Zentrale (rot->lila, Silber und Babyblau
unberuehrt, Prozentzahlen auf den Punkt gleich -- sie sind am 08.09.
eigens nachgerechnet worden), die Uhr an vier Stellen, das Universum
dahinter, Glocke und Tagesruf, der Schriftzug, und auf der Zugangswand
Knopf, Kachelreihe, Innenglas und Karte.
ZWEI FEHLER, DIE ERST DER BILDSCHIRM ZEIGTE:
Der Schriftzug wurde zu einem ausgefuellten Balken. `background` ist
eine Kurzschreibweise und setzt `background-clip` mit zurueck -- und
genau darueber wird der Text in die Buchstaben ausgestanzt. Jetzt
`background-image`. Im Quelltext sah die Zeile voellig richtig aus.
Zwei Regeln wurden geladen und taten nichts: Die Originale stehen
unter `.kopfleiste .marke__haupt` und `.willkommen > .zuniversum`.
Wer nur die halbe Kette schreibt, verliert gegen zwei Klassen.
DIE MARKE HAENGT JETZT AN ZWEI DINGEN. `markeFuer()` kannte nur die
Rolle -- und DogFather gehoert nun einmal zur Agentur. Ueber der
Zentrale stand deshalb auch auf der zweiten Adresse gross "SPICY
MEDIA". Jetzt entscheidet auch der Hostname, an EINER Stelle.
WAS WARM BLEIBT, UND WARUM: Warnungen. Eine Warnung ist keine
Verzierung, sondern eine Bedeutung -- faerbt man sie ins Lila der
Seite, sieht "etwas stimmt nicht" aus wie alles andere. Sie wird nur
ins Rosa gezogen, damit sie neben Lila kein Fremdkoerper ist. Ebenso
bleiben die 24 Kachelfarben: dass jede Kachel ihre eigene hat, ist
gepruefte Absicht.
Weisse Schrift auf dem Anmeldeknopf haelt jetzt 6,23 zu 1 statt 5,1 --
an echten Bildpunkten gemessen, nicht an der Farbangabe.
pruef-crew-adresse 123 -> 129 · pruef-crew-wand-bild 45 ·
pruef-css-klassen gruen (prueft ab jetzt das PAAR module.css/haus.css,
nicht mehr eine Datei) · pruef-modi-wortleck 5 · pruef-rollen 274 ·
pruef-start-ansicht gruen · pruef-chat-kanaele 79.
Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
Claude Opus 5
@@ -2732,32 +2732,38 @@ body.gate {
|
||||
es nur eine.
|
||||
===================================================================== */
|
||||
|
||||
/* Der Knopf: von tiefem zu hellerem Blau statt von Rot nach Blau.
|
||||
/* Der Knopf: von Lila nach Babyblau (10.09.2026).
|
||||
|
||||
Filipe: "richtig geiles lila und babyblau mischung überall." Er lief
|
||||
bis eben von tiefem zu hellerem Blau -- richtig, solange die Wand
|
||||
einfarbig blau war; jetzt fehlte ihm die Haelfte der Mischung.
|
||||
|
||||
DIE HELLIGKEIT IST NACHGERECHNET, NICHT GEWAEHLT. Der erste Entwurf
|
||||
endete bei #4aa4cf -- huebsch, und weisse Schrift darauf haette nur
|
||||
2,8 zu 1 gehabt. Der rot-blaue Verlauf, den er ersetzt, haelt ueber
|
||||
seine GANZE Laenge 4,65 zu 1; er war offenbar genau darauf gebaut.
|
||||
Ein hellerer Knopf sieht kraeftiger aus und ist schlechter zu lesen
|
||||
-- das ist kein Tausch, den man nebenbei macht.
|
||||
der blauen Fassung endete bei #4aa4cf -- huebsch, und weisse Schrift
|
||||
darauf haette nur 2,8 zu 1 gehabt. Ein hellerer Knopf sieht
|
||||
kraeftiger aus und ist schlechter zu lesen; das ist kein Tausch, den
|
||||
man nebenbei macht.
|
||||
|
||||
Jede Stufe hier liegt bei mindestens 5 zu 1 gegen Weiss. Gemessen
|
||||
wird das in pruef-crew-wand-bild.mjs am fertigen Bildschirmfoto, denn
|
||||
ein Verlauf laesst sich nicht aus einer einzelnen Farbe beurteilen. */
|
||||
Jede Stufe hier liegt gegen Weiss bei mindestens 5 zu 1 (gerechnet:
|
||||
10,7 / 8,8 / 6,6 / 5,9). Der Verlauf beginnt dadurch dunkler als
|
||||
vorher und endet heller -- die schlechteste Stelle ist damit besser
|
||||
als die schlechteste der blauen Fassung. Gemessen wird das in
|
||||
pruef-crew-wand-bild.mjs am fertigen Bildschirmfoto, denn ein Verlauf
|
||||
laesst sich nicht aus einer einzelnen Farbe beurteilen. */
|
||||
body.gate--crew #knopf {
|
||||
background:
|
||||
linear-gradient(100deg, #17527f 0%, #205f8c 34%, #2f6f9a 74%, #3a7699 100%);
|
||||
linear-gradient(100deg, #3a2b7d 0%, #4a3a9c 34%, #46589f 74%, #37688f 100%);
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, .28),
|
||||
inset 0 -2px 0 rgba(0, 0, 0, .22),
|
||||
0 10px 26px -14px rgba(64, 146, 200, .9),
|
||||
0 10px 26px -14px rgba(130, 104, 220, .9),
|
||||
0 10px 26px -16px rgba(126, 200, 242, .8);
|
||||
}
|
||||
body.gate--crew #knopf:hover:not([disabled]) {
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, .34),
|
||||
inset 0 -2px 0 rgba(0, 0, 0, .22),
|
||||
0 14px 30px -12px rgba(64, 146, 200, .95),
|
||||
0 14px 30px -12px rgba(130, 104, 220, .95),
|
||||
0 14px 30px -14px rgba(126, 200, 242, .85);
|
||||
}
|
||||
|
||||
@@ -2774,9 +2780,14 @@ body.gate--crew #knopf:hover:not([disabled]) {
|
||||
umbaut, sieht an den gleichen Prozentzahlen sofort, dass beide
|
||||
zusammengehoeren. */
|
||||
body.gate--crew .rollen {
|
||||
/* LINKS LILA, RECHTS BABYBLAU (10.09.2026). Die Prozentzahlen sind
|
||||
Stufe fuer Stufe dieselben wie im Original -- getauscht wird nur
|
||||
die linke Farbfamilie, damit die beiden Fassungen nebeneinander
|
||||
lesbar bleiben. Rechts stand Babyblau schon immer; das war nie das
|
||||
Problem. */
|
||||
background: linear-gradient(96deg,
|
||||
#04080f 0%, #245a86 6%, #4f95bd 14%, #cfe9f8 20%,
|
||||
#1d4a70 30%, #0a0c12 40%, #f4faff 50%, #0a0c12 60%,
|
||||
#06040f 0%, #3a2b7d 6%, #7a63d8 14%, #ded3ff 20%,
|
||||
#35276f 30%, #0a0c12 40%, #f4faff 50%, #0a0c12 60%,
|
||||
#4f95bd 70%, #8fd8ff 78%, #dff2ff 84%, #3f7fa3 92%, #06080f 100%);
|
||||
}
|
||||
/* Das Innenglas: unten links glueht es rot. Dieselbe Stelle, kaltes
|
||||
@@ -2789,9 +2800,9 @@ body.gate--crew .rollen::before {
|
||||
linear-gradient(180deg, rgba(255, 255, 255, .05), transparent 34%),
|
||||
repeating-linear-gradient(0deg, rgba(150, 186, 220, .05) 0 1px, transparent 1px 22px),
|
||||
repeating-linear-gradient(90deg, rgba(150, 186, 220, .05) 0 1px, transparent 1px 22px),
|
||||
radial-gradient(120% 80% at 12% 100%, rgba(96, 168, 224, .12), transparent 62%),
|
||||
radial-gradient(120% 80% at 12% 100%, rgba(150, 122, 255, .13), transparent 62%),
|
||||
radial-gradient(110% 75% at 88% 0%, rgba(126, 200, 242, .09), transparent 60%),
|
||||
linear-gradient(180deg, #0b111c, #070b13);
|
||||
linear-gradient(180deg, #0c0b1c, #080714);
|
||||
}
|
||||
/* Der kleine Anschlag neben "Womit meldest du dich an?" -- oben rot,
|
||||
unten babyblau. Hier oben im Ton von Team Dogi, unten babyblau: derselbe
|
||||
@@ -2799,7 +2810,7 @@ body.gate--crew .rollen::before {
|
||||
body.gate--crew .rollen .feldschild::before {
|
||||
background-image:
|
||||
linear-gradient(180deg, transparent 0 46%, rgba(143, 216, 255, .95) 46%),
|
||||
repeating-linear-gradient(180deg, #5f8a9f 0 2px, transparent 2px 5px);
|
||||
repeating-linear-gradient(180deg, #6b5fa8 0 2px, transparent 2px 5px);
|
||||
}
|
||||
|
||||
/* Die Karte in der gemalten Tafel. WORTGLEICH dieselbe Bedingung wie
|
||||
@@ -2810,7 +2821,7 @@ body.gate--crew .rollen .feldschild::before {
|
||||
@media (min-width: 1100px) and (min-height: 620px) and (min-aspect-ratio: 7/5) {
|
||||
body.gate--crew .tafel {
|
||||
background:
|
||||
radial-gradient(135% 100% at 0% 0%, rgba(96, 168, 224, .24), transparent 55%),
|
||||
radial-gradient(135% 100% at 0% 0%, rgba(150, 122, 255, .26), transparent 55%),
|
||||
radial-gradient(135% 100% at 100% 100%, rgba(56, 158, 246, .30), transparent 58%),
|
||||
linear-gradient(176deg,
|
||||
rgba(16, 23, 36, .93) 0%,
|
||||
|
||||
Reference in New Issue
Block a user