fix(quick-260922-ge2): Rahmenhoehe in der Kachel = Vorschauhoehe, Vorschau ohne Querbalken

Befund aus dem Browser-Rundgang: example.com setzt `margin: 15vh` — mit
3000 px Vorschauhoehe lag die Ueberschrift bei y 450, in der Kachel mit
720 px Rahmenhoehe bei y 108. Der in der Vorschau gewaehlte Ausschnitt
zeigte in der Kachel also etwas anderes. Die Kachel nutzt jetzt dieselbe
Layouthoehe wie die Vorschau (3000), damit vh-relative Seiten identisch
umbrechen; der Rest wird ohnehin weggeschnitten.

Vorschau: `overflow-x-hidden`, die Eckgriffe am rechten Rand erzeugten
einen 4-px-Querbalken.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-09-22 12:22:37 +02:00
parent 30fdd99724
commit cf70a197cd
4 changed files with 25 additions and 19 deletions
@@ -8,10 +8,14 @@
* der beiden Massstaebe (darf > 1 sein: ein kleiner Ausschnitt in einer
* grossen Kachel wird vergroessert) und die Zentrierung im Rest.
*
* `frameHeight` ist mindestens 720: die eingebettete Seite braucht eine
* Layouthoehe, sonst rendern viele Seiten ihren Inhalt nicht oder brechen
* ihn anders um; liegt der Ausschnitt tiefer, reicht der Rahmen bis zu
* seiner Unterkante.
* `frameHeight` ist IMMER die Vorschauhoehe (3000 Seitenpixel), nicht
* "Unterkante des Ausschnitts": viele Seiten setzen Masse relativ zur
* Fensterhoehe (`vh`, `100vh`-Zentrierung, `margin: 15vh` bei example.com).
* Haetten Vorschau und Kachel verschiedene Rahmenhoehen, laege derselbe
* Inhalt an verschiedenen Stellen — der in der Vorschau gewaehlte Ausschnitt
* zeigte in der Kachel etwas anderes (Browser-Rundgang 22.09.2026: Ueberschrift
* in der Vorschau bei y 450, in der Kachel mit 720 px Rahmen bei y 108).
* Gleiche Hoehe = gleiches Layout; der Rest wird ohnehin weggeschnitten.
*
* Ziehmathematik der Vorschau: `move` verschiebt bei fester Groesse und
* klemmt an den Seitenraendern; die Eckmodi bewegen nur die zwei Kanten
@@ -29,10 +33,12 @@ import {
clampXframeCrop,
} from './xframe-config';
/** Hoehe der Vorschau-Seite in Seitenpixeln (Vorschau und Ziehen); 4000 bleibt die Speichergrenze. */
/**
* Hoehe der Seite in Seitenpixeln — in der Vorschau (Stage, Ziehen) UND als
* Layouthoehe des Rahmens in der Kachel (siehe Kopfkommentar); 4000 bleibt
* die Speichergrenze fuer `crop.y + crop.h`.
*/
export const XFRAME_PREVIEW_PAGE_HEIGHT = 3000;
/** Mindest-Layouthoehe des Rahmens im Ausschnitt-Modus. */
const MIN_FRAME_HEIGHT = 720;
export type XframeDragMode = 'move' | 'nw' | 'ne' | 'sw' | 'se';
@@ -45,7 +51,7 @@ export interface XframeCropLayout {
}
export function computeCropLayout(crop: XframeCrop, tileW: number, tileH: number): XframeCropLayout {
const frameHeight = Math.max(crop.y + crop.h, MIN_FRAME_HEIGHT);
const frameHeight = XFRAME_PREVIEW_PAGE_HEIGHT;
if (tileW <= 0 || tileH <= 0) return { scale: 0, left: 0, top: 0, frameHeight };
const scale = Math.min(tileW / crop.w, tileH / crop.h);
return {