feat: PDF mit Inter+JetBrains Mono (Cloud-Design-Anlehnung), Matrix kompakter

User: 'Kannst du die Schriftarten eher nachempfinden? Und die Matrix
ist so sehr raumgreifend ... das könnte deutlich in der Höhe gestaucht
sein.'

Fonts:
- Google-Fonts-Link für Inter + JetBrains Mono ergänzt im PDF-Template.
- font-family-Stack: 'Inter', dann Avenir/Helvetica als Fallback (falls
  WeasyPrint die CDN-Fonts nicht laden kann).
- Mono-Stack: 'JetBrains Mono' bevorzugt, dann Source Code Pro.

Matrix in der Höhe gestaucht (war ca. 320pt hoch, jetzt ~165pt):
- Zellen-Höhe 60pt → 28pt (Symbole bleiben mit 11pt-Schrift gut lesbar)
- Zellen-Breite 60pt → 52pt (knapper, Cells leicht breiter als hoch)
- Zeilen-Label-Spalte 90pt → 76pt
- Header-Reihe 24pt → 18pt
- Gap 2pt → 1.5pt
- Legend kleiner: 8pt → 7.5pt, swatches 12pt → 9pt

Resultat: Matrix-Block fast halbiert, Schwerpunkte-erklärt-Sektion
darunter rückt einen Seitenwechsel weniger in den Hintergrund.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dotty Dotter 2026-05-07 14:45:32 +02:00
parent f59286d15f
commit 55423e92e3

View File

@ -17,31 +17,32 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>GWÖ-Antragsprüfung — {{ assessment.title }}</title> <title>GWÖ-Antragsprüfung — {{ assessment.title }}</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
<style> <style>
@page { @page {
size: A4; size: A4;
margin: 18mm 16mm 22mm 16mm; margin: 18mm 16mm 22mm 16mm;
@bottom-left { @bottom-left {
content: "{{ assessment.drucksache }}"; content: "{{ assessment.drucksache }}";
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
color: #888; color: #888;
} }
@bottom-center { @bottom-center {
content: "gwoe.toppyr.de · GWÖ-Antragsprüfer · automatische Gemeinwohl-Bilanzierung"; content: "gwoe.toppyr.de · GWÖ-Antragsprüfer · automatische Gemeinwohl-Bilanzierung";
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
color: #888; color: #888;
} }
@bottom-right { @bottom-right {
content: "Seite " counter(page) " von " counter(pages); content: "Seite " counter(page) " von " counter(pages);
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
color: #888; color: #888;
} }
} }
* { box-sizing: border-box; margin: 0; padding: 0; } * { box-sizing: border-box; margin: 0; padding: 0; }
html, body { font-family: 'Avenir Next', 'Avenir', 'Helvetica Neue', Arial, sans-serif; } html, body { font-family: 'Inter', 'Avenir Next', 'Avenir', 'Helvetica Neue', Arial, sans-serif; }
body { body {
color: #1f1f1f; color: #1f1f1f;
font-size: 10pt; font-size: 10pt;
@ -55,7 +56,7 @@
margin-bottom: 12pt; margin-bottom: 12pt;
} }
.pdf-kicker { .pdf-kicker {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8.5pt; font-size: 8.5pt;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.07em; letter-spacing: 0.07em;
@ -70,7 +71,7 @@
margin: 0 0 6pt; margin: 0 0 6pt;
} }
.pdf-meta { .pdf-meta {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 9pt; font-size: 9pt;
color: #555; color: #555;
line-height: 1.5; line-height: 1.5;
@ -94,7 +95,7 @@
border-radius: 2pt; border-radius: 2pt;
background: #fff; background: #fff;
color: #444; color: #444;
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8.5pt; font-size: 8.5pt;
margin-right: 4pt; margin-right: 4pt;
} }
@ -105,7 +106,7 @@
page-break-inside: avoid; page-break-inside: avoid;
} }
.pdf-h2 { .pdf-h2 {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 9pt; font-size: 9pt;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
@ -126,7 +127,7 @@
border-top: 0.5pt dashed #ccc; border-top: 0.5pt dashed #ccc;
} }
.pdf-kernpunkte-label { .pdf-kernpunkte-label {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@ -156,7 +157,7 @@
gap: 16pt; gap: 16pt;
} }
.pdf-score-num { .pdf-score-num {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 36pt; font-size: 36pt;
font-weight: 700; font-weight: 700;
line-height: 1; line-height: 1;
@ -166,7 +167,7 @@
.pdf-score-num .slash { font-size: 16pt; opacity: 0.5; } .pdf-score-num .slash { font-size: 16pt; opacity: 0.5; }
.pdf-score-side { flex: 1; } .pdf-score-side { flex: 1; }
.pdf-score-label { .pdf-score-label {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@ -221,44 +222,47 @@
page-break-inside: avoid; page-break-inside: avoid;
} }
.pdf-matrix-grid { .pdf-matrix-grid {
/* kompakt: Zellen 28pt hoch (war 60pt), Höhe gesamt halbiert ohne
dass die Symbole unleserlich werden. Cells leicht breiter (52pt)
als hoch — die Symbole bleiben mittig. */
display: grid; display: grid;
grid-template-columns: 90pt repeat(5, 60pt); grid-template-columns: 76pt repeat(5, 52pt);
grid-template-rows: 24pt repeat(5, 60pt); grid-template-rows: 18pt repeat(5, 28pt);
gap: 2pt; gap: 1.5pt;
} }
.pdf-matrix-grid .col-label { .pdf-matrix-grid .col-label {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 7pt; font-size: 6.5pt;
font-weight: 700;
color: #009DA5;
text-transform: uppercase;
letter-spacing: 0.04em;
display: flex;
align-items: end;
justify-content: center;
padding-bottom: 3pt;
text-align: center;
line-height: 1.1;
}
.pdf-matrix-grid .row-label {
font-family: 'Source Code Pro', monospace;
font-size: 7.5pt;
font-weight: 700; font-weight: 700;
color: #009DA5; color: #009DA5;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.03em; letter-spacing: 0.03em;
display: flex; display: flex;
align-items: end;
justify-content: center;
padding-bottom: 2pt;
text-align: center;
line-height: 1.05;
}
.pdf-matrix-grid .row-label {
font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 7pt;
font-weight: 700;
color: #009DA5;
text-transform: uppercase;
letter-spacing: 0.02em;
display: flex;
align-items: center; align-items: center;
padding-right: 5pt; padding-right: 4pt;
line-height: 1.15; line-height: 1.1;
} }
.pdf-matrix-grid .cell { .pdf-matrix-grid .cell {
border-radius: 1pt; border-radius: 1pt;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 13pt; font-size: 11pt;
font-weight: 700; font-weight: 700;
} }
.cell.r-pp { background: #889E33; color: #fff; } .cell.r-pp { background: #889E33; color: #fff; }
@ -268,21 +272,21 @@
.cell.r-nn { background: #9A2A2A; color: #fff; } .cell.r-nn { background: #9A2A2A; color: #fff; }
.pdf-matrix-legend { .pdf-matrix-legend {
margin-top: 6pt; margin-top: 5pt;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 4pt 14pt; gap: 3pt 12pt;
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 7.5pt;
color: #444; color: #444;
} }
.pdf-matrix-legend .legend-item { .pdf-matrix-legend .legend-item {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 4pt; gap: 3pt;
} }
.pdf-matrix-legend .swatch { .pdf-matrix-legend .swatch {
width: 12pt; height: 12pt; border-radius: 1pt; flex-shrink: 0; width: 9pt; height: 9pt; border-radius: 1pt; flex-shrink: 0;
} }
/* ── Schwerpunkt-Felder-Erklaerung (Ersatz fuer Klick im PDF) ── */ /* ── Schwerpunkt-Felder-Erklaerung (Ersatz fuer Klick im PDF) ── */
@ -306,7 +310,7 @@
margin-bottom: 3pt; margin-bottom: 3pt;
} }
.pdf-schwerpunkt-code { .pdf-schwerpunkt-code {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
font-weight: 700; font-weight: 700;
padding: 1pt 5pt; padding: 1pt 5pt;
@ -315,7 +319,7 @@
background: #009DA5; background: #009DA5;
} }
.pdf-schwerpunkt-rating { .pdf-schwerpunkt-rating {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
font-weight: 700; font-weight: 700;
color: #555; color: #555;
@ -352,7 +356,7 @@
font-weight: 700; font-weight: 700;
} }
.pdf-pill { .pdf-pill {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 7pt; font-size: 7pt;
text-transform: uppercase; text-transform: uppercase;
padding: 1pt 5pt; padding: 1pt 5pt;
@ -373,7 +377,7 @@
margin-bottom: 3pt; margin-bottom: 3pt;
} }
.pdf-prog-label { .pdf-prog-label {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8.5pt; font-size: 8.5pt;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
@ -382,7 +386,7 @@
} }
.pdf-prog-spacer { flex: 1; } .pdf-prog-spacer { flex: 1; }
.pdf-prog-score { .pdf-prog-score {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8.5pt; font-size: 8.5pt;
font-weight: 700; font-weight: 700;
padding: 1pt 5pt; padding: 1pt 5pt;
@ -408,7 +412,7 @@
} }
.pdf-prog-zitat .src { .pdf-prog-zitat .src {
display: block; display: block;
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
color: #555; color: #555;
margin-top: 2pt; margin-top: 2pt;
@ -431,7 +435,7 @@
page-break-inside: avoid; page-break-inside: avoid;
} }
.pdf-verbesserung-num { .pdf-verbesserung-num {
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8pt; font-size: 8pt;
color: #555; color: #555;
margin-bottom: 4pt; margin-bottom: 4pt;
@ -472,7 +476,7 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 6pt 12pt; gap: 6pt 12pt;
font-family: 'Source Code Pro', monospace; font-family: 'JetBrains Mono', 'Source Code Pro', monospace;
font-size: 8.5pt; font-size: 8.5pt;
} }
.pdf-vote-side { font-weight: 700; } .pdf-vote-side { font-weight: 700; }