From 8c7dc1fa94d7e105da4580431493a25ca8d233c2 Mon Sep 17 00:00:00 2001 From: Dogfather Date: Wed, 9 Sep 2026 01:09:02 +0200 Subject: [PATCH] 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 --- workspace/assets/css/heim.css | 93 ++++++++++++++++++++++++++++++++-- workspace/assets/css/start.css | 16 +++++- workspace/aufgaben.html | 18 +++---- workspace/automation.html | 20 ++++---- workspace/bereich.html | 28 +++++----- workspace/calls.html | 22 ++++---- workspace/chat.html | 20 ++++---- workspace/content.html | 24 ++++----- workspace/dateien.html | 20 ++++---- workspace/index.html | 4 +- workspace/kalender.html | 22 ++++---- workspace/leistung.html | 20 ++++---- workspace/personen.html | 20 ++++---- workspace/profil.html | 22 ++++---- workspace/report.html | 22 ++++---- workspace/scouting.html | 20 ++++---- workspace/start.html | 18 +++---- workspace/startcheck.html | 22 ++++---- workspace/steckbrief.html | 20 ++++---- workspace/uebersicht.html | 20 ++++---- workspace/wissen.html | 20 ++++---- 21 files changed, 294 insertions(+), 197 deletions(-) diff --git a/workspace/assets/css/heim.css b/workspace/assets/css/heim.css index 740017b5..23ba0093 100644 --- a/workspace/assets/css/heim.css +++ b/workspace/assets/css/heim.css @@ -93,6 +93,46 @@ --k-fase: 26px; --k-rand: 4px; + /* ==== DIE BEIDEN INSTRUMENTE SIND GLEICH GROSS ================== + (09.09.2026, 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 EINE Variable ueber beide -- und ueber die + Spalten des Rasters, in denen sie sitzen. Wer sie aendert, aendert + alles drei gleichzeitig, und ein Auseinanderlaufen ist nicht mehr + moeglich, sondern muesste absichtlich geschrieben werden. + + 248 statt 232: "bissl groesser" am oberen Ende, gemessen gegen die + Kachelhoehe. Mehr geht nicht, ohne dass die Kachel waechst und die + erste Kachelreihe darunter aus dem Bild rutscht -- genau die + Rechnung, die weiter unten bei der Polsterung steht. */ + --instrument: 248px; + + /* DIE SPALTE IST BREITER ALS DAS INSTRUMENT DARIN, und zwar genau um + das, was daneben steht: die Knopfreihe (48 px) und der Abstand + dazu (14 px). + + Nachgemessen, nachdem ich es zuerst falsch hatte: Mit einer Spalte + von 248 px brauchte die rechte Seite 310 und die Uhr hing 32 px + UEBER die Kachelkante hinaus. Die Seite liess sich trotzdem nicht + seitlich schieben -- der Ueberstand lag innerhalb der Kachel, also + hat keine der vorhandenen Pruefungen angeschlagen. Man sah es nur + im Bild. + + BEIDE Aussenspalten bekommen dieselbe Breite, obwohl links keine + Knoepfe stehen: Sonst saesse der Titel in der Mitte nicht mehr + mittig. Der Ring wird in seiner Spalte zentriert. */ + --instrument-knoepfe: 62px; + --spalte: calc(var(--instrument) + var(--instrument-knoepfe)); + position: relative; /* 20px oben/unten statt 26. @@ -423,7 +463,7 @@ naechsten Umbau. */ .willkommen__reihe { display: grid; - grid-template-columns: minmax(180px, 232px) minmax(0, 1fr) minmax(180px, 232px); + grid-template-columns: minmax(180px, var(--spalte)) minmax(0, 1fr) minmax(180px, var(--spalte)); gap: 26px; align-items: center; } .willkommen__text { @@ -441,7 +481,11 @@ Das ist der Grund, warum die Tafel ruhig wirkt: zwei gleiche Gewichte links und rechts, dazwischen der Text. */ .zring { - position: relative; aspect-ratio: 1; width: 100%; max-width: 232px; + position: relative; aspect-ratio: 1; width: 100%; max-width: var(--instrument); + /* In der breiteren Spalte mittig -- sonst klebte er links, waehrend + die Uhr rechts an ihrer Kante steht, und die Kachel saehe schief + aus, ohne dass eine Zahl falsch waere. */ + justify-self: center; margin: 0 auto; } .zring__bild { @@ -623,12 +667,13 @@ messen. Genau das ist im September einmal vergessen worden, und der Sicht-Umschalter lag danach ueber dem Chat-Knopf. */ @media (max-width: 1180px) { - .willkommen__reihe { grid-template-columns: minmax(170px, 220px) minmax(0, 1fr); } + .willkommen { --instrument: 224px; } + .willkommen__reihe { grid-template-columns: minmax(170px, var(--spalte)) minmax(0, 1fr); } .willkommen__rechts { grid-column: 1 / -1; justify-content: center; margin-left: 0; } } @media (max-width: 780px) { + .willkommen { --instrument: 196px; } .willkommen__reihe { grid-template-columns: minmax(0, 1fr); gap: 20px; } - .zring { max-width: 190px; } .zgruss { flex-wrap: wrap; justify-content: center; } .zgruss__text { text-align: center; align-items: center; } } @@ -906,6 +951,46 @@ denen es sie gar nicht gibt (iPhone im Browser), bleibt ein leerer Streifen neben der Uhr; das ist der Preis, und er ist niedriger als ein springendes Bild. */ +/* DIE UHR IST GENAU SO GROSS WIE DER RING -- aus derselben Variablen. + + Ihre Groesse stand bis zum 09.09.2026 in start.css (164 px, auf dem + Handy 118). Sie steht jetzt HIER, direkt neben dem Ring, und beide + lesen `--instrument`. Der Grund ist nicht Ordnungsliebe: Solange die + beiden Zahlen in zwei Dateien standen, konnte niemand sie + nebeneinander sehen, und sie sind auf 232 gegen 164 auseinandergelaufen. + + heim.css laedt NACH start.css und gewinnt damit bei gleicher + Spezifitaet. Die alte Angabe dort ist trotzdem entfernt worden statt + ueberschrieben -- eine wirkungslose Zahl, die richtig aussieht, ist + genau die Falle, in die ich in dieser Datei schon zweimal gelaufen + bin. + + `aspect-ratio` statt einer zweiten Zahl fuer die Hoehe: Ein Kreis, + dessen Breite und Hoehe getrennt gepflegt werden, ist irgendwann ein + Ei. */ +.uhr { + width: var(--instrument); + height: auto; + aspect-ratio: 1; +} +/* DIE ZIFFERN WACHSEN MIT. Sie standen in `rem` -- in einer Uhr von + 164 px war das richtig, in einer von 248 sahen sie verloren aus + (gemessen 29,76 px in einem 248-px-Zifferblatt). Eine feste Zahl + neben einer veraenderlichen ist wieder genau die Doppelung, die hier + gerade beseitigt wurde: Wer `--instrument` aendert, muesste sonst + daran denken, auch die Schrift nachzuziehen. + + DER FAKTOR IST NACHGESEHEN, NICHT GERECHNET. Bei 164 px stand die + Uhrzeit auf 29,76 px, das sind 0,1815. Mit 0,145 wirkten die Ziffern + im 248er Zifferblatt verloren -- die Mitte war eine grosse leere + Flaeche. Mit 0,168 fuellen sie sie, ohne an die innerste Bahn zu + stossen: 248 x 0,168 = 41,7 px, und die Stundenbalken liegen bei + Radius 31,5 von 50, also 156 px Durchmesser. Der Abstand bleibt. + Auf dem Handy ergibt es 32,9 px statt der frueheren 20,8 -- dort war + die Uhr aber auch nur 118 px gross und ist jetzt 196. */ +.uhr__zeit { font-size: calc(var(--instrument) * .168); } +.uhr__sek { font-size: calc(var(--instrument) * .068); } + .glocke-platz { /* ZWEI KNOEPFE UEBEREINANDER, und der Platz gilt fuer beide. diff --git a/workspace/assets/css/start.css b/workspace/assets/css/start.css index 4e8dbe18..166495be 100644 --- a/workspace/assets/css/start.css +++ b/workspace/assets/css/start.css @@ -5087,9 +5087,19 @@ body[data-fremde-sicht="ja"]::after { "krasser" heisst bei einem Instrument zuerst "lesbar". Auf dem Handy bleibt sie bei 118 px, dort steht sie unter dem Text statt daneben. ===================================================================== */ +/* DIE GROESSE STEHT NICHT MEHR HIER (09.09.2026). + + Hier standen `width: 164px; height: 164px` -- und in heim.css stand + der Ring daneben auf 232. Zwei Dateien, zwei Zahlen, und keine + Stelle, an der jemand beide zugleich sieht. Filipe wollte sie gleich + gross; jetzt entscheidet `--instrument` in heim.css ueber BEIDE. + + Wer die Uhr groesser machen will, aendert dort eine Zahl -- nicht + hier. Eine zweite Angabe an dieser Stelle waere wirkungslos (heim.css + laedt spaeter) und wuerde trotzdem richtig aussehen. */ .uhr { position: relative; - width: 164px; height: 164px; flex: none; + flex: none; display: grid; place-items: center; border-radius: 50%; padding: 10px; @@ -5589,7 +5599,9 @@ body[data-fremde-sicht="ja"]::after { justify-content: space-around; } .stand { min-width: 0; flex: 1 1 0; padding: 10px 8px 9px; } - .uhr { width: 118px; height: 118px; padding: 4px; } + /* Die Groesse kommt aus `--instrument` (heim.css), hier bleibt nur + die engere Polsterung fuer schmale Schirme. */ + .uhr { padding: 4px; } .uhr__zeit { font-size: 1.3rem; } } diff --git a/workspace/aufgaben.html b/workspace/aufgaben.html index 18d8b482..49939b06 100644 --- a/workspace/aufgaben.html +++ b/workspace/aufgaben.html @@ -14,10 +14,10 @@ - - - - + + + + @@ -217,10 +217,10 @@ - - - - - + + + + + diff --git a/workspace/automation.html b/workspace/automation.html index 9cc65045..151a5883 100644 --- a/workspace/automation.html +++ b/workspace/automation.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -140,10 +140,10 @@ - - - - - + + + + + diff --git a/workspace/bereich.html b/workspace/bereich.html index c93d7b1d..17723bb2 100644 --- a/workspace/bereich.html +++ b/workspace/bereich.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -149,14 +149,14 @@ - - - - - - - - - + + + + + + + + + diff --git a/workspace/calls.html b/workspace/calls.html index 856ff9b2..96be47f6 100644 --- a/workspace/calls.html +++ b/workspace/calls.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -82,11 +82,11 @@ - - - - - - + + + + + + diff --git a/workspace/chat.html b/workspace/chat.html index 81966cbe..a76fed40 100644 --- a/workspace/chat.html +++ b/workspace/chat.html @@ -14,17 +14,17 @@ - - + + - - - + + + @@ -160,10 +160,10 @@ - - - - - + + + + + diff --git a/workspace/content.html b/workspace/content.html index c94317a3..b1f16b5d 100644 --- a/workspace/content.html +++ b/workspace/content.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -172,12 +172,12 @@ - - - - - - - + + + + + + + diff --git a/workspace/dateien.html b/workspace/dateien.html index c90b0f12..ee5f53b5 100644 --- a/workspace/dateien.html +++ b/workspace/dateien.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -101,10 +101,10 @@ - - - - - + + + + + diff --git a/workspace/index.html b/workspace/index.html index 554c078d..aefda0fe 100644 --- a/workspace/index.html +++ b/workspace/index.html @@ -32,7 +32,7 @@ - + @@ -382,6 +382,6 @@ - + diff --git a/workspace/kalender.html b/workspace/kalender.html index bbb0a208..60f3bcf4 100644 --- a/workspace/kalender.html +++ b/workspace/kalender.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -340,11 +340,11 @@ - - - - - - + + + + + + diff --git a/workspace/leistung.html b/workspace/leistung.html index 1ddbc978..f39e3b2a 100644 --- a/workspace/leistung.html +++ b/workspace/leistung.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -217,10 +217,10 @@ - - - - - + + + + + diff --git a/workspace/personen.html b/workspace/personen.html index 1166db55..a51fdbdb 100644 --- a/workspace/personen.html +++ b/workspace/personen.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -305,10 +305,10 @@ - - - - - + + + + + diff --git a/workspace/profil.html b/workspace/profil.html index 1985bd9f..1470f72b 100644 --- a/workspace/profil.html +++ b/workspace/profil.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -207,11 +207,11 @@ - - - - - - + + + + + + diff --git a/workspace/report.html b/workspace/report.html index d37102c7..39db5d87 100644 --- a/workspace/report.html +++ b/workspace/report.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -99,11 +99,11 @@ - - - - - - + + + + + + diff --git a/workspace/scouting.html b/workspace/scouting.html index a0464d9e..736f0c0a 100644 --- a/workspace/scouting.html +++ b/workspace/scouting.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -132,10 +132,10 @@ - - - - - + + + + + diff --git a/workspace/start.html b/workspace/start.html index 86177363..cb42c5a2 100644 --- a/workspace/start.html +++ b/workspace/start.html @@ -14,12 +14,12 @@ - - + + - - + + @@ -522,10 +522,10 @@

- - - - - + + + + + diff --git a/workspace/startcheck.html b/workspace/startcheck.html index 27b3fd9a..38af0bba 100644 --- a/workspace/startcheck.html +++ b/workspace/startcheck.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -78,11 +78,11 @@ - - - - - - + + + + + + diff --git a/workspace/steckbrief.html b/workspace/steckbrief.html index 125ebbd9..56145dbb 100644 --- a/workspace/steckbrief.html +++ b/workspace/steckbrief.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -119,10 +119,10 @@ - - - - - + + + + + diff --git a/workspace/uebersicht.html b/workspace/uebersicht.html index d76f4146..79cbda5a 100644 --- a/workspace/uebersicht.html +++ b/workspace/uebersicht.html @@ -14,13 +14,13 @@ - - + + - - - + + + @@ -142,11 +142,11 @@ - + - - - - + + + + diff --git a/workspace/wissen.html b/workspace/wissen.html index 13f276ad..88bef148 100644 --- a/workspace/wissen.html +++ b/workspace/wissen.html @@ -14,11 +14,11 @@ - - - - - + + + + + @@ -183,10 +183,10 @@ - - - - - + + + + +