Post 7: Fusszeile und Kopfabstand der Karte

DIE FUSSZEILE STAND AUS DER KARTE HERAUS. "Bereit zum Veroeffentlichen"
endete bei x 797, die Karte bei 788 -- neun Einheiten daneben. Ursache
war ein fester Versatz von 138, gegriffen statt gerechnet. Jetzt wird
die Textbreite gemessen und das Ende an die innere Kante gehaengt, egal
wie lang der Satz ist.

Dazu der Abstand: 24 oben und 22 unten, die Zeile klebte am Rand und die
Karte sah unten beschnitten aus. Jetzt 28 zu 28.

DER KOPF WAR ZU ENG. Die Trennlinie unter den Reitern liegt bei 92, der
Inhalt begann bei 96 -- vier Einheiten, und die erste Frage klebte an der
Linie. Der Kopf steht jetzt als FB_KOPF auf 120, also 28 Einheiten Luft,
derselbe Wert wie unten. Die feste Kastenhoehe des Bewegtbilds rechnet
mit derselben Konstante statt mit einer wiederholten Zahl.

Bewegtbild neu gebaut.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01U7RZ6ZpLD8Dp84Rtt4KHfv

post7.html

@@ -3925,6 +3925,11 @@ if (location.search.indexOf("nur=anim") >= 0)
   const OPTIONEN = ["Heizung", "Sanitär", "Klima / Lüftung"];
 
   const FB_B = 720, FB_ZH = 78;      // Breite einer Fragezeile und ihre Hoehe
+  /* Hoehe des Kartenkopfs: Name, Reiter, Trennlinie. Die Linie liegt bei 92,
+     der Inhalt beginnt also 28 Einheiten darunter -- derselbe Abstand wie
+     unten zur Fusszeile. Vorher stand hier 96, das waren vier Einheiten, und
+     die erste Frage klebte an der Linie. */
+  const FB_KOPF = 120;
 
   /* Eine Fragezeile: Griff, Sinnbild, Titel mit Pflichtstern, darunter der
      Feldtyp, rechts Kopieren und Loeschen. Die beiden Werkzeuge stehen in der
@@ -3992,7 +3997,7 @@ if (location.search.indexOf("nur=anim") >= 0)
      Kopfzeile. Der Reiter "Fragen" ist der aktive, wie im Screenshot. */
   function fbRahmen(inhaltH, inhalt, o) {
     o = o || {};
-    const RAND = 34, KOPF = 96, B = FB_B + 2 * RAND;
+    const RAND = 34, KOPF = FB_KOPF, B = FB_B + 2 * RAND;
     let g = "";
     g += uiText(RAND + 4, 40, "Heizungs-Anfrage", 20, 800, CHAT_TEXT);
     const nb = messen("Heizungs-Anfrage", 20, 800);
@@ -4017,13 +4022,24 @@ if (location.search.indexOf("nur=anim") >= 0)
        fester Breite auf der Slide skaliert die ganze Zeichnung dabei kleiner.
        Die Karte wuchs also und schrumpfte gleichzeitig -- am Kontaktabzug als
        Wackeln zu sehen. Mit fester Hoehe bewegt sich nur der Inhalt. */
-    const H = o.h !== undefined ? o.h : KOPF + inhaltH + (o.fuss ? 46 : RAND);
+    const H = o.h !== undefined ? o.h : KOPF + inhaltH + (o.fuss ? 56 : RAND);
     if (o.fuss) {
-      const fy = KOPF + inhaltH + 24;
-      g += ikon("clock", RAND + 10, fy, 15, CHAT_TEXT3);
+      /* Die Fusszeile sitzt mittig zwischen der letzten Frage und der
+         Kartenkante: 28 nach oben, 28 nach unten. Vorher waren es 24 oben und
+         22 unten -- die Zeile klebte am Rand, und die Karte sah unten
+         beschnitten aus.
+
+         Rechts wird gemessen statt gezaehlt. Vorher stand dort ein fester
+         Versatz von 138, gegriffen und nicht gerechnet: der Satz endete neun
+         Einheiten AUSSERHALB der Karte. Jetzt haengt sein Ende an der
+         inneren Kante, egal wie lang er ist. */
+      const fy = KOPF + inhaltH + 28;
+      g += ikon("clock", RAND + 8, fy, 15, CHAT_TEXT3);
       g += uiText(RAND + 24, fy + 5, "Zuletzt gespeichert vor wenigen Sekunden", 14, 500, CHAT_TEXT3);
-      g += ikon("check-circle", B - RAND - 150, fy, 15, FB_GUT);
-      g += uiText(B - RAND - 138, fy + 5, "Bereit zum Veröffentlichen", 14, 700, FB_GUT);
+      const gut = "Bereit zum Veröffentlichen";
+      const gx = B - RAND - messen(gut, 14, 700);
+      g += ikon("check-circle", gx - 13, fy, 15, FB_GUT);
+      g += uiText(gx, fy + 5, gut, 14, 700, FB_GUT);
     }
     return stapelKasten(B, H, 22, g);
   }
@@ -4141,7 +4157,7 @@ if (location.search.indexOf("nur=anim") >= 0)
     /* Feste Kastenhoehe: der Endzustand, ausgerechnet statt gemessen --
        zwei Zeilen, dann die dritte Frage mit ihren drei Optionen, darunter
        der Knopf. */
-    return fbRahmen(0, g, { h: 96 + 2 * (FB_ZH + 12) + (FB_ZH + 10) +
+    return fbRahmen(0, g, { h: FB_KOPF + 2 * (FB_ZH + 12) + (FB_ZH + 10) +
                             OPTIONEN.length * 54 + 64 + 34 });
   }