Add iPD export images to landing page

This commit is contained in:
2026-03-03 09:14:55 +01:00
parent 144d13989d
commit 2b9476290f
7 changed files with 56 additions and 0 deletions

View File

@@ -13,6 +13,7 @@ import secrets
from fastapi import Depends, FastAPI, File, Form, HTTPException, Request, UploadFile, status from fastapi import Depends, FastAPI, File, Form, HTTPException, Request, UploadFile, status
from fastapi.responses import FileResponse, HTMLResponse, JSONResponse from fastapi.responses import FileResponse, HTMLResponse, JSONResponse
from fastapi.security import HTTPBasic, HTTPBasicCredentials from fastapi.security import HTTPBasic, HTTPBasicCredentials
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates from fastapi.templating import Jinja2Templates
from starlette.background import BackgroundTask from starlette.background import BackgroundTask
@@ -24,6 +25,7 @@ from pdf_to_ics import create_ics_from_dienstplan, extract_dienstplan_data
app = FastAPI(title="PDF zu ICS Web") app = FastAPI(title="PDF zu ICS Web")
templates = Jinja2Templates(directory=str(Path(__file__).parent / "templates")) templates = Jinja2Templates(directory=str(Path(__file__).parent / "templates"))
app.mount("/static", StaticFiles(directory=str(Path(__file__).parent / "static")), name="static")
security = HTTPBasic() security = HTTPBasic()

View File

BIN
web/static/images/iPD01.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

BIN
web/static/images/iPD02.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

BIN
web/static/images/iPD03.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

View File

@@ -56,6 +56,36 @@
color: #6b7280; color: #6b7280;
margin-top: 8px; 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> </style>
</head> </head>
<body> <body>
@@ -84,6 +114,30 @@
<li>ICS herunterladen und im Kalender importieren</li> <li>ICS herunterladen und im Kalender importieren</li>
</ul> </ul>
</section> </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> </main>
</body> </body>
</html> </html>