aa1d05a5c03c2e0d03329cc158ec6a91a06686f5
2
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
aa1d05a5c0 |
Neues Anmeldebild -- die Karte sitzt IN der gemalten Tafel
Filipe: "integriere die zugangskachel links nach rechts und passe sie
perfekt an damit sie in dem neuen bild rechts perfekt und die
vorgemachte kachel passt."
Das neue Motiv (Spicy Media x DogFather) hat rechts eine leere Tafel mit
Neonrahmen. Die Anmeldekarte sitzt jetzt DARIN -- und zwar wirklich
darin, nicht ungefaehr in der Gegend.
DAS PROBLEM, DAS MAN LEICHT UEBERSIEHT: Das Bild liegt mit
`object-fit: cover` unter der Seite; je nach Fensterform schneidet der
Browser oben/unten oder links/rechts etwas ab. Ein `left: 58%` bezieht
sich aber auf das FENSTER. Auf genau einer Bildschirmgroesse saehe es
richtig aus und ueberall sonst falsch. Deshalb rechnet `.tafel-anker`
dieselbe Cover-Formel noch einmal nach und ist damit deckungsgleich mit
dem Bild -- Prozentwerte darin sind Prozent DES BILDES.
Die vier Zahlen sind GEMESSEN (tools/gate-bauen.mjs), nicht geschaetzt.
Zwei Anlaeufe standen daneben und haben sich selbst verraten:
1. "Suche den leuchtenden Rahmen" fand den Mond, die roten Blueten und
jede Spiegelung -- Ergebnis: die ganze rechte Bildhaelfte. Eine
Messung, die das Offensichtliche zurueckgibt, hat nichts gemessen.
2. "Suche die groesste dunkle Flaeche" fand die Breite richtig, aber
94 % Hoehe: Ueber und unter der Tafel ist die Szene genauso
schwarz.
Richtig ist der dritte Weg: vom Mittelpunkt der Tafel nach aussen
laufen, bis es hell ODER farbig wird -- auf diesem Weg liegt nichts
anderes, denn die Tafel ist leer. Danach eine Plausibilitaetspruefung,
die abbricht statt vier geratene Zahlen auszugeben.
DREI FEHLER IM EIGENEN ENTWURF, alle gemessen statt angesehen:
* Die Karte hing 300 px unter dem Bildschirmrand. Auf `.tafel` liegt
die Einblend-Animation, deren Endbild `transform: none` ist -- mein
`translateY(-50%)` war damit wirkungslos. Zwei Wege, dasselbe
Element zu verschieben, vertragen sich nicht.
* Der Anker lag 3 % neben dem Bild: Das Bild traegt `scale(1.03)` als
Reserve fuer die Parallaxe. Jetzt tragen beide dieselbe Verwandlung,
und die Parallaxe laeuft ueber zwei CSS-Groessen am <body> -- so
wandert die Karte mit, statt dass der Rahmen unter ihr wegrutscht.
* Der Hochkant-Ausschnitt zeigte die LEERE Tafel: ein schwarzes
Rechteck mit ein paar Saeulen. Auf dem Handy liegt die Karte ohnehin
davor; dort gehoert das Logo hin. Jetzt faellt der Schriftzug
SPICY MEDIA in den sichtbaren Streifen -- nachgerechnet, nicht
probiert.
STARTSEITE: das Tresorbild als neuer Hintergrund. Die uebernommene
Abdunklung von 0,62 war zu viel (der Tresor ist von Haus aus dunkel) --
uebrig blieb ein Schemen. Und der "Leseweg" verdunkelte ausgerechnet die
MITTE: Bei den alten Szenen stand dort nichts, beim Tresor steht dort
die Tuer. Beides korrigiert und mit pruef-buehne an echten Bildpunkten
nachgemessen.
DABEI GEFUNDEN, ohne Zusammenhang mit dem Bild: Der abgeschaltete
"Ueberfaellig"-Filter kam auf 4,05:1 statt 4,5:1. Die Deckkraft zu
erhoehen half nichts -- die Pruefung rechnet mit der CSS-FARBE und dem
gemessenen Bildpunkt dahinter, und ein `opacity` am Elternknopf aendert
die Farbe nicht. Die Zahl blieb dreimal exakt gleich; genau das war der
Hinweis. Jetzt ein eigener, hellerer Ton. Der Kommentar daneben sagte
ohnehin, was gewollt ist: Man SOLL sehen, dass es null sind.
Und die vier Regeln von heute stehen in CLAUDE.md.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
|
a9815e291a |
Ein Hintergrund fuer alles -- und Zeichen, die endlich vollstaendig sind
ZWEI AUFTRAEGE.
1. DER NEUE HINTERGRUND
Das Dogfather/Spicy-Media-Bild loest die neun Buehnen ab. Der Login
behaelt ausdruecklich sein eigenes Bild (body.gate, unangetastet) --
dort wird der Zugangscode eingegeben, und genau das sollte bleiben.
Nicht einfach hingelegt: Das Bild ist sehr kraeftig, vor allem die
rote Haelfte. Ohne Behandlung fiel der Textkontrast auf 3,03:1
(noetig sind 4,5:1) -- ausgerechnet in der Personenverwaltung und auf
dem Aufgabenbrett. Gemessen hat das server/pruef-buehne.mjs, das den
Kontrast an bis zu 36 echten Bildpunkten je Seite nachrechnet.
In vier Schritten angepasst und jedes Mal nachgemessen:
-0,14 Helligkeit -> 4,12:1 (immer noch zu wenig)
-0,20 Helligkeit -> 4,48:1 (zwei Hundertstel zu wenig)
-0,23 Helligkeit -> 4,63:1 bestanden, alle Seiten
Dazu Saettigung 0,72 und Gamma 0,91 -- dieselbe Behandlung, die auch
die alten Buehnen bekommen haben (tools/buehne-bauen.mjs arbeitet mit
Helligkeit 0,66 bis 0,88). Das Bild bleibt ein Bild und wird nicht
zur Tapete, aber Text steht darauf lesbar.
2. DIE ZEICHEN
Sie bekommen einen VERLAUF: oben hell, nach unten gedaempft -- eine
Lichtquelle ueber dem Zeichen, wie in der echten Welt. Dazu ein
weicher Schlagschatten in der eigenen Farbe. Der Verlauf ist EINMAL
definiert und arbeitet mit currentColor: ein Verlauf fuer siebzehn
Kachelfarben.
ZWEI SACKGASSEN AUF DEM WEG, beide aufgeschrieben statt weggeraeumt:
a) Erst lag unter jeder Linie eine dicke, weichgezeichnete Kopie --
"Licht, das die Linie wirft". Bei einem grossen Symbol traegt das.
Hier nicht: Ein Zeichen ist 24 Einheiten breit und 25 px gross,
eine Einheit ist also ein Pixel. Linie 1,65 plus Schein 2,5 fuellt
jede Luecke, die enger als vier Einheiten ist -- aus dem Kalender
wurde ein leerer Kasten. Gesehen habe ich das erst bei dreifacher
Vergroesserung; auf dem normalen Schirm sah es nur "satter" aus.
Die Lage ist wieder weg.
b) Der Verlauf lief zunaechst in OBJEKTKOORDINATEN. Damit wird er auf
den Umriss jedes einzelnen Pfades gerechnet -- und eine waagerechte
Linie hat die Hoehe null. Der Verlauf ist dann entartet, und der
Browser zeichnet den Pfad GAR NICHT. Verschwunden waren dadurch:
die Querlinie im Kalender, alle drei Regler-Striche in Technik,
die Grundlinie der Berichte. Jetzt laeuft er in Benutzer-
koordinaten ueber die festen 24 Einheiten -- was ohnehin richtiger
ist, denn das Licht kommt von oben und nicht von jedem Strich
einzeln.
AUSSERDEM ECHT REPARIERT: Das Technik-Zeichen hatte drei Griffe aus
Boegen der Laenge null ("a1.4 1.4 0 1 0 0-.02z") -- sie wurden nie
gezeichnet. Uebrig blieben drei nackte Striche, die aussahen wie ein
Menue-Symbol. Jetzt sind es echte Kreise. Kalender und Dashboard haben
mehr Luft zwischen ihren Linien bekommen, damit sie bei 25 px nicht
zu einer Flaeche verschmelzen.
GEPRUEFT: Buehne 38 (Kontrast an echten Bildpunkten), Startansicht 133,
Rollen 97, Handy 50, Grosscheck 15, Lesbarkeit 14 -- alle gruen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|