tobias/gwoe-antragspruefer
1
0
Fork 0
Code Issues 11 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat: Scorecard-Browser — skaliert auf 90 % Viewport-Hoehe (mit Width-Fallback)

Browse Source 
User: 'Skaliere die Scorecard so, dass sie die Hoehe des Browser
Viewports Minus 10% einnimmt'

Vorherige Logik nahm scaleByWidth, capped auf 1.0. Jetzt zwei Faktoren
und das kleinere gewinnt:
- scaleByHeight = window.innerHeight * 0.9 / 1350
- scaleByWidth  = (window.innerWidth - 40) / 1080
- scale = min(beiden, max 1.0)

Auf einem 1440×900-Desktop ergibt das scale 0.6 (= 90% × 900 / 1350),
Card 648×810. Auf einem 390-px-Phone gewinnt die Breite-Begrenzung,
Card skaliert kleiner damit horizontal nichts abgeschnitten wird.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dotty Dotter 2026-05-07 14:11:38 +02:00
parent 2b5062df08
commit 0b5dcba8f9
1 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
app/templates/v2/screens/scorecard_portrait.html
View File

@ -267,9 +267,10 @@
</div>{# .card-viewport #} </div>{# .card-viewport #}
<script> <script>
/* Browser-Preview-Skalierung: passt die 1080×1350-Card proportional auf /* Browser-Preview-Skalierung: Card soll 90 % der Viewport-Hoehe einnehmen.
den verfuegbaren Viewport an. WeasyPrint fuehrt kein JS aus → PDF Falls die daraus resultierende Breite ueber den Viewport hinausginge
bleibt bei skalierungsfreier Originalgroesse. */ (schmale Mobile-Viewports), greift die Breiten-Begrenzung. WeasyPrint
fuehrt kein JS aus → PDF bleibt bei skalierungsfreier Originalgroesse. */
(function () { (function () {
function adjustScale() { function adjustScale() {
var card = document.querySelector('.card'); var card = document.querySelector('.card');
@ -278,13 +279,10 @@
var pad = 40; var pad = 40;
var availW = window.innerWidth - pad; var availW = window.innerWidth - pad;
var availH = window.innerHeight - pad; var availH = window.innerHeight - pad;
var scaleW = availW / 1080; var scaleByHeight = (window.innerHeight * 0.9) / 1350;
var scaleH = availH / 1350; var scaleByWidth = availW / 1080;
var scale = Math.min(scaleW, 1); // bei Desktop nicht hochskalieren var scale = Math.min(scaleByHeight, scaleByWidth);
if (availH < 1350) { if (scale > 1) scale = 1; // nie ueber 100% hochskalieren
// Wenn die Hoehe nicht reicht: scrollen statt nochmal verkleinern
// (User kann scrollen, lieber lesbar als mini).
}
card.style.transform = 'scale(' + scale + ')'; card.style.transform = 'scale(' + scale + ')';
viewport.style.width = (1080 * scale) + 'px'; viewport.style.width = (1080 * scale) + 'px';
viewport.style.height = (1350 * scale) + 'px'; viewport.style.height = (1350 * scale) + 'px';