Schrift skaliert mit dem Fenster: 96 px-Werte -> rem + fluide Wurzel (v=167)

User-Wunsch: "Schriftarten im Dashboard auf em einstellen, damit auf jedem
Geraet oder je nach Fenstergroesse die Schriftgroesse automatisch angepasst
wird."

Umgesetzt mit rem + fluider Wurzel, NICHT mit em. Der Wunsch war richtig,
die genannte Einheit nicht: `em` ist relativ zum ELTERNelement und reagiert
auf die Fenstergroesse gar nicht -- verschachtelt multipliziert es sich sogar
(h2 mit 1,2em in einer Karte mit 1,1em landet bei 1,32x).

  html { font-size: clamp(17px, 16px + 0.5vw, 24px); }

  390px Handy -> 17,95px  (bisher 18,00 -- bewusst kein Rueckschritt)
  768px       -> 19,84px
  1440px      -> 23,20px
  ab 1600px   -> 24,00px (Deckel)

Der Anker ist so gesetzt, dass am Handy NICHTS kleiner wird -- der User hat
die Groesse am 24.07. zweimal von Hand hochgesetzt; eine Responsive-Umstellung,
die sie wieder eindampft, waere eine stille Ruecknahme seiner Entscheidung.

Verifiziert statt behauptet:
  - alle 96 Deklarationen gegen die 18px-Referenz zurueckgerechnet,
    groesster Fehler 0,0008 px
  - 93 font-size + 3 font:<weight> Npx/...-Shorthand (.ms-chip/.ms-bos-lbl/
    .sqm-badge -- die waren beim Bump am 24.07. zuerst uebersehen worden)
  - ausgeliefert: 0 px-Schriftgroessen, fluide Wurzel da, HTML zieht v=167

Zwei Vorbedingungen geprueft, nicht angenommen:
  - viewport-Meta ist gesetzt (sonst wuerde vw am Handy ~980px messen)
  - beide Media-Queries stehen in px, verschieben sich also nicht mit der
    Schrift (die klassische em-Falle bei Breakpoints)

Abstaende bleiben in px -- sie mitzuskalieren waere ein weit groesserer
Eingriff mit Layout-Risiko; die Anfrage betraf die Schrift.

Groesse global aendern = jetzt EINE Zeile statt 96 Einzelwerten.
Zurueck: web/style.css.bak-2026-08-13

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

This commit is contained in:

Axel Hocks

2026-08-13 11:12:13 +02:00

co-authored by

Claude Opus 5

parent 5819a9df21

commit 01916134be

4 changed files with 673 additions and 106 deletions

									
										web/index.html
									
		+2
		-2
	
												View File
												
				@@ -6,7 +6,7 @@

				  <meta name="theme-color" content="#0d1117">

				  <title>Oil · MT5</title>

				  <link rel="manifest" href="manifest.json">

				  <link rel="stylesheet" href="style.css?v=166">

				  <link rel="stylesheet" href="style.css?v=167">

				</head>

				<body>

				  <!-- Modul-Menü (ganz oben) -->

				@@ -356,6 +356,6 @@

				  </div>

				  <div id="toast" class="toast hidden"></div>

				  <script src="app.js?v=166"></script>

				  <script src="app.js?v=167"></script>

				</body>

				</html>