Feature: QR-Codes mit checkflo-Logo in der Mitte

app/src/routes/admin/stations/+page.svelte

@@ -29,12 +29,10 @@
 			});
 			stations = result;
 
-			// QR-Codes generieren
+				// QR-Codes mit Logo generieren
 			const codes: Record<string, string> = {};
 			for (const s of result) {
-				codes[s.qr_id] = await QRCode.toDataURL(qrUrl(s.qr_id), {
+				codes[s.qr_id] = await generateQRWithLogo(qrUrl(s.qr_id));
-					width: 200, margin: 1, color: { dark: '#0B1023', light: '#ffffff' }
-				});
 			}
 			qrCodes = codes;
 		} catch {
@@ -47,6 +45,41 @@
 		return `https://checkflo.de/s/${qrId}`;
 	}
 
+	async function generateQRWithLogo(url: string): Promise<string> {
+		const size = 400;
+		const canvas = document.createElement('canvas');
+		canvas.width = size;
+		canvas.height = size;
+
+		await QRCode.toCanvas(canvas, url, {
+			width: size,
+			margin: 1,
+			errorCorrectionLevel: 'H',
+			color: { dark: '#0B1023', light: '#ffffff' }
+		});
+
+		const ctx = canvas.getContext('2d')!;
+		const logoSize = Math.round(size * 0.22);
+		const x = (size - logoSize) / 2;
+		const y = (size - logoSize) / 2;
+		const pad = 6;
+		const r = 10;
+
+		// Weißer abgerundeter Hintergrund
+		ctx.fillStyle = '#ffffff';
+		ctx.beginPath();
+		ctx.roundRect(x - pad, y - pad, logoSize + pad * 2, logoSize + pad * 2, r);
+		ctx.fill();
+
+		// Logo laden und zeichnen
+		const img = new Image();
+		img.src = '/favicon.svg';
+		await new Promise<void>(resolve => { img.onload = () => resolve(); });
+		ctx.drawImage(img, x, y, logoSize, logoSize);
+
+		return canvas.toDataURL('image/png');
+	}
+
 	function printAll() {
 		window.print();
 	}