update

templates/Format/OnePager.md

@@ -0,0 +1,96 @@
+```
+ONEPAGER-STIL QUERFORMAT (HTML/CSS → PDF via WeasyPrint)
+
+FORMAT
+- A4 Querformat (297mm × 210mm)
+- @page { size: A4 landscape; margin: 0; }
+- Padding: 9mm 11mm 9mm 11mm
+
+LAYOUT
+- Grid: hero+stats (auto) / divider / main (1fr, 3 Spalten) / footer (absolute)
+- Stats-Bar in Hero integriert (rechts), spart vertikalen Platz
+- Main: 3 Spalten gleich breit, gap 4mm
+- Spalten intern: flex-column, gap 4mm
+- 6 thematische Blöcke verteilt (2 pro Spalte)
+
+STRUKTUR (in dieser Reihenfolge)
+1. Hero: Logo links (22mm), Titel + Untertitel mittig, 4 Stats rechts
+2. Divider: 1.5pt schwarze Linie
+3. Main-Grid: 6 Blöcke in 3 Spalten
+4. Footer: farbige Box mit Kernaussage + Tag (absolute, unten)
+
+UNTERSCHIEDE ZU HOCHFORMAT
+- 3 Spalten statt 2 (mehr horizontaler Platz)
+- 6 Blöcke statt 4-5
+- Stats integriert in Hero statt eigene Zeile
+- Kleinere Schriftgrößen (9.5pt Body statt 10pt)
+- Kompaktere Code-Blöcke (7pt statt 7.5pt)
+
+BLOCK-AUFBAU
+- Titel: 9.5pt bold uppercase, Icon links, Hauptfarbe-Unterstreichung 2pt
+- Inhalt: visuell, nicht reine Textbullets
+- Varianten: Icon-Liste, Code-Block, Kachel-Grid, Plus/Minus-Spalten, Type-Grid
+
+FARBEN (max 3 + Neutrals)
+- Hauptfarbe: an offizielle Farbe des Themas anlehnen
+- Hauptfarbe-Dunkel: für Headings
+- Hauptfarbe-Darker: für Footer
+- Akzentfarbe: kontrastierend
+- Hintergrund-Soft: helle Variante der Hauptfarbe
+- Code-Hintergrund: #1e2a3a
+- Text: #1a1a1a / muted #5a6470 / Linie #e5e5e5
+
+TYPOGRAFIE
+- Body: 9.5pt, line-height 1.4
+- Hero h1: 20pt bold
+- Block-Titel: 9.5pt bold uppercase, letter-spacing 0.5pt
+- Stats-Zahl: 14pt bold, Label 6.5pt uppercase
+- Code: 7pt monospace, dunkler Hintergrund
+- Feature-Text: 8.5pt
+- Max 3 Schriftgrößen pro Block
+
+ICONS
+- SVG inline, stroke statt fill
+- 4mm in Block-Titeln (kleiner als Hochformat wegen kompakter Layout)
+- 2.8mm in Kachel-Icons
+- currentColor für automatische Anpassung
+
+THEMENSPEZIFISCHE ANPASSUNGEN (vor Generierung wählen)
+- Hauptfarbe: offizielle Farbe des Themas
+- Logo-Buchstabe(n) oder Kürzel
+- 4 Stats: themen-relevante Zahlen
+- Block-Auswahl: 6 wichtigste Aspekte für Erstübersicht
+
+VISUELLE ELEMENTE PFLICHT
+- Mindestens 1 Code-Block
+- Mindestens 1 Kachel-Grid mit Icons (Ökosystem)
+- Mindestens 1 Plus/Minus-Split (Modern vs Legacy o.ä.)
+- Footer als farbige Box (visueller Anker)
+- Stats-Bar im Hero
+
+VERMEIDEN
+- Reine Bullet-Listen in jedem Block
+- Mehr als 6 Hauptblöcke (Querformat hat eh schon mehr Platz)
+- Mehr als 3 Schriftgrößen
+- Marketing-Floskeln in Hero
+- Floats oder absolute positioning (außer für Footer)
+- Vertikal sehr lange Blöcke (würden Spalten unbalanciert machen)
+
+GENERIERUNG MIT FEEDBACK-LOOP (max 3 Iterationen)
+1. HTML schreiben
+2. weasyprint file.html file.pdf
+3. PDF zu PNG: python -c "from pdf2image import convert_from_path; convert_from_path('file.pdf', dpi=120)[0].save('preview.png')"
+4. Preview ansehen mit Read-Tool
+5. Prüfen:
+   - Stats-Bar überlappt nicht mit Titel?
+   - 3 Spalten balanciert (ähnliche Höhe)?
+   - Footer nicht abgeschnitten?
+   - Code-Block lesbar?
+   - Alle Icons rendern?
+6. Bei Problemen: fixen, ab Schritt 2 wiederholen
+7. Nach max 3 Iterationen ausgeben
+
+INSTALLATION
+- pip install weasyprint pdf2image
+- apt install poppler-utils
+```