webfarben/pdf_to_ics
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

Add iPD export images to landing page

Browse Source
This commit is contained in:
webfarben
2026-03-03 09:14:55 +01:00
parent 144d13989d
commit 2b9476290f
7 changed files with 56 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
web/templates/landing.html
View File

@@ -56,6 +56,36 @@
color: #6b7280;
margin-top: 8px;
}
.server-note {
font-size: 0.88rem;
color: #6b7280;
margin: 10px 2px 0;
}
.image-guide {
margin-top: 18px;
}
.image-grid {
display: grid;
grid-template-columns: 1fr;
gap: 12px;
}
.image-item {
background: #fff;
border-radius: 14px;
padding: 10px;
box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.image-item img {
display: block;
width: 100%;
border-radius: 10px;
height: auto;
}
.image-caption {
margin: 8px 2px 2px;
font-size: 0.92rem;
color: #4b5563;
}
</style>
</head>
<body>
@@ -84,6 +114,30 @@
<li>ICS herunterladen und im Kalender importieren</li>
</ul>
</section>
<section class="image-guide" aria-label="PDF-Export in iPD">
<h2>PDF-Export in iPD</h2>
<p>Die folgenden Bilder zeigen, wie der Dienstplan in iPD als PDF exportiert wird.</p>
<p class="server-note">Hinweis: Die Bilder werden nur angezeigt, wenn die Seite über den laufenden Webserver geöffnet wird (z. B. http://127.0.0.1:8000/) und nicht als lokale Datei in der Editor-Vorschau.</p>
<div class="image-grid">
<figure class="image-item">
<img src="{{ request.url_for('static', path='images/iPD01.jpg') }}" alt="iPD Schritt 1: Dienstplanansicht öffnen" loading="lazy">
<figcaption class="image-caption">Schritt 1: Dienstplanansicht in iPD öffnen.</figcaption>
</figure>
<figure class="image-item">
<img src="{{ request.url_for('static', path='images/iPD02.jpg') }}" alt="iPD Schritt 2: Export- oder Druckmenü auswählen" loading="lazy">
<figcaption class="image-caption">Schritt 2: Export- oder Druckfunktion auswählen.</figcaption>
</figure>
<figure class="image-item">
<img src="{{ request.url_for('static', path='images/iPD03.jpg') }}" alt="iPD Schritt 3: PDF-Export starten" loading="lazy">
<figcaption class="image-caption">Schritt 3: PDF-Export starten.</figcaption>
</figure>
<figure class="image-item">
<img src="{{ request.url_for('static', path='images/iPD03_1.jpg') }}" alt="iPD Schritt 4: PDF speichern" loading="lazy">
<figcaption class="image-caption">Schritt 4: PDF speichern und anschließend hier hochladen.</figcaption>
</figure>
</div>
</section>
</main>
</body>
</html>