kobold-ai/cookbook
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Restore rich card backgrounds and 14mm top breathing margin for print engine v4.5.4

Browse Source
This commit is contained in:
kobold-ai
2026-10-14 21:45:55 +02:00
parent aa78de0cbc
commit 2b8c4a35cf
1 changed files with 45 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/cookbook.html
+45 -38
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mein Kochbuch – What To Cook?</title>
<link rel="stylesheet" href="/static/cookbook.css?v=4.5.3">
<link rel="stylesheet" href="/static/cookbook.css?v=4.5.4">
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📖</text></svg>">
<style id="print-engine-styles">
/* Auf dem Bildschirm: Cover, Inhaltsverzeichnis und Seitenzahlen ausblenden */
@@ -18,7 +18,7 @@
/* ==========================================================================
A4 Buchdruck-Engine: Universell für Apple iOS (AirPrint), Android Chrome & Desktop
Jede Seite ist exakt 1 Blatt A4 (286mm). Kein Rahmen, Seitenzahl fest in der Ecke.
Jede Seite ist exakt 1 Blatt A4 (282mm). Schöne Ränder, echte Hintergründe.
========================================================================== */
@page {
size: A4 portrait;
@@ -31,8 +31,6 @@
print-color-adjust: exact !important;
color-adjust: exact !important;
box-sizing: border-box !important;
box-shadow: none !important;
text-shadow: none !important;
}
html, body.cookbook-body {
@@ -41,8 +39,8 @@
margin: 0 !important;
padding: 0 !important;
overflow: visible !important;
background: var(--creme) !important;
background-color: #FAF7F2 !important;
background: #FAF6F0 !important;
background-color: #FAF6F0 !important;
color: var(--schwarz) !important;
display: block !important;
}
@@ -77,21 +75,21 @@
overflow: visible !important;
}
/* Jede Seite ist ein eigenständiges DIN A4 Blatt mit fester 286mm Höhe */
/* Jede Seite ist ein eigenständiges DIN A4 Blatt mit 14mm Kopfabstand und 282mm Höhe */
.page {
display: block !important;
position: relative !important;
width: 210mm !important;
max-width: 210mm !important;
min-width: 210mm !important;
height: 286mm !important;
min-height: 286mm !important;
max-height: 286mm !important;
height: 282mm !important;
min-height: 282mm !important;
max-height: 282mm !important;
margin: 0 auto !important;
padding: 8mm 12mm 18mm 12mm !important;
padding: 14mm 14mm 16mm 14mm !important;
box-sizing: border-box !important;
background: var(--creme) !important;
background-color: #FAF7F2 !important;
background: #FAF6F0 !important;
background-color: #FAF6F0 !important;
box-shadow: none !important;
border: none !important;
outline: none !important;
@@ -116,7 +114,7 @@
/* 1. COVER */
.page.cover {
display: block !important;
padding-top: 55mm !important;
padding: 50mm 14mm 16mm 14mm !important;
text-align: center !important;
page-break-after: always !important;
break-after: page !important;
@@ -155,7 +153,7 @@
/* 2. INHALTSVERZEICHNIS (TOC) */
.page.toc-page {
display: block !important;
padding-top: 2mm !important;
padding: 14mm 14mm 16mm 14mm !important;
page-break-after: always !important;
break-after: page !important;
page-break-inside: avoid !important;
@@ -189,7 +187,7 @@
.divider {
display: block !important;
text-align: center !important;
padding-top: 35mm !important;
padding: 38mm 14mm 16mm 14mm !important;
page-break-after: always !important;
break-after: page !important;
page-break-inside: avoid !important;
@@ -234,7 +232,7 @@
/* 4. REZEPTSEITE */
.recipe-page {
display: block !important;
padding-top: 1mm !important;
padding: 14mm 14mm 16mm 14mm !important;
page-break-after: always !important;
break-after: page !important;
page-break-inside: avoid !important;
@@ -304,9 +302,11 @@
}
.ingredients-box {
padding: 2px 4px !important;
background: transparent !important;
border: none !important;
padding: 5px 8px !important;
background: rgba(255, 255, 255, 0.75) !important;
background-color: rgba(255, 255, 255, 0.75) !important;
border: 1.5px dashed rgba(30, 77, 59, 0.4) !important;
border-radius: 8px !important;
}
.section-hand-title {
@@ -359,22 +359,26 @@
}
.step-card {
padding: 2.5px 5px !important;
margin-bottom: 2px !important;
padding: 3px 6px !important;
margin-bottom: 2.5px !important;
font-size: 0.80rem !important;
line-height: 1.22 !important;
display: flex !important;
gap: 6px !important;
align-items: flex-start !important;
background: rgba(255, 255, 255, 0.6) !important;
background-color: rgba(255, 255, 255, 0.6) !important;
border-radius: 6px !important;
}
.step-badge {
width: 16px !important;
height: 16px !important;
width: 17px !important;
height: 17px !important;
font-size: 0.72rem !important;
flex-shrink: 0 !important;
background: var(--tannengruen) !important;
color: var(--creme) !important;
background: #1E4D3B !important;
background-color: #1E4D3B !important;
color: #FAF6F0 !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
@@ -386,12 +390,13 @@
}
.notes-box {
margin-top: 2mm !important;
padding: 3px 6px !important;
margin-top: 2.5mm !important;
padding: 4px 8px !important;
font-size: 0.76rem !important;
line-height: 1.2 !important;
background: #FFFDF0 !important;
border: 1px dashed #D4C165 !important;
background: #FFF9D2 !important;
background-color: #FFF9D2 !important;
border: 1.5px dashed #D4C165 !important;
border-radius: 6px !important;
}
@@ -403,10 +408,12 @@
.notes-box-empty {
display: block !important;
padding: 3px 6px !important;
margin-top: 2mm !important;
background: #FFFDF0 !important;
border: 1px dashed #D4C165 !important;
padding: 4px 8px !important;
margin-top: 2.5mm !important;
background: #FFF9D2 !important;
background-color: #FFF9D2 !important;
border: 1.5px dashed #D4C165 !important;
border-radius: 6px !important;
}
.notes-blank-lines {
@@ -429,9 +436,9 @@
/* 5. SEITENZAHL FEST IN DEN ECKEN DES BLATTES VERANKERT */
.page-footer {
position: absolute !important;
bottom: 7mm !important;
left: 12mm !important;
right: 12mm !important;
bottom: 6mm !important;
left: 14mm !important;
right: 14mm !important;
width: auto !important;
display: block !important;
border: none !important;
@@ -453,7 +460,7 @@
font-family: var(--font-hand), 'Caveat', cursive !important;
font-size: 1.25rem !important;
font-weight: 700 !important;
color: var(--tannengruen) !important;
color: #1E4D3B !important;
display: inline-block !important;
}