18a5231b700f48d6b7b52099f71bdb01324bde41
27
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
  DogFatherGitandClaude Opus 5
|
18a5231b70 |
Die Tuer ohne Klingel, der Anruf ohne Ende, die Glocke ohne Liste
Siebter Durchgang durch die Team-Dogi-Seiten aus Benutzersicht. Alles am
Code belegt, die Groessenangaben nachgerechnet.
=== DIE ANMELDUNG ===
WOHER BEKOMMT MAN EINEN CODE? Stand nirgends. Vier Kacheln, ein Feld,
ein Knopf -- wer keinen Code hatte, fand keinen einzigen Satz dazu. Fuer
die Community besonders teuer: Sie ist die einzige Rolle, die von
aussen kommt und niemanden im Haus kennt.
"BITTE KURZ WARTEN" SIND BIS ZU ZEHN MINUTEN (VERSUCHE_FENSTER_MIN).
Wer nach zwanzig Sekunden nachsieht und dieselbe Meldung liest, haelt
die Seite fuer kaputt. Jetzt steht die Zahl da.
EIN RICHTIGER CODE AN DER FALSCHEN KACHEL fiel in dieselbe Absage wie
ein erfundener -- der Server sucht nur unter der gewaehlten Rolle. Wer
aus der Community kommt und auf "Modi" tippt (das klingt ja danach),
tippt seinen richtigen Code dreimal Buchstabe fuer Buchstabe. Ab dem
zweiten Fehlversuch kommt jetzt ein Hinweis auf die Auswahl -- ohne zu
sagen, welche die richtige waere.
=== DER ANRUF: VIER FEHLER, EINE ERFAHRUNG ===
DAS FREIZEICHEN LIEF UNENDLICH. Es gab keinen Zeitgeber, der aufhoert.
Wer niemanden erreichte, sass vor einem piependen Kasten mit "02:47"
darauf, als telefoniere er laengst. Der Server schickt den Verfallszeit-
punkt sogar mit (`laeuft_bis`) -- benutzt hat ihn nie jemand.
DER KLINGELKASTEN VERSCHWAND NACH 46 SEKUNDEN, waehrend der Server 120
gibt. Wer beim Klingeln das Handy aus der Tasche holt und in Sekunde 50
hinsieht, fand nichts mehr -- kein Kasten, keine Knoepfe -- waehrend der
Anrufer noch siebzig Sekunden Freizeichen hoerte. Die 120 Sekunden sind
im Server ausdruecklich damit begruendet, dass man Zeit zum Entsperren
braucht; eine Zeile im Browser hat diese Entscheidung aufgehoben.
DAS FREIZEICHEN PIEPTE WEITER, waehrend daneben "Keine Verbindung."
stand. Ton sagte "es klingelt noch", Text sagte "vorbei".
DIE UHR ZAEHLTE AB DEM WAEHLEN. Wer 30 Sekunden klingeln liess und 12
Sekunden sprach, las im Kasten "00:42" und danach im Chat "Anruf . 12
Sekunden". Der Server rechnet es richtig; der Kasten hat es wieder
kaputtgemacht.
Dazu: Die Mikrofon-Absage verwies auf "das Schloss-Symbol neben der
Adresse" -- in der installierten App gibt es weder Adresszeile noch
Schloss. Das Haus kennt diesen Fehler und hat ihn beim Weg zur
Anruf-Probe schon behoben; hier stand er noch.
Und die Anruf-Probe: Ihr einziger Punkt ohne Handlungsanweisung war
"Antwort 503." -- auf einer Seite, die ausdruecklich fuer jemanden
gebaut ist, der nicht technisch ist. Ihr Rueckweg fuehrte ausserdem
immer in den Chat, auch wenn man von der Startseite kam.
=== DER TREFF ===
EIN EINZEILER MACHTE SECHS ERKLAERTEXTE UNSICHTBAR. bewerben.js las
`g.unter`, der Server schickt `g.text` -- also immer undefined. Damit
fehlten ALLE SECHS Gruppeneinleitungen des Fragebogens ("Kein Test mit
richtigen Antworten"), und die CSS-Regel dafuer lief ins Leere. Uebrig
blieben sechs nackte Ueberschriften ueber fuenfzehn Fragen.
DIE EINZIGE "SO LAEUFT DAS HIER"-SEITE WAR FAST UNERREICHBAR. Die
Kachel "Regeln & Hilfe" zeigte auf ein Brett, das am ersten Tag leer
ist. Die Regeln, die es wirklich gibt (Begruessung, fuenf Regeln, drei
Stufen, Mindestalter), stehen auf treff-regeln.html -- erreichbar ueber
genau einen kleinen Textlink auf einer Brettseite. Die Kachel zeigt
jetzt dorthin.
FIEL /api/treff/lage AUS, versprach die Seite einem Zuschauer
Schreibrechte, die der Server ablehnt: Die Pruefung fiel bei `lage ===
null` auf `true` durch -- von "darf auf keinem Brett" auf "darf
ueberall". Formular auf, getippt, 403.
Dazu: hilfe.js hatte eine eigene kleine Fehlertabelle fuer zwei
Kennungen und endete sonst bei "Ging nicht." -- ausgerechnet die Seite,
auf der jemand mit einem Problem sitzt, hatte die inhaltsleerste Absage
im Haus. Und der gesperrte "Neue Meldung"-Knopf erklaerte sich nur im
Maus-Tooltip; die Community kommt von TikTok, also vom Handy.
=== DIE STARTSEITE ===
DIE COMMUNITY BEKAM EIN WORT. Unter dem Titel steht bei jeder Rolle ein
Satz -- beim Community-Mitglied stand "Community". Woertlich derselbe
Mangel, den der Kommentar bei MODI_ROLLENTEXT beschreibt und fuer den
Modi behebt.
DER RING MELDETE 100 %, bevor man irgendetwas getan hat. Am ersten Tag,
ohne eine einzige Aufgabe, stand das groesste Element der Seite auf
"100 % -- HEUTE NICHTS OFFEN". Gelesen wird zuerst die Zahl, und 100 %
heisst fuer jeden "fertig", nicht "leer".
UND BEI EINER STOERUNG BLIEB "wird geladen" FUER IMMER STEHEN -- der
fruehe `return` liess den Platzhalter unberuehrt.
=== DIE ZUGANGSVERWALTUNG ===
Der Code-Kasten sagte "jetzt weitergeben" und gab die Haelfte nicht
mit, die man weitergeben muss: WO sich die Person anmeldet. DogFather
ruft den Code durchs Zimmer, der andere fragt "und wo?". Die Adresse
kommt jetzt vom Server (anmeldeAdresseFuer, abgeleitet aus derselben
Weiche), dazu ein Knopf "Code und Adresse kopieren".
Er verschwieg ausserdem den Rettungsweg: "danach nicht mehr abrufbar"
stimmt fuer DIESEN Code -- man kann jederzeit einen neuen vergeben. Wer
das nicht weiss, glaubt, er habe einen Menschen angelegt, der nie
hereinkommt. Und das Fenster liess sich wortlos schliessen, waehrend
der Code offen stand.
=== OPTIK: NACHGERECHNET, NICHT VERMUTET ===
DIE GLOCKE STAND NICHT IN DER LISTE. Sie ist ein echtes <button> und
wurde von der 44-px-Regel erfasst, waehrend ihre vier Nachbarn durch
einen staerkeren Selektor auf 36 px gehen. Zwischen 401 und 560 px --
also bei 412 px (haeufigste Android-Breite) und 430 px (iPhone Pro Max)
-- stand eine 44 px hohe runde Pille zwischen fuenf 36-px-Quadraten.
Der 400er-Block listet sie korrekt; genau dieses Band fiel durch beide
Rechnungen. Dasselbe Muster wie am 06.09.
DIE 9,6-px-REPARATUR IM KALENDER WAR SEIT WOCHEN WIRKUNGSLOS.
kalender.css wird NACH start.css geladen, beide Selektoren sind gleich
stark -- also gewann `.6rem` auf jeder Breite unter 760 px. Genau der
Wert, den start.css als behobenen Fehler protokolliert.
Und die Hebung selbst unterschritt ihre eigene Grenze: Die Regel, die
zu kleine Schrift hochziehen soll, zog `.k-pille` auf 11,2 px -- 0,3 px
unter die 11,5, die 33 Zeilen darueber aufgestellt werden.
Weitere nachgerechnete Groessen: Spaltenkopf und KW-Spalte im Kalender
(10,56 px), Kalenderwoche am Balken (9,92 px), Wecker-Knopf (30 px --
der kleinste im Haus, 14 unter der Vorgabe), Chat-Zurueck auf dem
Tablet (34x34, 40 % weniger Flaeche als noetig, und der einzige Weg
zurueck in die Liste), Emoji-Knoepfe (34 px bei 2 px Abstand -- wer
danebentippt, verschickt ein anderes Zeichen, und das ist sofort
abgeschickt).
IM WINDOWS-KONTRASTMODUS HATTE DIE STARTSEITE KEINE UEBERSCHRIFT.
`.ztitel` und der Team-Dogi-Schriftzug sind mit `background-clip: text`
gesetzt; faellt der Verlauf weg, bleibt durchsichtiger Text. Beide
haben jetzt den Rueckfall, den gate.css schon lange hat.
UND MEIN EIGENES STREIFENRASTER rechnete die Spaltenzahl aus der Breite
statt aus den Daten (`auto-fit`): Bei 390 px passten sechs, alles
darueber fiel in eine zweite, unbeschriftete Zeile. Das `overflow-x`
daneben konnte nie greifen -- ein auto-fit-Raster wird nie breiter als
sein Kasten. Der Kommentar beschrieb ein Verhalten, das es nicht gab.
GEMESSEN: pruef-meldungen 8/0, pruef-css-klassen ALLES IN ORDNUNG,
pruef-rechtetafel 19/0, alle Module laden, keine doppelten
Kachelnamen/-ziele/-farben in allen vier Rollen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
88e2b5cd5d |
Der Wecker: das Zeitfeld ging auf -- nur ausserhalb des Bildschirms
Filipe: "wenn ich am handy auf den wecker drücke dan sieht man nichts."
Er hat woertlich recht. Der Knopf tut, was er soll, und das Zeitfeld
klappt auf -- es steht nur nicht im Bild. Aufgeklappt gemessen, fuenf
Breiten:
320 px Feld bei -127 .. -8 komplett draussen
360 px Feld bei -107 .. 12
390 px Feld bei -92 .. 27
412 px Feld bei -81 .. 38
430 px Feld bei -72 .. 47
DER GRUND IST EIN ANKER, DER GEWANDERT IST. `.tagesruf__feld` steht mit
`right: 56px` da -- "56 px nach links vom Knopf". Am Rechner ist das
richtig: Dort sitzt der Knopf am rechten Rand einer breiten Kachel, und
links davon liegt die Luecke zwischen Text und Uhr. Auf dem Handy wird
derselbe Knopf aus dem Fluss genommen und neben die zentrierte Uhr
gehaengt -- er steht dann ganz LINKS, und 56 px weiter links ist kein
Raum mehr, sondern der Bildschirmrand.
Der Abstand stimmte also noch, der Bezugspunkt nicht mehr. Dieselbe
Sorte Fehler wie die feste Umbruchschwelle und die 62 px Kopfhoehe: eine
Zahl, die fuer eine Anordnung ausgerechnet wurde und in der zweiten
still falsch ist.
Es oeffnet jetzt auf dem Handy nach RECHTS statt nach links -- in die
Richtung, in der dort der Platz ist. Das ist keine zweite Zahl, sondern
dieselbe Regel andersherum ("ins Freie oeffnen"). Der linke Rand des
Knopfes ist nie kleiner als 0, das Feld 119 px breit, der schmalste
Bildschirm 320 -- damit liegt es auf jeder Breite im Bild, ohne dass
eine Schwelle stimmen muss. `max-width: calc(100vw - 24px)` als
Sicherung, falls das Feld je breiter wird.
Die Regel steht in heim.css direkt neben der Regel, die den Knopf
verschiebt. Sie gehoeren zusammen: Wer den Anker bewegt, sieht die
Folge in derselben Medienabfrage.
GEPRUEFT WIRD ES JETZT AUCH (pruef-handy, 99 -> 115 Pruefungen). Das
Feld wird dafuer aufgeklappt gemessen, nicht zugeklappt -- ein
verstecktes Feld hat keine brauchbare Lage, und genau die ist die
Frage. Gegenprobe ist die Messung von vorher: Mit demselben Messmittel
lag das Feld bei -92..27, die Bedingung waere rot gewesen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
9b1826721b |
Handy-Mitte, Babyblau und Spicy im Umschalter
Drei Bildschirmfotos, drei Befunde -- und alle drei waren messbar. --- SCREEN 2: RING UND UHR STANDEN SCHIEF --- Filipe: "ich will dass auf dem handy die uhr und der kreis ganz oben mit den erledigten aufgaben, schoen mittig, zentriert sind. die stehen sehr verzogen von der mitte. das soll bei jedem und jeder rolle verbessert werden." Gemessen bei 390 und 412 px, in allen fuenf Rollen, immer dieselbe Zahl: Ring 31 px nach links, Uhr 31 px nach rechts. Gleicher Betrag, entgegengesetzte Richtung -- eine Ursache, nicht zwei. `justify-content: center` zentriert den INHALT der Reihe, und in der Reihe steht neben dem Instrument noch ein Knopf (Glocke rechts vom Ring, Wecker links von der Uhr). Zentriert wurde also [Knopf + Abstand + Instrument] als Block; das Instrument rutschte um die halbe Knopfbreite zur Seite. Die Knopfbreite steht seit jeher als `--instrument-knoepfe: 62px` in derselben Datei -- 62 / 2 = 31. Die gemessene Zahl war von Anfang an aufgeschrieben, nur an anderer Stelle. Der Knopf zaehlt jetzt nicht mehr mit: aus dem Fluss genommen, neben das zentrierte Instrument gehaengt. NICHT um 31 px verschoben -- das waere dieselbe Zahl ein zweites Mal, und beim naechsten Knopf waere sie falsch. Jetzt folgt seine Lage dem Instrument, wie gross das auch ist. Nachher: 0 px Abweichung, alle fuenf Rollen, beide Breiten. --- SCREEN 3: DAS BABYBLAU WAR STAHLGRAU --- Filipe: "die rolle dogfather soll eine uebertrieben geile babyblau haben." Zum dritten Mal -- und die ersten beiden Male habe ich das Falsche vergroessert. Beide Male hatte ich den Abstand zwischen Rot- und Blaukanal im HEXWERT erhoeht (45 Stufen, dann 86). Diesmal zuerst gemessen, was am Bildschirm ankommt: Die DogFather-Zeile traegt 98,7 % farbige Bildpunkte -- MEHR als jede andere Rolle. An der Menge lag es also nie. Ihr Mittelwert war rgb(43,62,78): 35 Stufen zwischen Rot und Blau. Das ist Stahlgrau. Die richtige Groesse ist die SAETTIGUNG. In OKLab hatte #9ed3f4 eine Buntheit von 0,0718 -- der blasseste Wert aller fuenf Rollen. #5fbdff hat 0,1303, also 81 Prozent mehr. Die Zeile kommt damit auf rgb(36,60,79), und der mittlere Kanalabstand steigt von 35,2 auf 43,0. Nachgerechnet, was NICHT verlorengeht: Kontrast auf dem Grund 9,75:1 (vorher 12,49) -- weit ueber den 7 fuer AAA. Abstand zur naechsten Rollenfarbe 0,1608 in OKLab, vorher 0,1466; die Hausgrenze liegt bei 0,0973. DogFather ist also SICHERER unterscheidbar als vorher. Gemessen an der echten Flaeche: 8,84:1 und 9,60:1. --- SCREEN 4: SPICY FEHLTE IM UMSCHALTER --- Filipe: "ich will da auch noch die spicy rolle sehen und die leute in der rolle wie die anderen." Der Sicht-Umschalter fuehrte eine EIGENE Rollenliste -- vier Eintraege, Spicy Media fehlte. Zum vierten Mal derselbe Fehler: eine zweite Fassung einer Liste, die es zentral schon gibt. Vorher traf es die Leitungsliste (ein Set), die Rollennamen (ein Objekt in fuenf Skripten -- im Chat stand "UNDEFINED" ueber einem Namen) und die Personenliste. Jetzt steht dort keine Liste mehr, sondern eine Ableitung aus `ROLLENFOLGE` und `ROLLEN_GRUPPE`. Kommt eine sechste Rolle, ist sie ohne eine Zeile Arbeit dabei. --- Pruefung --- pruef-handy: zehn neue Messungen (fuenf Rollen x zwei Breiten), alle 0 px. Die beiden fehlenden Rollen sind dafuer in den Testdaten ergaenzt -- eine Pruefung an drei von fuenf haette "bei jeder Rolle" nicht belegen koennen. pruef-sicht: Cigdem als Spicy-Media-Person ergaenzt. Ohne sie waere es nie aufgefallen -- eine Rolle ohne Leute wird ohnehin weggelassen, und die alte Zusicherung "Manager, Scouts, Creator" waere weiter gruen gewesen. Dazu eine Gegenprobe, dass die Reihenfolge WIRKLICH aus der zentralen Liste kommt und nicht wieder abgeschrieben ist. pruef-personen-kachel: DogFather-Kontrast neu dabei. Ausserdem gruen: pruef-css-klassen, pruef-lesbarkeit. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
0a0dbff384 |
Fuenf Punkte aus screen1-5: Babyblau, zweite Nut, Spalten, Wasserzeichen, Jadeknoepfe
screen1 -- "da muss mehr babyblau zu sehen sein. da ist ja fast nichts."
Gemessen als Blaustich (Mittel Blaukanal minus Rotkanal ueber die
ganze Zeile): DogFather lag bei 7,4 und damit UNTER der roten
Spicy-Zeile (17,3). Ursache: --dogi-haupt war #c7dcf4, und das hat
zwischen Rot und Blau nur 45 Stufen Abstand -- im Hexwert ein Blau,
auf dem Bildschirm ein Weiss.
Jetzt #9ed3f4 (86 Stufen), dazu eine Schiene, deren Silber nur noch
ein Spitzlicht am oberen Ende ist, ein breiter babyblauer Schimmer
und der Name selbst in einem Verlauf von Silber nach Babyblau.
Blaustich 24,3 -- der hoechste aller fuenf Zeilen, und mit dem
hoechsten Gruenanteil, also Babyblau und nicht Lila. Abstand zur
naechsten Rollenfarbe 0,1295 in OKLab (Hausgrenze 0,0973), Kontrast
12,4:1.
screen2 -- "mach diesen strich der nach oben geht auch links bitte."
Die Zentrale hat drei Felder, aber nur EINE Nut. Jetzt zwei, aus
einem Regelsatz -- "genau gleich" heisst hier wirklich gleich und
nicht gespiegelt: Eine Fraesung in derselben Platte hat bei Licht von
oben links ueberall dieselbe Flanke.
Dabei ein echter Fehler gefunden: Die Nut wurde erst bei 620 px
abgeschaltet (start.css), die dritte Spalte faellt aber schon bei
1180 px weg (heim.css). Zwischen 621 und 780 px stand sie deshalb als
freier senkrechter Strich im Bild -- bei 700 px nachgemessen bei
x = 391, wo sie nichts mehr trennte. Das Abschalten steht jetzt in
derselben Regel wie der Spaltenwechsel, je einmal fuer 1180 und 780.
screen3 -- "die sollen schön untereinander sein."
`.gruppe__zahl` trug ein `margin-left: auto` -- geschrieben fuer die
Startseite, wo im Kopf nur Name, Zahl und Pfeil stehen. Auf der
Personenseite steht dazwischen noch der Zusatztext, und der Pfeil hat
sein eigenes auto. Zwei auto-Raender teilen den freien Platz zu
gleichen Teilen -- also stand die Gruppe [Zahl + Zusatz] mittig, und
ihre Lage hing an der Laenge des Rollennamens.
Jetzt vier Rasterspalten. Die Breite der Namensspalte wird an der
fertigen Liste GEMESSEN und als `--namen-spalte` gesetzt; eine feste
Angabe waere bis zur naechsten Rolle mit laengerem Namen richtig.
Spanne von Zahl und Zusatztext: 0,0 px (vorher 11 px). Gegenprobe:
ohne die gemessene Spalte laufen sie wieder 36,5 px auseinander.
screen4 -- "das symbol rechts in der kachel soll viel groesser sein."
Zum dritten Mal gemeldet, und zum dritten Mal hatte er recht. Zweimal
habe ich den KASTEN vergroessert; beide Male hat sich nichts geaendert,
und ich habe es auf die Kachelhoehe geschoben, statt nachzusehen. Der
Kasten war 124 px -- das SVG darin 39:
.kachel[data-gross="ja"] .kachel__svg { width: 39px } (0,3,0)
.kachel__wasserzeichen svg { width: 100% } (0,1,1)
Die erste Regel meint das Hauptsymbol links. Beide SVG tragen aber
dieselbe Klasse, weil sie aus derselben Funktion kommen -- und die
fremde Regel war staerker. Dasselbe galt fuer `.kachel:hover
.kachel__svg` und die Reduced-Motion-Regel; alle drei sind jetzt auf
`.kachel__zeichen` eingeschraenkt.
Und es waren WIEDER zwei Fassungen derselben Sache, 3600 Zeilen
auseinander: Rahmen 78 gegen 70, Zeichen 36 gegen 39. Der Kommentar
an der spaeteren Stelle behauptete sogar schon, es gebe "EINE
Fassung". Behauptet war es, gemessen nicht. Die toten sind entfernt.
Zweitens fuellt die Zeichnung jetzt ihren Kasten: Im 24er-Raster liegt
sie bei x 4 bis 20, rund 38 Prozent waren leerer Rand.
Ergebnis: Zeichnung von 26 auf 124 px, samt der 8-Grad-Drehung
(140 px) vollstaendig in der 152 px hohen Kachel. Deckkraft
unveraendert bei 0,14 -- er wollte groesser, nicht lauter.
screen5 -- "der abmelde button und teilen button sollen eine richtig
geile gruen haben ... aber so dass es nicht den augen wehtut."
Teilen #45d6a6, Abmelden #33b394. Beide sind WENIGER gesaettigt als
das Rot, das vorher dort stand (63 und 55 gegen 100 Prozent) -- die
Leiste wird ruhiger, nicht greller. Kontrast der Schrift 15,6:1 und
15,0:1 gegen vorher 13,6:1 und 12,6:1. Chat und Suchen bleiben rot;
damit trennt die Farbe "das mache ich mit der Seite" von "das mache
ich mit meinem Zugang".
Erster Versuch verworfen: Ein Rahmen aus drei Toenen ueber zwei
Hintergrundlagen machte beide Knoepfe FLAECHIG gruen, weil ich die
deckende obere Lage durchsichtig gesetzt hatte -- damit deckte sie den
Rahmenverlauf nicht mehr ab. Im Bildschirmfoto gesehen, nicht in den
Zahlen: Die Farbwerte waren die ganze Zeit richtig.
Geprueft: pruef-start-ansicht, pruef-buehne, pruef-css-klassen,
pruef-personen-liste -- alle gruen. Jede eigene Messung mit Gegenprobe.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
cccafd2c31 |
Sechs Wuensche: Hintergruende, Knopfverteilung, Universum, Uhrkoepfe, Knallrot
--- screen3 + screen1: die Hintergruende draengeln nicht mehr --- "die hintergrunde sollen ueberall so sein dass die sich nicht in den vordergrund draengeln." / "mach den hintergrund von dieser kachel dunkler, so dass die die kacheln drin viel mehr auffallen." `--raster` stand auf .26 Deckkraft -- auf dunkler Flaeche kein Hauch mehr, sondern ein gezeichnetes Gitter. Im Tagdialog lief es sichtbar durch die Ueberschrift, in den Sammelkacheln stand es VOR den Karten darin. Jetzt .09: Man sieht eine Struktur, man zaehlt keine Linien. Eine Zahl fuer das ganze Haus -- sie steht einmal in module.css und wird an fuenf Stellen benutzt. Die Anlasskachel im Kalender lag mit rgba(19,26,38,.88) auf demselben Helligkeitsniveau wie die Karten darin: keine Vitrine, sondern eine dritte Flaeche gleicher Lautstaerke. Jetzt fast schwarz. An den Karten musste dafuer nichts geaendert werden -- der Abstand entsteht von selbst. --- screen2: ein Knopf wandert nach links --- "eins von diesen buttons soll links bei dem anderen kreis sein." Die GLOCKE geht nach links zum Ring, der WECKER bleibt rechts bei der Uhr. Das ist nicht ausgewuerfelt: Der Wecker ist eine Uhrzeit. Die Glocke entscheidet, ob man ueberhaupt etwas ueber sein Team erfaehrt -- und der Ring links zeigt genau das. Die Kachel ist damit spiegelsymmetrisch belegt: 48 px Knopf + 14 px Abstand + 248 px Instrument auf beiden Seiten. Genau das rechnet `--spalte`. Die Zentrierung des Rings ist weggefallen -- sie war noetig, solange er allein in einer fuer Instrument PLUS Knopf bemessenen Spalte stand. Der reservierte Platz schrumpft von 104 auf 48 px je Seite; die Begruendung fuer das Reservieren bleibt: Ein Platz, der erst mit der Antwort entsteht, laesst die Zeile springen. --- screen4: zwei Chilis und zwei Huskys dazu --- "setz in den hintergrund noch 1-2 peperonis und dan das logo von dogfather, also nur den husky." DER HUSKY IST EINE MASKE, KEIN BILD. Die Datei ist schwarz-weiss und freigestellt (nachgemessen: 49 % durchsichtig). Als Hintergrundbild bei 15 % verschwaenden die schwarzen Flaechen im dunklen Grund und uebrig blieben die hellen -- ein zerrissener Umriss, kein Hund. Als Maske ueber einer Farbflaeche wird daraus eine geschlossene Silhouette in DogFathers Babyblau. Im Universum schweben jetzt beide Marken in ihren beiden Farben: sieben Chilis rot, zwei Huskys blau. --- screen5: die Punkte sind ersetzt, das letzte Glied leuchtet --- "ich will dass du die punkte ersetzt und immer der letzte soll mehr strahlen oder so." / "alles ist mega ausser die stunden muss du noch perfektionnieren." DIE DREI UMLAUFENDEN PERLEN SIND WEG -- samt 60 Zeilen Rechnung. Sie waren ein zweites Ding an einer zweiten Stelle: eigene Uhr ab dem ersten Takt (weil die volle Unixzeit `rotate(1.07333e+10deg)` ergab), eigener Startwinkel je Bahn, drei Winkel, die die kleineren Einheiten anteilig mittragen mussten. All das war noetig, WEIL der Kopf neben der Reihe herlief statt Teil von ihr zu sein. Genau deshalb trugen sie am 08.09. noch die alten Farben, als die Bahnen getauscht wurden. Jetzt zeichnet eine zweite SVG-Lage genau EIN Glied heller -- dasselbe, das die Reihe darunter zuletzt gesetzt hat, aus denselben Zahlen. Sie kann gar nicht danebenstehen. Heller statt groesser: Waere der Kopf groesser, waere er ein Fremdkoerper in der Reihe. DIE STUNDEN WAREN BREITER ALS LANG -- 5,5 lang bei 7 breit, also 0,79:1. Ein Segment, das breiter ist als lang, liest sich als Klotz quer auf der Bahn statt als Balken entlang. Und weil die Kantenlage nur 0,4 versetzt ist, lief der 0,9 breite Lichtstrich MITTEN DURCH jeden Balken statt an seiner Kante. Jetzt 10 lang bei 5,8 breit (1,7:1), und der Kantenversatz ist nach Bandbreite gestaffelt: (Breite - 0,9) / 2, also 0,75 / 1,65 / 2,05 zusaetzlich zur Gruppe. --- screen6: die Scout-Pipeline wird knallrot --- "die farbe von dieser kategorie soll knall rot sein." Die anderen zwanzig Kachelfarben sind gerechnet (OKLab, groesstmoeglicher Abstand). Diese eine ist gewuenscht -- und wurde deshalb GEGEN den Satz geprueft statt eingetragen: Der engste vorhandene Abstand liegt bei 0,0973. #ff1f2e kommt seinem naechsten Nachbarn auf 0,1228 nahe, ist also weiter entfernt als das engste vorhandene Paar. Kontrast 5,01:1 (noetig 4,5). Von sechs geprueften Rottoenen der mit dem groessten Abstand UND genug Kontrast. tools/kachel-farben.mjs weiss jetzt davon: Ein kuenftiger Lauf wuerde wieder Rosa vorschlagen, und das waere eine stille Ruecknahme einer ausdruecklichen Entscheidung. --- Ein Messfehler, der festgehalten gehoert --- Beim Pruefen von screen4 meldete meine Foto-Methode vier Beschriftungen unter 4,5:1 -- bei einem Verlust von 0,00 bis 0,15 durch das Universum. Dass die Ursache nicht das Universum sein konnte, stand damit schon in den Zahlen. Exakt gerechnet (Vordergrundfarbe gegen die tatsaechliche Flaeche darunter) liegen dieselben Texte bei 9,13:1 bis 10,76:1. Die Foto-Methode mittelt ueber alle helleren Bildpunkte, und bei duenner Grossbuchstabenschrift ist die Haelfte davon halb ausgeleuchtete Kantenpunkte. Fuer grosse Schrift taugt sie, fuer kleine Versalien meldet sie systematisch zu wenig. Haette ich ihr geglaubt, haette ich vier Farben "repariert", die in Ordnung sind. Geprueft: pruef-start-ansicht, pruef-css-klassen, pruef-kalender, pruef-buehne, pruef-handy, pruef-workspace-seiten, pruef-tagesruf -- alle in Ordnung. Dazu Ring und Uhr auf 248/248 nachgemessen, die Kopf-Muster gegen die Uhrzeit nachgerechnet (01:24:59 -> Sekunde bei 281,115, Minute bei 96,76, Stunde bei 16,493) und die Kachelfarbe gegen alle zwanzig anderen in OKLab geprueft. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
8c7dc1fa94 |
Uhr und Ring sind jetzt gleich gross -- aus EINER Variablen
Wunsch Filipe: "die uhr und der [ring] sollen noch bissl groesser sein und ... dan auch am ende die selbe groesse haben bitte. sehr wichtig." WARUM SIE ES VORHER NICHT WAREN: Der Ring stand in heim.css (232 / 220 / 190), die Uhr in start.css (164 / 118). Zwei Dateien, zwei Zahlensaetze, und keine Stelle, an der jemand beide zugleich gesehen haette. Nachgemessen lagen sie am Rechner 68 px auseinander. Das war kein Versehen an einer Zahl, sondern die zwangslaeufige Folge davon, dass es zwei gab. Jetzt entscheidet `--instrument` ueber beide -- und ueber die Spalten, in denen sie sitzen. Gemessen: 248/248 am Rechner, 224/224 am Tablet, 196/196 am Handy. Ein Auseinanderlaufen ist nicht mehr moeglich, sondern muesste absichtlich geschrieben werden. Die alte Angabe in start.css ist ENTFERNT, nicht ueberschrieben: eine wirkungslose Zahl, die richtig aussieht, ist genau die Falle. ZWEI FOLGEN, BEIDE ERST IM BILD SICHTBAR: 1. DIE UHR HING 32 px UEBER DIE KACHELKANTE. Die rechte Spalte war auf das Instrument bemessen (248), braucht aber auch die Knopfreihe daneben (48 + 14 Abstand = 310). Die Seite liess sich trotzdem nicht seitlich schieben -- der Ueberstand lag INNERHALB der Kachel, also hat keine vorhandene Pruefung angeschlagen. Jetzt ist die Spaltenbreite abgeleitet (`--spalte`), nicht getippt. Beide Aussenspalten bekommen sie, obwohl links keine Knoepfe stehen: sonst saesse der Titel nicht mehr mittig. Der Ring wird in seiner Spalte zentriert. 2. DIE ZIFFERN WAREN ZU KLEIN. Sie standen in `rem` -- in einer Uhr von 164 px richtig, in einer von 248 verloren (29,76 px in einem 248-px-Zifferblatt, die Mitte eine leere Flaeche). Sie haengen jetzt ebenfalls an `--instrument`. Der Faktor ist nachgesehen, nicht gerechnet: 0,145 war noch zu klein, 0,168 fuellt die Mitte, ohne an die innerste Bahn zu stossen (Stundenbalken liegen bei Radius 31,5 von 50). Geprueft: pruef-start-ansicht (kein Text abgeschnitten, keine Konsolenfehler), pruef-handy, pruef-workspace-seiten (18 Seiten, Ueberstand 0 px), pruef-css-klassen -- alle in Ordnung. Dazu 1500/900/390 px einzeln nachgemessen: Uhr und Ring auf den Pixel gleich, Abstand zur Kachelkante 30 bzw. 64 px. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
f701dae53e |
screen10: Der Tagesruf -- einmal am Tag, was noch offen ist
Wunsch Filipe: "ich will das neben diesem kreis auch ein kleiner button
ist fuer den wecker von den aufgaben, oder quasi eine taetige meldung
einmal am tag zu aktivieren wenn noch aufgaben auf sind."
Ein Wecker-Knopf unter der Glocke, neben der Uhr. Eingeschaltet meldet
er sich einmal taeglich zur eingestellten Zeit -- aber nur, wenn
wirklich noch etwas offen ist. Der Satz nennt die Zahl und die
Ueberfaelligen: "3 Aufgaben sind noch offen / Davon eine ueberfaellig."
ALS EINZIGE ART MIT `vorgabe: false`, und das ist keine
Nachlaessigkeit. Alle anderen Benachrichtigungen antworten auf ein
Ereignis, das gerade passiert ist. Der Tagesruf kommt ungefragt zur
selben Zeit, ob es etwas Neues gibt oder nicht -- so etwas schaltet man
sich selbst ein, sonst ist es Werbung. Bei null offenen Aufgaben kommt
nichts: Eine taegliche Meldung "du hast nichts zu tun" ist der
schnellste Weg, dass man die naechste nicht mehr liest.
EIN FENSTER VON DREI STUNDEN. Der Takt laeuft alle fuenf Minuten; ein
einfaches "jetzt >= eingestellte Zeit" wuerde nach einem Serverausfall
den Ruf fuer neun Uhr um zwanzig Uhr zustellen. Wer eine Erinnerung an
einen vergangenen Tag bekommt, schaltet sie ab. Faellt der Tag aus, ist
das die ehrlichere Antwort.
VIER DINGE, DIE ERST DAS NACHMESSEN GEZEIGT HAT:
1. DER KNOPF VERSPRACH ETWAS, DAS ER NICHT HALTEN KONNTE. Chromium
meldet `Notification.permission === 'denied'` -- gemessen, nicht
vermutet. Der Knopf sah einladend aus ("Einmal am Tag melden…") und
sagte erst NACH dem Antippen ab. Ein Bedienelement, das den Grund
erst hinterher nennt, ist die schlechtere Haelfte einer
Fehlermeldung. Jetzt steht er im Titel, und der Knopf ist gedimmt.
2. EINE UHRZEIT IN DER RUHEZEIT WAERE EIN STILLES NICHTS. Der Server
laesst zwischen 22 und 7 Uhr nichts durch. Wer 23:00 einstellt,
bekaeme nie etwas und saehe nur einen Knopf auf "an". Jetzt steht
der Hinweis dort, wo man es einstellt -- mit den Grenzen VOM SERVER,
nicht mit hier getippten Zahlen.
3. `wert` UND `an` SIND ZWEI ENTSCHEIDUNGEN. Wer nur den Schalter
umlegt, schickt kein `wert` -- stumpf `req.body.wert` zu schreiben
haette bei jedem Aus- und Einschalten die Uhrzeit geloescht, und
beim naechsten Mal staende wieder neun Uhr da. Ein Datenverlust, den
niemand meldet, weil er wie eine Vorgabe aussieht. Genau dieser Weg
wird jetzt geprueft.
4. pruef-css-klassen HATTE ZWEIMAL RECHT. Der Stil lag in heim.css
(nur Startseite), die Zeichen entstehen aber in glocke.js (18
Seiten) -- auf 17 davon waere ein nackter Knopf gestanden. Und die
beiden neuen Schriftgroessen (10 und 11 px) haetten die Grundlinie
von 43 zu kleinen Stellen still auf 45 gehoben. Beides behoben:
Stil nach start.css, Schrift auf 12 px.
NEUE PRUEFUNG server/pruef-tagesruf.mjs, drei Schichten getrennt, weil
sie getrennt kaputtgehen: Oberflaeche im Browser, Schalten ueber die
Schnittstelle (aus der SEITE heraus, damit Sitzung und
Herkunftspruefung mitgehen), Zeitentscheidung als reine Rechnung. Die
Entscheidung wurde dafuer aus dem Rundgang herausgeloest -- dazwischen
steckend haette man zum Pruefen Datenbank und Push-Versand aufbauen
muessen, also haette man sie nicht geprueft.
Die Erwartung der ersten Schicht richtet sich nach der GEMESSENEN
Berechtigung statt sie vorauszusetzen: Erlaubt eine kuenftige
Chromium-Fassung Benachrichtigungen von sich aus, waere ein fest
verdrahtetes "muss blockiert sein" ein Fehlalarm ohne Fehler.
Gegenproben sind dabei: "99:99", "7:30" ohne fuehrende Null und ein
Wert an einer Art, die keinen kennt, muessen abgelehnt werden -- sonst
bewiese der Bereichstest nichts.
Der reservierte Platz waechst von 46 auf 104 px, damit der zweite Knopf
die Kachelreihe darunter nicht nach unten schiebt; das Zeitfeld schwebt
statt zu schieben. Beides derselbe Grund wie bei der Glocke: Ein
Sprung ist kein Schoenheitsfehler, sondern der Grund, warum man auf den
falschen Knopf drueckt.
Geprueft: pruef-tagesruf (neu, alles in Ordnung), pruef-push,
pruef-css-klassen, pruef-start-ansicht -- alle in Ordnung.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
cad3c4c4df |
screen21: Universum hinter der Zentrale, Fassung neu gewichtet
Wunsch Filipe: "ich will dass du im hintergrund dieser kachel das logo von spicy media machst ... es soll sogar paar mal zu sehen sein, es soll sich bewegen, schweben ... der ganze hintergrund soll wie ein universum aussehen. und der rand wie gesagt soll rot schwarz silber und babyblau sein, rot und babyblau soll man am meisten sehen." DER RAND HATTE ALLE VIER FARBEN -- IN DER FALSCHEN GEWICHTUNG. Jeden Stopp mit der Haelfte des Abstands zu seinen Nachbarn gewichtet: Schwarz 37,5 %, Babyblau 27,5 %, Silber 22 %, ROT 13 %. Die beiden Farben, die man am meisten sehen sollte, kamen zusammen auf 40,5 % -- Silber allein hatte mehr Platz als Rot. Im Quelltext faellt das nicht auf: Man sieht neun silberne Stopps und denkt an Spitzlichter, nicht an ein Fuenftel der Flaeche. Jetzt Babyblau 41,5 %, Rot 33 %, Schwarz 21,5 %, Silber 4 % -- zusammen 74,5 %, und die beiden nur 8,5 Punkte auseinander. Silber ist auf den Treffpunkt in der Mitte zurueckgenommen, dieselbe Stelle, an der sich im Schriftzug Chili und Husky treffen. DAS UNIVERSUM: drei Nebel (rot unten links, babyblau oben rechts, ein Hauch Lila als Uebergang), ein Sternenfeld aus acht gekachelten Verlaufsebenen und fuenf schwebende Chilis. Sechs Elemente insgesamt -- Sterne als Elemente waeren neunzig Knoten fuer eine Zierde. Bewegt werden nur `transform` und `opacity`; ein animiertes `background-position` zwingt den Browser bei jedem Bild zum Neuzeichnen einer Kachel mit vierzehn Hintergrundebenen. DIE ORTE SIND GEMESSEN, NICHT GESTREUT -- und das war die eigentliche Arbeit. Im ersten Anlauf lagen die Chilis quer ueber der Mittelspalte: einer deckte 34,5 % der Unterzeile und 45,9 % des Lagesatzes ab, der Kontrast fiel von 6,36:1 auf 5,87:1. Das war noch zulaessig, zwang die Deckkraft aber auf sechs Prozent -- und damit sah man die Chilis nicht mehr, was ausdruecklich gewuenscht war. Die bequeme Antwort waere gewesen, sie blasser zu machen. Richtig war, sie aus dem Text herauszunehmen: Sie stehen jetzt in den Zonen ohne Text, tragen 12 bis 17 statt 6 bis 10 Prozent und decken nachgemessen NULL Text ab. Der verbleibende Verlust von 0,49 kommt allein vom Nebel. AUGENSCHONEND HEISST HIER VOR ALLEM LANGSAM: Die Bahnen dauern 71 bis 118 Sekunden, die Sternendrift 240. Bei einer Kachel, die stundenlang im Bild steht, ist eine Bewegung, die man BEMERKT, eine, die stoert. Nichts blinkt, nichts pulsiert. Bei `prefers-reduced-motion` bleibt das Bild stehen statt zu verschwinden -- die Einstellung heisst "weniger Bewegung", nicht "weniger Gestaltung". Unter 700 px gehen die beiden groessten Chilis: Bei 380 px Breite naehme der grosse ein Drittel der Kachel ein und staende hinter dem Titel. Nebenbei zusammengelegt: Die Innenform der Kachel (das Fasen-Polygon) stand zweimal gleich da und steht jetzt einmal in `--k-innenform`. Genau diese Sorte Doppelung hat mich in dieser Datei heute schon zweimal Zeit gekostet. Geprueft: pruef-start-ansicht (alles in Ordnung), pruef-css-klassen (alles in Ordnung), Ueberdeckung und Kontrast im Browser nachgemessen (Foto zurueck in eine Leinwand, WCAG-Helligkeit), Bildschirmfoto bei doppelter Aufloesung. pruef-barrierefrei-workspace bewusst NICHT gestartet: Der Kontrast ist hier direkt gemessen (5,87:1 gegen 4,5 gefordert), der Lauf haette 190 Sekunden gebraucht, um dasselbe zu sagen. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
12c40256f7 |
Uhr: Stunden rot, Minuten silber, Sekunden babyblau -- alle drei als Reihen
Wunsch Filipe: "stunden soll rot sein, minuten schwarz/silber und die sekunden babyblau. die punkte herum sollen eine mischung von rot schwarz und babyblau sein. ich will auch dass die stunden und minuten auch barren oder punkte sind und nicht so eine durchlaufende schleife." ALLE DREI BAHNEN SIND JETZT REIHEN. Die Stunde bekommt zwoelf Balken (ein Zifferblatt hat zwoelf), Minute und Sekunde sechzig. Die Glieder sind verschieden lang -- Punkt (0,01 + runde Kappe), kurzer Balken (1,7), langer Balken (5,5). Damit liest man die drei Bahnen auch dann auseinander, wenn jemand Farben schlecht unterscheidet; Farbe allein traegt eine Information nie. VIER FUNDE BEIM NACHMESSEN, keiner davon war vorher sichtbar: 1. ABRUNDEN STATT RUNDEN. `Math.round` liess Minute und Stunde ab der HAELFTE einen Balken zu frueh aufleuchten: um 14:30 zeigte der Stundenring vier statt drei Balken, der Minutenring ab Sekunde 30 einen zu viel. Die Uhr war damit die halbe Zeit ueber falsch -- und ausgerechnet zur vollen Stunde, wo man hinsieht, richtig. Nachgerechnet: 10:30 -> 11, 14:30 -> 3, 23:59 -> 12, 00:00 -> 1. 2. DIE PERLENKOEPFE TRUGEN DIE ALTE ZUORDNUNG. Die drei Boegen waren getauscht, die drei Koepfe nicht: ein roter Kopf sass auf der blauen Sekundenreihe, ein silberner auf den roten Stundenbalken. Das sah nach einem Winkelfehler aus, obwohl alle drei auf die Zehntelgrad genau standen (354 / 161,9 / 343,0 bei 23:26:59, gemessen). Wer eine Farbe tauscht, tauscht sie an ALLEN Stellen: Bogen, Kopf, Schein, Kranz. 3. DER SCHEIN LAG DREIFACH UEBEREINANDER. Jeder Ring liegt dreimal im SVG (Schatten, Hauptlage, Kante); `.uhr__stunde` traf alle drei. Das rote Leuchten lief dadurch bis ueber die Ziffern, obwohl in der Regel nur 1,8 px stehen -- genau das Verschwommene, das Filipe nicht will. Jetzt `.uhr__ring > …`: nur die Hauptlage leuchtet, Schatten und Kante bleiben hart. 4. ZWEI TOTE FARBSCHICHTEN in heim.css (Sekunde rot / Minute blau / Stunde bronze). Sie wurden vom spaeteren Satz ueberschrieben und waren unsichtbar -- aber wer die Datei von oben liest, haelt sie fuer die geltende Regel und aendert die falsche Stelle. Entfernt statt stehengelassen: EINE Stelle entscheidet ueber eine Farbe. Ausserdem: Der Kometenschweif ist raus (HTML und CSS, nicht ausgeblendet). Eine Reihe zeigt ihre Richtung durch das letzte Glied; ohne eigenes Muster haette er einen vollen Ring quer ueber die Punkte gezogen. Der Punktkranz aussen mischt jetzt Rot, Babyblau und ein sehr dunkles Blau im 18-Grad-Takt -- das Dunkel ist kein Loch, sonst zerfiele der Ring aus dem Augenwinkel in zwei Haelften. Gedaempft bleibt Pflicht: Die Sekunde laeuft dauernd und bekommt das ruhigste Babyblau, die Stunde bewegt sich kaum und darf die kraeftigste Farbe tragen. Die Auslieferungskennung ist auf allen 19 Seiten hochgesetzt, sonst kaeme keine der Aenderungen an. Geprueft: pruef-start-ansicht (alles in Ordnung), pruef-css-klassen (alles in Ordnung), Segmentzahlen und Perlenwinkel im Browser nachgemessen, Bildschirmfoto bei vierfacher Aufloesung. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
7bec3ea80c |
Sekunden als Punkte, Ringe gestaffelt, silberner Rand weg
Filipe: "ich will aber dass die sekunden wie punkte sind, die minuten
breiter und die stunden noch breiter … den silbernen rand weg bitte den
will ich nicht … es soll nichts verschwommen aussehen oder so, im
gegenteil, richtig scharf und perfekt."
DER SILBERNE RING IST WEG. Er war die breiteste Flaeche der ganzen Uhr
und damit das Erste, was das Auge traf -- ausgerechnet der Teil, der
nichts anzeigt. Jetzt dunkles Metall; die drei Bahnen sind das Hellste
im Bild. Die Skalenstriche bleiben, sie geben Mass ohne zu fuellen.
DIE SEKUNDE IST EINE PUNKTREIHE. Sechzig Punkte, einer je Sekunde --
der schnellste Wert wird zaehlbar statt nur gewachsen. Das ist auch
ehrlicher: Die Sekunde SPRINGT, ein durchgehender Bogen behauptet einen
fliessenden Wert.
DIE BREITEN STAFFELN SICH: 3,2 / 5 / 7 statt 3 / 3,4 / 4. Die alten
Werte waren rechnerisch verschieden und im Bild nicht zu unterscheiden
-- ein Unterschied unter einem Pixel ist keiner. Jetzt liest man die
Ringe an ihrer STAERKE: je langsamer, desto schwerer.
SCHAERFE STATT NEBEL: Die weichen Scheine lagen mit 7 bis 9 px Radius
ueber den Bahnen wie Dunst. Jetzt 1,5 px -- sie liegen als KANTE an
statt als Wolke. Die Tiefe kommt aus dem Versatz der Lagen, so wie im
Rest dieser Uhr auch.
DREIMAL AN DERSELBEN STELLE DANEBEN, UND JEDES MAL IM BILD GESEHEN:
1. Der Sekunden-Schweif stand noch im Dokument und war per CSS
ausgeblendet -- das griff nicht, und ohne `dasharray` zeichnete er
einen durchgehenden roten Ring um die ganze Uhr. Ein Element, das
nie sichtbar sein soll, gehoert nicht ins Dokument. Ausblenden ist
kein Entfernen.
2. Dann das Punktmuster: n Paare plus Schluss-Luecke sind 2n+1 Werte.
Bei ungerader Anzahl verdoppelt SVG die Liste und vertauscht dabei
Striche und Luecken.
3. Also eine Null angehaengt (`rest 0`) -- Anzahl gerade, Fehler
blieb. Denn in `dasharray` wechseln sich Strich und Luecke ab: Nach
2n Werten sitzt der naechste an UNGERADER Stelle und ist ein
Strich. Der Rest wurde weiter gezeichnet. Richtig ist die Null
ZUERST (`0 rest`), dann landet die Luecke an gerader Stelle.
UND DIE PRUEFUNG MUSSTE MIT. `pruef-start-ansicht` verglich die
REIHENFOLGE der Farbkanaele im Kachel-Licht. Das setzt voraus, dass die
Kanaele deutlich verschieden sind -- seit der neuen Palette stimmt das
nicht mehr: "Aufgaben" ist Tuerkis (G=191, B=163), gemessen 63 gegen 65.
ZWEI Stufen von 255. Die Reihenfolge kippt dort durch Rundung, und die
Pruefung meldete einen Fehler, wo keiner war.
Sie misst jetzt den FARBWINKEL -- dieselbe Frage ("ist es dieser Ton?"),
ohne die Voraussetzung. 40 Grad Toleranz; die Kachelfarben liegen nach
der Neuberechnung gut 60 Grad auseinander. Dazu eine GEGENPROBE je
Kachel: Der gemessene Ton wird gegen den Gegenton auf dem Farbkreis
gehalten und muss dort anschlagen. Eine Pruefung, die immer bestaetigt,
bestaetigt nichts.
Gemessen: Farbwinkel-Abstaende 13° / 16° / 7° von 40 erlaubten.
pruef-start-ansicht EXIT=0, 140 -> 143 Pruefungen (die drei Gegenproben
sind dazugekommen, keine ist verschwunden). pruef-css-klassen EXIT=0.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
d694e34fcb |
Die Uhr nach Filipes Vorbild: LED-Kranz, Anker, rote Anzeige
Filipe hat eine Sci-Fi-Uhr geschickt (1250 px) und gesagt "so wie die".
Unsere ist 164 px gross -- Faktor 7,6. Was uebernehmbar ist, entscheidet
damit nicht der Geschmack, sondern die Groesse:
UEBERNOMMEN der blaue LED-Punktkranz aussen (das auffaelligste
Merkmal des Vorbilds), die vier Anker bei 12/3/6/9,
der rote Grundton der Digitalanzeige.
NICHT MOEGLICH die Minutenzahlen 00/05/…/55 und die Stundenzahlen
1-12. Im Vorbild sind sie rund 30 px hoch; hier waeren
es VIER. Zahlen, die man nicht lesen kann, sind kein
Zifferblatt, sondern Rauschen -- und sie wuerden die
drei Boegen zudecken, die die eigentliche Anzeige sind.
Der Kranz ist ein `repeating-conic-gradient` mit 6-Grad-Takt, aus dem
eine Maske einen schmalen Ring schneidet: 60 Punkte, einer je Sekunde,
in EINER Ebene. Sechzig <span> waeren sechzig Elemente fuer eine Zierde.
Die vier Anker ebenso, mit 90-Grad-Takt.
EINE FALSCHE BEGRUENDUNG, VON DER EIGENEN RECHNUNG WIDERLEGT: Ich hatte
in den Kommentar geschrieben, reines Neonrot wie im Vorbild "reisse den
Kontrast" und liege bei 4,0:1. Nachgerechnet sind es 5,27:1 -- es haelt
die Grenze von 4,5. Die schoenere Begruendung war die falsche.
Die Entscheidung bleibt trotzdem, nur mit dem echten Grund: Diese Uhr
steht DAUERHAFT im Bild einer Seite, an der gearbeitet wird. Reines
gesaettigtes Rot auf Schwarz ermuedet bei stundenlangem
Nebenherschauen, auch wenn es messbar lesbar ist -- genau das meint die
Hausregel "augenschonend", und das deckt keine Kontrastzahl ab. Die
Ziffern sind deshalb ein sehr helles Rotweiss (15,9:1), das seinen
roten Charakter aus dem Schein im Textschatten bekommt. Man liest
"rote Digitalanzeige", ohne stundenlang in eine Leuchtreklame zu sehen.
Aus demselben Grund liegt das Blau der LEDs bei rund 53 % Deckkraft:
Die Anmutung kommt vom Aufbau, nicht von der Grellheit.
pruef-start-ansicht EXIT=0 (140), pruef-css-klassen EXIT=0 (28).
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
e2bd6d4dc4 |
Die Uhr bekommt Kometenschweife -- und die Koepfe gleiten, statt zu springen
Filipe: "nehm diese uhr bitte und passe sie so gut wie es geht an, auch die lichter von sekunden, minuten und stunden perfekt anpassen ... überrasch mich." ZWEI DINGE, DIE EINE UHR LEBENDIG MACHEN. 1. DER KOMETENSCHWEIF. Ein Bogen in gleichmaessiger Farbe zeigt einen STAND. Ein Bogen, der zur Spitze hin heller wird, zeigt eine RICHTUNG -- man sieht ohne Nachdenken, wo "jetzt" ist und wohin es laeuft. Bei drei Ringen uebereinander ist das der Unterschied zwischen Ablesen und Erkennen. Gebaut als zweites, kuerzeres Segment ueber dem Bogen: die letzten rund 40 Grad, heller, mit runder Kappe. Ein Verlauf ENTLANG der Bahn geht in SVG nicht -- `linearGradient` folgt einer Geraden, keiner Kurve. Zwei Lagen sind der ehrliche Weg dorthin. Die Lage wird gerechnet, nicht geschaetzt: Bei Umfang U, Fortschritt a und Schweiflaenge s soll das Segment von (aU - s) bis aU liegen. Mit `dasharray: s, U-s` beginnt das sichtbare Stueck bei (U - offset), also ist offset = U*(1-a) + s. Die Laenge wird bei kurzen Boegen mitgekuerzt -- sonst haenge der Schweif am Anfang einer Minute am ENDE des Kreises, sichtbar als heller Strich bei zwoelf Uhr. 2. DIE KOEPFE GLEITEN. Bisher sprangen sie einmal je Sekunde. Jetzt uebernimmt der Browser die Bewegung dazwischen (Ueberblendung von 0,92 s) -- das Skript rechnet weiterhin nur EINMAL je Sekunde. Sechzig Bildberechnungen je Sekunde wuerden auf einer stundenlang offenen Seite den Rechner warm halten; diese Loesung kostet nichts. ZWEI FEHLER DABEI, BEIDE NUR IM BILD ZU SEHEN: Der erste Versuch rechnete die Winkel aus der vollen Unixzeit, damit sie immer weiterwachsen (sonst liefe die Ueberblendung einmal je Minute rueckwaerts durchs Zifferblatt). Ergebnis: `rotate(1.07333e+10deg)` -- Exponentialschreibweise, Nachkommastellen weg. Die Koepfe standen sichtbar neben ihren Boegen, der rote auf der anderen Seite der Uhr. Jetzt zaehlt eine eigene Uhr ab dem ersten Takt: klein genug zum Rechnen, wachsend genug fuer die Ueberblendung. Und ich hatte den Schweifen `rotate(-90deg)` gegeben, damit sie bei zwoelf beginnen -- das SVG ist aber bereits gedreht. Sie standen dadurch exakt eine Vierteldrehung daneben: oben links, waehrend die Boegen oben rechts endeten. NACHGEMESSEN, in Grad statt nach Augenmass: Kopf gegen Bogenende Abweichung 0,00° / 0,00° / 0,03° Schweifende gegen Bogen Abweichung 0,0° / 0,0° / 0,0° pruef-start-ansicht EXIT=0 (140), pruef-css-klassen EXIT=0 (28). Bei `prefers-reduced-motion` gleiten die Koepfe nicht -- sie springen dann wie vorher. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
1d0451948a |
Die drei Bahnen der Uhr gluehen von innen -- und die Stunde wird Bronze
Filipe: "die minuten sekunden und stunden soll viel spezieller, krasser und geiler sein, noch vieeeel mehr." Die Bahnen waren flache Striche in einem Verlauf -- sauber gebaut, aber ohne Koerper. Drei Aenderungen, und alle drei arbeiten mit LICHT statt mit mehr Farbe: 1. EIGENLEUCHTEN je Bahn, in ihrer eigenen Farbe. Auf einem schwarzen Zifferblatt kann man einen Strich entweder heller machen (dann blendet er) oder leuchten lassen (dann wirkt er wie eine Anzeige, die Licht abgibt). Zwei Schatten je Bahn: der enge gibt die Kante, der weite die Aura. 2. DIE STUNDE WIRD WARM. Sie lief in Schwarzsilber und war damit dem Zifferblatt am aehnlichsten -- ausgerechnet die Bahn, die man am haeufigsten abliest. Jetzt Bronze: warm gegen das kalte Blau der Minute und das Rot der Sekunde. Damit sind alle drei auf einen Blick zu trennen. Die Wechsel hell/dunkel im Verlauf bleiben, sie sind es, die aus einem Strich Metall machen. 3. DIE PERLEN sind die Spitzen -- dort schaut man hin. Sie bekommen denselben Schein wie ihre Bahn, nur staerker, und einen weissen Kern: der Unterschied zwischen einem farbigen Punkt und einem Licht. UND EINMAL ZURUECKGENOMMEN, nach dem Blick aufs Bild: Die Sekunde bekam zuerst denselben Schein wie die anderen beiden. Sie ist aber die laengste Bahn, die hellste Farbe UND die einzige, die sich sichtbar bewegt -- im Bildschirmfoto war sie ein roter Reifen, neben dem die Uhrzeit selbst zurueckstand. Ihr Leuchten liegt jetzt eine Stufe niedriger als das von Minute und Stunde. Gesehen, nicht gerechnet. Kein Pulsieren: Die Uhr steht dauerhaft im Bild, ein animiertes Leuchten am Bildrand ist genau das, was die Hausregel verbietet. Bei `prefers-reduced-motion` entfaellt der Schein ganz -- die Bahnen bleiben in voller Farbe stehen. pruef-start-ansicht EXIT=0, 140 Pruefungen. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
c262537b89 |
Der eigene Name leuchtet in der eigenen Rollenfarbe
Filipe, screen35: "die begrüßungen sollen auch viel krasser und geiler sein, so richtig auffällig. so dass die leute motivation bekommen weil es so geil aussieht." NICHT UEBER DIE GROESSE, und das ist der Kern. Genau die habe ich heute frueh von 88 auf 56 px zurueckgenommen: In der Anrede-Pille steckt ein <h1> mit Titelgroesse, dadurch standen ZWEI Ueberschriften uebereinander. Sie jetzt wieder aufzublasen hiesse, denselben Fehler ein zweites Mal zu machen. "Auffaellig" heisst ohnehin nicht "gross", sondern "hebt sich ab". Der Name hebt sich ueber die FARBE ab: Er traegt einen Verlauf in `--r-haupt`, der Farbe der angemeldeten Rolle. Jeder sieht damit seinen eigenen Namen in seiner eigenen Farbe -- nachgemessen: DogFather #7ec8f2 (babyblau), Scout #5fc99a (gruen), Creator #c79a6d (bronze). Das ist der Unterschied zwischen "da steht mein Name" und "das hier ist meins". Der Gruss davor bleibt bewusst leise und farblos. Wenn beides leuchtet, leuchtet nichts -- die Betonung gehoert dem Namen, nicht der Uhrzeit. Mit derselben Sicherung wie beim Schriftzug in der Kopfleiste: `color` steht zuerst und sichtbar da, Verlauf und durchsichtige Fuellung stehen nur im @supports-Block, und bei `forced-colors: active` wird alles zurueckgenommen. Durchsichtige Schrift ohne Rueckfallwert waere ein Ausfall, kein Schoenheitsfehler. Das Leuchten liegt als `drop-shadow` HINTER der Schrift -- es gibt dem Namen Tiefe, ohne ihn zu vergroessern. pruef-start-ansicht EXIT=0, 140 Pruefungen. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
ff8ea38595 |
Die Kopfleiste wird zur Klammer: Chili links, Husky rechts, Spicy & Dogi
Filipe (Nachtliste, screen17): "wo der husky ist soll eine geile rot gruene peperoni sein, dogfather universe ersetzen durch, Spicy & Dogi. und der husky von links soll rechts sein. die farben von der peperoni und von dem husky sollen ueber den text ziehen und sich dan in der mitte treffen." Dazu screen9: die Zierzeile der Zentrale heisst jetzt "Spicy Media" statt "Dogfather Universe". Die Chili steht als BILD (sie ist von sich aus rot mit gruenem Stiel und soll ihre Farben behalten), der Husky als MASKE (schwarzweiss gezeichnet waere er auf dunklem Grund ein dunkler Fleck; von der Maske zaehlt nur die Silhouette, gefuellt mit Silber und Babyblau). Dazwischen laeuft der Schriftzug von Chili-Rot ueber Silber nach Babyblau -- Treffpunkt in der Mitte, genau beim "&". DER VERLAUF IM TEXT IST EINE AUSNAHME MIT SICHERUNG. Direkt darueber steht seit dem 01.09. "KEIN Farbverlauf IM Text", und der Grund gilt weiter: Durchsichtige Schrift haengt an einer einzigen Technik, und faellt die aus, ist der Text WEG statt nur anders gefaerbt (gemessen damals 1,05:1). Beides geht zusammen, wenn der Verlauf nur eine Zugabe ist: `color` steht zuerst und voll sichtbar da, Verlauf und durchsichtige Fuellung stehen NUR in einem @supports-Block (wer es nicht kann, betritt ihn nicht), und bei `forced-colors: active` wird alles zurueckgenommen. Die drei Stuetzstellen sind bewusst hell -- beim Verlauf bestimmt der dunkelste Punkt den schlechtesten Kontrast. EIN SELEKTOR, DER RICHTIG AUSSAH UND FALSCH WAR. Der Husky sollte nur auf die Startseite; `body.start` davorzusetzen wirkte naheliegend. Diese Klasse tragen aber ALLE 18 Seiten -- sie kennzeichnet den Grundstil, nicht die Startseite. Folge auf den Unterseiten, wo `.marke` den Rueckweg traegt: Die 22 px des Huskys nahmen dem Text so viel Platz, dass "Creator Workspace" zu "CREAT…" wurde. Gesehen im Bildschirmfoto, nicht im Code. Jetzt steht die Regel in heim.css, das ausschliesslich von der Startseite geladen wird -- die Datei selbst ist die Bedingung. Nachgemessen dabei, damit es nicht faelschlich mir zugeschrieben wird: Der Schriftzug auf den Unterseiten ist AUCH IM ALTEN STAND abgeschnitten (151 px Inhalt auf 91 px Platz). Das ist ein vorbestehender Mangel und steht auf der offenen Liste, kein Rueckschritt aus diesem Commit. pruef-start-ansicht angepasst: Sie prueft den Namen im Schriftzug und erwartete "Dogfather Universe" -- sie hat ihre Arbeit getan und angeschlagen. EXIT=0, weiterhin 140 Pruefungen. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
863471c3df |
Die Mitte der Zentrale sitzt jetzt wirklich mittig -- zwei Ursachen, nicht eine
Filipe im Bildschirmfoto: "in der mitte der kachel soll auch alles perfekt zentriert sein und nicht wie jetzt total verschoben." Gemessen waren es zwei getrennte Fehler, die zufaellig in dieselbe Richtung zeigten. ERSTENS: .willkommen__stand trug ein `margin-left: auto` -- ein Rest aus der Zeit, als die drei Ablesungen RECHTS zwischen Text und Uhr standen. In einer Flex-Spalte gewinnt ein auto-Rand immer gegen das `align-items: center` des Elternteils. Bei 1920 px lagen Anrede, Zierzeile, Titel und Unterzeile alle exakt auf Mitte 960 -- dieser Kasten allein auf 1129, also 169 px daneben. Aufgefallen war das schon einmal: In der Media-Query fuer 412 px stand bereits `margin-left: 0`, mit dem Vermerk "im Bildschirmfoto gesehen, nicht hergeleitet". Dort wurde das Symptom geflickt und die Ursache blieb stehen -- auf dem grossen Bildschirm damit unbemerkt weiter. Jetzt ist die Ursache weg und die Gegenzeile gleich mit: Eine Zeile, die nichts mehr aufhebt, sieht aus wie Absicht und wird mitgeschleppt. ZWEITENS, und ohne Messung nicht zu sehen: `.willkommen .unterzeile` ist laut start.css ein FLEX-Kasten mit Umbruch, damit die Lage hinter der Rolle stehen und auf dem Handy umbrechen kann. In einem Flex-Kasten ordnet `text-align` die Elemente aber NICHT an -- es zentriert den Text innerhalb jedes Elements, waehrend die Elemente selbst links kleben. In der breiten alten Begruessung fiel das nie auf, weil beide in eine Zeile passten; die Spalte der Zentrale ist 397 px schmal und bricht immer um. Gemessen: Rollentext 39,7 px und Lage 58,6 px links der Achse, auf jeder Fensterbreite gleich. Behoben mit `justify-content: center` -- `align-items` waere das falsche Werkzeug, die Richtung ist row mit Umbruch, nicht column. Dazu der Punkt der Lage: Er haengt in einem `padding-left: 14px`. Steht die Lage in einer eigenen Zeile -- in dieser Spalte immer --, ist das Element dadurch 14 px breiter als sein Text und sitzt 7 px rechts der Mitte. Ein Ausgleich rechts macht es symmetrisch, nur hier und nicht in start.css: nebeneinander waere ein rechter Rand ein zu grosser Abstand. Gemessen ueber 1920/1440/1280/1100/800 px: alle sieben Elemente auf Abweichung 0,0 px. Zusaetzlich auf 360/390/412/430 px: kein waagerechter Ueberstand. pruef-start-ansicht EXIT=0, weiterhin 140 Pruefungen -- keine ist dabei still verschwunden. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
b2a0fb3a97 |
Die Zentrale bekommt die echten Marken -- und drei rote Pruefungen waren keine
Die drei Befunde in pruef-start-ansicht kamen NICHT vom Licht. Sie hingen
alle an einem boundingBox(), das einmal am Anfang ohne Vorrollen gemessen
wurde. Der Umbau zur Zentrale hatte die Begruessungskachel von 244 auf
404 px wachsen lassen, die zweite Kachel rutschte von y=971 auf y=1131,
ihre Mitte lag bei 1207 -- ausserhalb eines 1200 px hohen Fensters. Dorthin
faehrt kein Zeiger, also entstand kein Licht.
Verraten hat es die Mischung aus gruen und rot: "links" (30 % der Hoehe)
bestand, "rechts" (60 %) nicht. Eine Kachel, die nur zur Haelfte getroffen
wird, ist nicht kaputt -- sie haengt halb aus dem Bild.
Beides ist jetzt behoben, nicht nur eines:
* Die Pruefung holt die Kachel ueber scrollIntoView({block:"center"})
ins Bild und misst DANACH, vor jeder Benutzung. Passt sie trotzdem
nicht ins Fenster, ist das ein harter Fehler statt einer stillen
Fehlmessung.
* Die Kachel selbst faellt von 404 auf 344 px. Groesster Posten war die
Anrede-Pille mit 88 px: In ihr steckt <h1 class="titel">, und
.willkommen .titel ist die grosse Seitenueberschrift -- es standen
also zwei Ueberschriften in Titelgroesse uebereinander. Der Rang von
#gruss aendert sich nicht, nur die Groesse.
Nebenbefund, den die Reparatur mit aufgedeckt hat: Die Randmessung stand
auf "nah 51 gegen fern 0". Diese 0 war kein Messwert, sondern der
Bildpunkt ausserhalb des Fensters. Jetzt "nah 43 gegen fern 7" -- dieselbe
Pruefung misst zum ersten Mal wirklich.
DIE MARKEN. marke-husky.webp war nie freigestellt (0,3 % durchsichtig,
alle vier Ecken Alpha 255) -- als Maske ergab das einen Kasten mit einem
Husky darin. Ersetzt durch das echte Original, damit repariert sich die
Kopfleiste ohne eine einzige geaenderte CSS-Zeile mit.
In der Mitte des Rings steht jetzt Spicy Media, nicht der Husky: Der Ring
zeigt DAS TEAM, ein Segment je Person. Der DogFather-Kopf in seiner Mitte
haette Filipe bildlich ins Zentrum seines eigenen Teams gesetzt.
Und davon nur die Chili: Das volle Siegel war bei 44 px unlesbarer Matsch.
Beim ersten Ausschneiden meldete das Werkzeug "60,8 % deckend, Ecken
0/0/0/0" -- klang tadellos und war ein schwarzes RECHTECK mit Chili darin.
Die Flutfuellung laeuft von aussen und kommt nie hinter den weissen Ring.
Gefunden hat das kein Kennwert, sondern das Hinsehen.
Gemessen: pruef-start-ansicht EXIT=0 (137 -> 140 Pruefungen, die drei
roten sind gruen, keine ist verschwunden), pruef-css-klassen EXIT=0
(472 Groessen), pruef-handy EXIT=0.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGit
|
ec55b6c8d3 |
WIP Zentrale-Kachel nach VanVans Werktisch — NOCH NICHT FERTIG
Aufbau steht (Ring links, Titel mittig, Uhr rechts), aber pruef-start-ansicht meldet 3 Befunde am MAUS-LICHT der Kacheln. Gemessen: alter Stand 0 Befunde, dieser Stand 3 — kommt also von hier. Kein JS-Fehler (pageerror/console sind still), also Zeitverhalten: Die zusaetzliche Abfrage /api/zentrale verzoegert vermutlich den Aufbau der Kacheln ueber den Zeitpunkt hinaus, an dem kopf.js lichtFolgen ruft. Ausserdem offen: 2 Schriftgroessen unter 11,5 px (pruef-css-klassen). NICHT ausliefern. |
||
|
DogFatherGitandClaude Opus 5
|
a9f3212da3 |
Startseite: die tote Mitte der Konsole bekommt drei Ablesungen
Gemessen, nicht geschaetzt: Auf 1440 px lagen zwischen dem Ende des Textes und der Uhr rund 300 px Leere. Dort stehen jetzt HEUTE (Termine), ALS NAECHSTES (Uhrzeit) und OFFEN (Punkte, Farbe nach Lage). Keine zweite Zaehlung: Die Zahlen kommen aus denselben zwei Quellen, die die Kacheln darunter fuellen. Zwei Rechenwege fuer dieselbe Zahl laufen auseinander, und dann stehen zwei Wahrheiten auf einem Bildschirm. EINE Fassung mit Stegen, nicht drei Kaestchen. Der erste Anlauf gab jedem Wert eine eigene Fraesung -- im Bild sah das aus wie aufgeklebte Plaettchen. Ein Instrumentenblock ist EIN eingelassenes Feld, in dem Stege trennen; das Licht laeuft dann einmal ueber eine Kante statt sechsmal. Auf dem Handy geht der Block auf volle Breite und richtet sich nach der Uhr, nicht nach dem Rand. EINE ANNAHME KORRIGIERT: In meiner Merkliste stand "Werktisch-Aufbau nach VanVans Business Hub, Prozentring links". Im Hub nachgesehen -- es gibt dort keinen Ring und keinen solchen Aufbau, nur eine schlichte buehne-hero. Filipes Verweis galt der UHR, und die ist laengst gebaut. Meine eigenen Notizen altern wie jede andere Bestandsliste. DREI BEFUNDE AUS EIGENEN PRUEFUNGEN, alle behoben: 1. pruef-css-klassen: Die Zahl der Schriftgroessen unter 11,5 px war um genau eine gestiegen -- .stand__schild stand auf 9,3 px. Gesperrte Grossbuchstaben in 9 px liest man nicht, man erraet sie. Jetzt 11,5 px mit etwas engerer Sperrung, damit drei Schilder bei 320 px weiterhin nebeneinander passen (nachgemessen: 287 px, nichts abgeschnitten). 2. pruef-struktur: pruef-arten.mjs bildete das Tagesdatum aus UTC. Nachts zwischen 00:00 und 02:00 waere sie rot geworden, ohne dass am Code etwas falsch ist. Derselbe Fehler war mir am selben Abend schon im Messskript passiert -- dort hatte ich "Heute=0" gemessen und den Code verdaechtigt, der richtig lag. 3. Beim Bauen fast eingebaut: margin-left:auto von der Uhrgruppe genommen, weil der neue Block sie ja schon nach rechts schiebt. Er tut das nur, solange er da ist -- bis zur ersten Antwort steht er auf hidden, und die Uhr waere sichtbar weggesprungen. Neu: server/pruef-ueberlappung.mjs. Misst auf 5 Seiten x 4 Breiten, ob ein Bedienelement ueber einem anderen liegt (am 06.09. lag der Sicht-Umschalter bei 412 px auf zwoelf Seiten ueber dem Chat-Knopf). Ueberlappungen INNERHALB eines Bedienelements zaehlen nicht -- ein durchsichtiges select ueber seinem eigenen Schild ist die uebliche Bauart, und eine Warnung, die immer kommt, ist keine Warnung mehr. Mit Gegenprobe: ein absichtlich verschobener Knopf muss erkannt werden. Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
0ea8b27aca |
Aus drei Strichen werden drei Ringe aus Material
Filipe: "ich will dass der rand mit den sekunden minuten und stunden
viel krasser und geiler ist ... ultra modern, ultra speziell, ultra
profissionell, ultra phaenomenal."
EIN STRICH IST EINE LINIE. EIN RING IST EIN KOERPER.
Und ein Koerper hat drei Merkmale, die man zeichnen MUSS, sonst bleibt
es ein Strich. Jeder der drei Ringe besteht deshalb jetzt aus drei
Lagen:
SCHATTEN Er liegt ueber dem Zifferblatt, also wirft er einen.
Dieselbe Bahn, schwarz, ein halbes Rastermass nach UNTEN.
KOERPER Der Bogen selbst in seiner Farbe.
OBERKANTE Duenner, hell, ein Drittel nach OBEN. Weil er versetzt
ist, schaut er oben hervor und verschwindet unten -- genau
das tut eine gewoelbte Kante bei Licht von oben.
Kein Weichzeichner, nirgends: Die Tiefe kommt aus dem Versatz, nicht
aus Unschaerfe.
DIE BAHNEN SIND GEFRAESTE RILLEN
Ein Zeiger laeuft bei einem guten Instrument IN einer Vertiefung. Eine
Rille erkennt man an zweierlei: dunkler als ihre Umgebung, und an ihrer
unteren Wand steht eine helle Kante. Beides steht jetzt da, und die
Breite folgt dem Ring, der darin laeuft -- eine Rille, die schmaler ist
als ihr Zeiger, ist keine.
DREI KOEPFE STATT EINEM
Minute und Stunde bekommen dieselbe polierte Kappe wie die Sekunde, auf
ihren eigenen Bahnen und in ihrer eigenen Farbe. Erst dadurch liest man
die drei Ringe als drei ZEIGER und nicht als drei Fortschrittsbalken.
Sie laufen mit ihrem Ring: die Minute nimmt die Sekunden anteilig mit,
die Stunde die Minuten -- sonst staende der Kopf neben dem Ende seines
Bogens.
ALLE LAGEN WERDEN GEMEINSAM GESETZT. Sie tragen `data-ring`; einzeln
gepflegte Verweise waeren drei Stellen, an denen man eine vergessen
kann, und ein Schatten, der stehen bleibt, sieht sofort kaputt aus.
UND EIN FUND, DEN DIE PRUEFUNG SOFORT GEMELDET HAT
Die neue helle Oberkante des Stundenrings laeuft hinter den Ziffern
durch: schlechtester Kontrast 2,98:1 -- knapp unter der Grenze, und
ausgerechnet bei der Uhrzeit selbst. Die Antwort war nicht "Kante
weg", sondern der fehlende Untergrund: Auf einer echten Uhr steht eine
Anzeige, die ueber Zeigern liegt, auf einer eigenen vertieften INSEL im
Zifferblatt. Jetzt 5,42:1, und dabei 29 statt 14 gemessene Stellen.
Merksatz: Wenn eine neue Schicht einen Text unlesbar macht, ist die
Antwort selten "Schicht weg" -- meistens fehlt dem Text sein Grund.
Zehn Pruefungen gelaufen, alle gruen. Rechner und Handy angesehen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
5b6f9cef98 |
Rot, Schwarz, Babyblau -- und ein Glas, das entspiegelt ist
Filipe: "der rand soll auch eine mischung von rot schwarz und babyblau
haben und die kachel selbst soll einen uebertrieben krank geilen
hintergrund haben ... die einzige kachel, die komplett aus dem rudel
faellt. die uhr soll auch VIEL VIEL VIEL KRASSER sein. informier dich,
hol die besten skills von den besten skills."
NACHGELESEN STATT GERATEN -- UND DAS HAT DIE UHR VERAENDERT
Zur Frage, woran man ein hochwertiges Uhrenglas erkennt: Eine
Entspiegelung wird im Vakuum aufgedampft und senkt die Spiegelung auf
unter ein Prozent -- das Zifferblatt wirkt dadurch SCHAERFER, nicht
milchiger. Und ihr Erkennungszeichen ist kein weisser Schleier, sondern
ein TOPASBLAUER SCHIMMER, der je nach Lichteinfall ueber das Glas
laeuft.
Hier lag genau das Gegenteil: ein breiter weisser Verlauf ueber ein
Fuenftel der Scheibe -- also die Spiegelung eines UNBESCHICHTETEN
Glases, das Merkmal des billigeren Materials. Jetzt: ein schmaler,
harter Reflexbogen an der Woelbung, der topasblaue Schimmer diagonal
darueber, und die haarfeine Schnittkante oben.
DAZU ZWEI WEITERE MITTEL AUS DEM UHRENBAU
* AUFGESETZTE INDIZES bei 3, 6 und 9. Auf einer guten Luenette sind
die Viertelstunden keine Striche wie die anderen: Sie sind eigene
Marken, breiter und HELL statt graviert -- weil sie aufgesetzt sind
und deshalb Licht fangen statt Schatten zu halten. Die 12 bleibt
die rote.
* DAS SEKUNDENFELD IST EIN EINGELASSENES FENSTER. Eine Zusatzanzeige
sitzt in einer Aussparung des Blatts; man erkennt das daran, dass
der Schatten oben hineinfaellt und unten eine helle Kante steht.
Genau diese beiden Schatten stehen jetzt darin.
DIE FASSUNG: DREI FARBEN STATT STAHL MIT TUPFERN
Links die rote Haelfte, rechts die babyblaue, dazwischen und an den
Raendern Schwarz -- und ueberall dort, wo Metall das Licht bricht, die
hellen Spitzlichter. Es sind dieselben zwei Farben wie im Motiv und auf
der Anmeldekarte.
DER HINTERGRUND: SECHS SCHICHTEN
Lichtkante, KOHLEFASERGEWEBE (zwei gegenlaeufige Schraegen, die sich
kreuzen -- bei drei Prozent sieht man kein Muster, man sieht ein
MATERIAL), das Messraster, ein HORIZONT im unteren Drittel mit Schein
darueber, die beiden Farbbecken kraeftiger als bisher, und ein fast
schwarzer Grund mit Blauschimmer oben.
Alles weit unter der Blendschwelle -- die Hausregel gilt auch fuer
"krank geil": Es darf beeindrucken, es darf nicht blenden.
Sieben Pruefungen gelaufen, alle gruen. Rechner und Handy angesehen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
dbb19f69e9 |
Uhrmacherei statt Lack: guillochiertes Blatt, laufende Perle, Spiegelung auf Metall
Filipe: "ich will dass diese kachel komplett speziell ist, das
hochwertigste und geilste auf der ganzen website ... auch das gleiche
prinzip fuer die uhr, noch vieeeel spezieller. hol die besten skills
von den besten skills dafuer."
Also keine weitere Schicht Lack, sondern die Mittel, an denen man ein
teures Instrument WIRKLICH erkennt.
DIE UHR -- VIER MITTEL AUS DER UHRMACHEREI
1. GUILLOCHIERTES ZIFFERBLATT. Guillochieren ist das Verfahren, mit
dem seit zweihundert Jahren hochwertige Blaetter gemacht werden:
Eine Maschine schneidet ein feines regelmaessiges Muster ins
Metall, und weil jede Rille das Licht anders zurueckwirft, LEBT
die Flaeche. Hier aus Strahlen vom Mittelpunkt und Ringen darum,
beide bei vier Prozent Deckkraft -- wer das Muster einzeln
erkennt, hat es zu laut gemacht.
2. EIN AUFGESETZTER ZWOELF-INDEX. Auf einem echten Blatt ist die
Zwoelf nie nur ein Strich wie die anderen: Sie ist das, woran das
Auge sich ausrichtet. Ein Keil in Hausrot mit heller Kante.
3. DIE PERLE AM KOPF DES SEKUNDENBOGENS. Sie laeuft einmal je Minute
herum und ist das Einzige an der Uhr, das sich BEWEGT statt zu
wachsen. Ein Bogen zeigt einen Stand, eine laufende Perle zeigt
Leben. Sie springt im Sekundentakt statt zu gleiten -- ehrlicher
(die Anzeige ist digital) und eine Bildberechnung je Sekunde statt
sechzig.
4. GRAVIERTE ZIFFERN. Ein dunkler Saum oben, ein heller unten -- das
Lichtverhalten einer Vertiefung. Die Ziffern stehen damit IM Blatt
statt darauf.
DIE KONSOLE -- DAS METALL FAENGT DAS LICHT
Auf den Kacheln leuchtet das Licht in der Farbe der Kategorie; dort ist
es ein Hinweis. Auf der Konsole waere das falsch -- ein farbiger
Schleier auf gebuerstetem Metall sieht aus wie eine Folie darauf.
Metall zeigt seine Form ueber die SPIEGELUNG: weiss, schmal, hart an
der Kante, und sie wandert mit dem Zeiger ueber die Fassung wie ein
Fenster, an dem man vorbeigeht. Erst dadurch sieht man, dass die
Fassung gewoelbt ist. Ein Standbild kann das nicht.
Dieselbe Falle wie heute Frueh dabei vermieden, diesmal vorher
bedacht: `.willkommen > *` haette dem Lichtelement wieder sein
`position: absolute` genommen -- jetzt `:not(.licht)`.
UND EIN FEHLER, DEN NUR DAS HANDY GEZEIGT HAT
Die Mulde der Uhr hing am Kasten daneben und war an dessen rechtem Rand
ausgerichtet. Am Rechner passte das; bei 412 px steht die Uhr mittig,
und die Mulde lag als dunkle Scheibe neben ihr. Sie entsteht jetzt aus
zwei Schattenringen der Uhr SELBST und ist damit konzentrisch bei jeder
Groesse -- die bessere Bauart, nicht nur die reparierte: Eine Fassung,
die man ausrichten muss, richtet irgendwann jemand falsch aus.
Zehn Pruefungen gelaufen, alle gruen. Rechner und Handy angesehen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
532daa3edf |
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]>
|
||
|
DogFatherGitandClaude Opus 5
|
2acb6bc020 |
Das Maus-Licht ist zurueck, und die Begruessung ist keine Kachel mehr
DAS LICHT, DAS DEM ZEIGER FOLGT -- MEIN EIGENER FEHLER VON HEUTE FRUEH
Es war nicht geloescht. In module.css stand seit heute
.kachel > * { position: relative; z-index: 1; }
damit der Inhalt ueber Raster und Kantenlicht liegt. Das Lichtelement
ist aber ein direktes KIND jeder Karte -- ihm wurde damit sein
`position: absolute` genommen. Aus einer Flaeche ueber der ganzen Karte
wurde ein leerer Inline-Span ohne Ausdehnung. Im Browser gemessen:
`display: inline`, obwohl in start.css `absolute` steht.
Merksatz dazu im Code: Eine Regel auf `> *` trifft auch das, was gar
kein Inhalt ist.
Zweiter, aelterer Fehler beim selben Thema, den erst die Pruefung
gefunden hat: Beim Wechsel von einer Kachel direkt auf die naechste
ging das Licht GANZ aus. `pointermove` der neuen Karte meldet einen
Bildaufbau an, `pointerout` der alten kommt danach und hat ihn
geloescht -- obwohl er gar nicht ihr gehoerte. Jetzt wird nur noch der
EIGENE Bildaufbau entwertet.
DIE BEGRUESSUNG FLIEGT AUS DER REIHE
Filipe: "diese hauptkachel muss komplett aus der rolle fliegen im
gegenzug zu den anderen ... AUCH MIT DER UHR RECHTS; WIE IN DER
BUISNESS HUB SEITE VON VANVAN."
Nachgesehen statt geraten: Auf VanVans Business-Hub gibt es keine Uhr.
Gemeint ist das `gate-medaillon` der Anmeldeseite -- ein runder
Kegelverlauf, der wie gebuerstetes Metall aussieht, gefasst in zwei
eingelassenen Ringen. Diese Bauart steht jetzt hier, weitergetrieben.
Die Begruessung ist keine Kachel mehr, sondern eine KONSOLE, und sie
unterscheidet sich in der FORM, nicht im Lack:
* Sie ist BREITER ALS DIE SEITE -- sie tritt links und rechts ueber
die Spalte hinaus, in der alle Kacheln stehen.
* Sie ist ein ACHTECK. Die Module haben EINE abgeschnittene Ecke,
sie hat VIER.
* Sie hat eine METALLFASSUNG, laengs gebuerstet, mit je einer warmen
und einer kuehlen Spiegelung.
Die Uhr ist von 124 auf 164 px gewachsen und hat eine echte Luenette:
10 px deckendes Metall, zwoelf eingravierte Stundenmarken, sechzig
feine Minutenstriche, Glaskuppe.
VIER FEHLER AUF DEM WEG DAHIN, ALLE IM BILDSCHIRMFOTO GESEHEN
1. HALBDURCHSICHTIGES METALL ist kein Metall, sondern graues Glas.
Stand gleichzeitig an Konsole und Uhr.
2. KEGELVERLAUF AUF EINEM BREITEN BALKEN bewirkt nichts: Die ganze
Oberkante liegt in wenigen Grad. Rund -> conic, lang -> linear.
Die Verlaufsart muss zur FORM passen, nicht zum Material.
3. DIE SKALA DER UHR WAR NIE SICHTBAR, seit es sie gibt. Ihre Maske
rechnete Prozente auf die weiteste ECKE (116 px) statt auf den
Radius (82 px) -- der Ring lag komplett ausserhalb der Uhr.
`closest-side` behebt es. Eine unsichtbare Verzierung sieht aus
wie gar keine, nicht wie ein Fehler.
4. `body.start .willkommen` in start.css hat die neue Konsole
ueberschrieben -- nicht ueber die Ladereihenfolge, sondern ueber
die SPEZIFITAET (0,2,1 gegen 0,1,0). Derselbe Fehler wie mit
`:where()` heute Frueh, nur andersherum: damals zu schwach
geschrieben, hier zu stark stehen gelassen.
Der Ueberstand haengt an der Polsterung der Inhaltsspalte
(`min(34px, 3.6vw)`) statt an einer festen Zahl -- eine feste haette
auf dem Handy 17 px aus dem Bildschirm geragt.
UND EINE PRUEFUNG, DIE UNTER DEN BILDRAND GEZIELT HAT
pruef-start-ansicht meldete zwei Fehler am Licht. Das Licht war in
Ordnung: Die hoehere Konsole hatte Kachel 3 auf y = 1134 geschoben,
bei einem 1200 px hohen Fenster lag ihre Mitte unter dem Rand. Sie
rollt jetzt hin, misst danach neu -- und die Zahl der wirklich
gemessenen Kacheln steht in der Bedingung. 140 statt 137 Pruefungen.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
||
|
DogFatherGitandClaude Opus 5
|
3b356d6eef |
Ein Material fuer die ganze Website -- und die Uhr wird zum Chronographen
DIE UHR: Sekunde nach AUSSEN, Minute in die Mitte, Stunde nach innen (Wunsch Filipe). Das ist die Anordnung eines Chronographen und nicht die eines Fortschrittsbalkens: Der schnellste Zeiger laeuft auf der laengsten Bahn, weil man Bewegung dort am besten sieht -- der langsamste innen, wo eine kleine Drehung viel bedeutet. Die drei Umfaenge sind mitgewandert; ein vertauschter Ring ohne vertauschte Zahlen endet nie dort, wo er soll. EIN MATERIAL FUER ALLE SEITEN. Die Startseite hatte seit heute beleuchtete Platten, die anderen sechzehn Seiten flache Rechtecke -- man wechselte die Seite und fiel aus einer Oberflaeche in eine andere. Ich habe das bisher Seite fuer Seite nachgezogen, und genau deshalb war es nie fertig: Es sind FUENFUNDVIERZIG Stellen. Jetzt EINE Regel. Die Klassenliste ist nicht erfunden, sondern gemessen -- es sind genau die, die `var(--flaeche)` als Kartenflaeche benutzen. `:where()` ist der Kniff dabei: Spezifitaet null, also ueberschreibt die Regel nichts, was eine Seite selbst festlegt. Eine Warnkarte bleibt rot, eine Spalte behaelt ihre Statusfarbe. Ohne das haette ich an dreissig Stellen `!important` gebraucht. DREI FUNDE DER PRUEFUNGEN, alle berechtigt: 1. `.profil-gruppe` gibt es nicht -- ich hatte den Namen aus dem Kopf geschrieben statt aus der Datei. pruef-struktur meldete totes CSS. Die Karten auf profil.html heissen `.gruppe`, und genau der Name darf NICHT in die Liste: Auf der Startseite heissen die Kachelgruppen ebenso und haetten ploetzlich eine Kartenflaeche. 2. Der erste Verlauf war HELLER als das, was er ersetzt. Ein Material, das die ganze Website aufhellt, hellt auch jeden Text darauf auf -- und das faellt an der leisesten Schrift zuerst auf. 3. `.gruppe__unter` stand auf 4,21:1. Und das ist der interessante Fall: Die Farbe war nicht schuld, eine VERSCHIEBUNG war es. Mit der fuenften Rolle rutschte auf personen.html alles eine Zeile nach unten, und die Zeile landete auf einer helleren Stelle des Buehnenbilds. Sie ist die einzige Beschriftung ohne Karte -- ein Text, dessen Untergrund ein FOTO ist, bekommt nicht den leisesten Ton. Jetzt 5,51:1. Der zweite Fund fiel nur auf, weil die Zahl sich nach meiner ersten Korrektur KEIN Stueck bewegte (zweimal exakt 4,21) -- dasselbe Zeichen wie schon zweimal heute: falsche Stelle, nicht zu wenig. Gruen: buehne (38), css-klassen (15), struktur (32), handy (59), breiten (23), start-ansicht (136), lesbarkeit (14), tempo (8), personen-liste (33). Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
4bb5afc942 |
Drei Ringe, klappbare Gruppen -- und die Calls-Seite endlich wirklich umgebaut
DU HATTEST RECHT (Bildschirmfoto 3). Beim letzten Mal habe ich an der Calls-Seite nur das MATERIAL der Karten getauscht und die Aufstellung gelassen. Drei Gruppen untereinander, und weil "Steht an" 27 Eintraege hat, lagen die beiden anderen ausserhalb des Bildes -- man SAH die Aenderung gar nicht, weil man nie so weit kam. Das war Lackieren, kein Umbauen. JETZT EIN BRETT AUS ZWEI SPALTEN. Die Gruppen sind eigenstaendige Tafeln in einem Raster; "Protokoll fehlt" (kurz, dringend) und "Festgehalten" (Archiv) liegen NEBEN der langen Liste statt darunter. `align-items: start` ist dabei der Punkt: Ohne ihn waeren alle Tafeln so hoch wie die hoechste, und neben der langen Liste stuenden zwei fast leere Kaesten. Welche Tafel wo landet, entscheidet die Breite und nicht das Skript -- eine festgeschriebene Spalte waere eine Zahl, die beim naechsten Fenster falsch ist. Jede Tafel klappt zu, und der Zustand wird gemerkt. Vorgabe: "Festgehalten" ist zu -- es ist das Archiv; wer die Seite oeffnet, will wissen, was ansteht. DIE GRUPPEN AUF DER STARTSEITE genauso. Der Kopf IST der Schalter, nicht ein Dreieck daneben: Die ganze Zeile ist ein Ziel von 40 Pixeln statt eines von vierzehn. <button> statt <div>, damit Tastaturbedienung und Ansage nicht mit tabindex und role nachgebaut werden muessen. Gemerkt wird je Gruppe UND je angesehener Rolle -- DogFather, der sich einen Creator ansieht, hat dort eine andere Aufteilung im Kopf. DIE UHR: drei Ringe statt zwei. Aussen die Stunde in Schwarzsilber, in der Mitte die Minute in Blau, innen die Sekunde in Rot -- von aussen nach innen immer schneller, so liest man eine Uhr ohne nachzudenken. UND SIE IST SCHARF. Kein blur(), kein drop-shadow mehr auf den Boegen -- an der alten lag beides drauf, und der Vorwurf stimmte. Der Glanz kommt jetzt aus dem VERLAUF: Echtes Metall glaenzt nicht, weil es leuchtet, sondern weil es das Licht abwechselnd hell und dunkel zurueckwirft. Fuenf Stopps statt zwei -- ein zweifarbiger Verlauf waere ein Farbverlauf, erst der Wechsel ist Metall. Dazu `shape-rendering="geometricPrecision"` (sonst rastert der Browser duenne Boegen grober) und Kappen auf `butt` statt `round`: Eine runde Kappe steht ueber das Ende hinaus, bei null Sekunden saehe man trotzdem einen Punkt. Minute und Stunde laufen WEICH mit: die Minute bekommt die Sekunden anteilig, die Stunde die Minuten. Ein Minutenring, der einmal pro Minute springt, sieht aus wie eine haengende Anzeige. Gruen: css-klassen (15), call-kategorien (17), start-ansicht (136), handy (59), breiten (23), buehne (38), struktur (32). NOCH OFFEN: der neue Kachelstil fuer die ganze Website und die Rolle "Spicy Media". Co-Authored-By: Claude Opus 5 <[email protected]> |
||
|
DogFatherGitandClaude Opus 5
|
4447a653e7 |
Die Uhr wird ein Gegenstand -- Rot x Babyblau, und start.css wird geteilt
DIE UHR. Filipe: "viel viel viel viel viel viel viel spezieller ... eine
mischung von rot und babyblau". Was eine Uhr teuer aussehen laesst, ist
nicht die Farbe, sondern das GEHAEUSE -- bei einer echten sieht man drei
Schichten uebereinander: einen Metallrand, der das Licht von oben faengt,
eine VERTIEFTE Scheibe darin, und ein Glas darueber, das spiegelt. Genau
die drei sind jetzt gebaut.
Die beiden Farben sind nicht aus dem Farbkasten: Rot ist Spicy Media,
Babyblau ist DogFather -- dieselben zwei, die im Kopf der Anmeldekarte
nebeneinanderstehen und im Motiv den Neonrahmen bilden. Zwei Verlaeufe,
absichtlich GEGENLAEUFIG (Stundenring rot->blau, Sekundenring blau->rot):
Wo der eine warm ist, ist der andere kuehl, so bleiben sie
auseinanderzuhalten, wo sie sich ueberlagern.
Dazu: eine Skala aus sechzig Strichen, jeder fuenfte kraeftiger (aus
einem Kegelverlauf, nicht aus sechzig Elementen); ein leuchtender Kopf,
der am Ende des Sekundenbogens mitlaeuft -- die einzige Stelle, an der
sich sichtbar etwas bewegt; und die Mischung IM Text als zwei Schatten
statt als Verlaufsschrift (background-clip: text waere im Windows-
Kontrastmodus unsichtbar). Die Glocke bekommt dasselbe Gehaeuse, nur
kleiner -- zwei runde Dinge aus verschiedenem Material sehen
zusammengesucht aus.
PROFILBILDER: /api/personen lieferte nur id, name, rolle. Deshalb konnte
KEINE Oberflaeche ein Gesicht zeigen, auch wenn eines hochgeladen war --
der Fehler lag nicht in der Anzeige, sondern in der Schnittstelle.
Jetzt kommt die fertige Bildadresse mit (nicht der Dateiname: sonst
setzt jede Stelle im Browser denselben Pfad zusammen). Und DogFather ist
fuer alle sichtbar -- Name, Rolle, Bild, sonst nichts; seine Eintraege,
Chats und Zahlen haengen weiter an den eigenen Regeln der Module.
start.css GETEILT statt gekuerzt. Sie lief mit 202 KB wieder in die
200-KB-Grenze, und diesmal war Kuerzen die falsche Antwort: Dreizehn
Seiten laden diese Datei, Uhr und Begruessungskachel braucht genau EINE.
Also heim.css -- 184 KB statt 202, und zwoelf Seiten laden 14 KB
weniger. Vorher mit grep nachgesehen, dass `uhr`, `willkommen` und
`glocke-platz` in keiner anderen HTML-Datei vorkommen.
ZWEI FUNDE DER PRUEFUNGEN, beide berechtigt:
- `.glocke--kachel` musste zurueck nach start.css. glocke.js laeuft auf
ALLEN siebzehn Seiten und kann die Klasse ueberall setzen; die Regel
gehoert dorthin, wo das Skript sie brauchen KANN, nicht dorthin, wo
es sie heute zufaellig braucht.
- Die Sekundenanzeige stand auf 10,88 px (Grenze 11,5). Gesperrte
Ziffern in Versalhoehe wirken kleiner als die Zahl sagt -- auf
11,84 px.
Gruen: css-klassen (15), struktur (32), sicht (48), buehne (38),
start-ansicht (136), handy (59), aufgabenbrett (44).
NOCH OFFEN aus derselben Nachricht: die Calls-Seite komplett umbauen mit
Auf-/Zuklappen ueberall, die Profilbilder auch WIRKLICH ueberall
zeichnen (die Daten sind jetzt da), die Rolle "Spicy Media" und
Manager-legt-Creator-an.
Co-Authored-By: Claude Opus 5 <[email protected]>
|