Add browser-based web MVP with mobile upload flow

2026-03-02 20:17:44 +01:00
parent e7c62c2628
commit b14cc39455
8 changed files with 352 additions and 0 deletions
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -0,0 +1,120 @@
+<!doctype html>
+<html lang="de">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>PDF zu ICS (Web)</title>
+  <style>
+    :root { color-scheme: light; }
+    body {
+      margin: 0;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
+      background: #f5f7fb;
+      color: #1f2937;
+    }
+    .wrap {
+      max-width: 520px;
+      margin: 0 auto;
+      padding: 20px 14px 28px;
+    }
+    .card {
+      background: #ffffff;
+      border-radius: 14px;
+      padding: 18px;
+      box-shadow: 0 1px 4px rgba(0,0,0,0.08);
+    }
+    h1 {
+      margin: 0 0 10px;
+      font-size: 1.3rem;
+    }
+    p {
+      margin: 0 0 16px;
+      color: #4b5563;
+      line-height: 1.4;
+    }
+    label {
+      display: block;
+      font-weight: 600;
+      margin: 12px 0 8px;
+    }
+    input[type=file] {
+      width: 100%;
+      padding: 10px;
+      border: 1px solid #d1d5db;
+      border-radius: 10px;
+      background: #fff;
+      box-sizing: border-box;
+    }
+    .options {
+      margin: 12px 0;
+      display: grid;
+      gap: 8px;
+    }
+    .option {
+      display: flex;
+      gap: 10px;
+      align-items: center;
+      font-weight: 500;
+      color: #111827;
+    }
+    button {
+      width: 100%;
+      border: 0;
+      border-radius: 10px;
+      padding: 12px;
+      font-size: 1rem;
+      font-weight: 700;
+      background: #2563eb;
+      color: #fff;
+      margin-top: 6px;
+      cursor: pointer;
+    }
+    button:active { transform: translateY(1px); }
+    .error {
+      margin: 0 0 12px;
+      padding: 10px;
+      border-radius: 10px;
+      background: #fef2f2;
+      color: #991b1b;
+      border: 1px solid #fecaca;
+    }
+    .hint {
+      margin-top: 12px;
+      font-size: 0.9rem;
+      color: #6b7280;
+    }
+  </style>
+</head>
+<body>
+  <main class="wrap">
+    <section class="card">
+      <h1>PDF zu ICS Konverter</h1>
+      <p>PDF hochladen, konvertieren und die ICS-Datei direkt herunterladen.</p>
+
+      {% if error %}
+      <div class="error">{{ error }}</div>
+      {% endif %}
+
+      <form action="/convert" method="post" enctype="multipart/form-data">
+        <label for="file">Dienstplan-PDF</label>
+        <input id="file" name="file" type="file" accept="application/pdf,.pdf" required />
+
+        <div class="options">
+          <label class="option">
+            <input type="checkbox" name="exclude_rest" value="true" />
+            Ruhetage ausschließen
+          </label>
+          <label class="option">
+            <input type="checkbox" name="exclude_vacation" value="true" />
+            Urlaub ausschließen
+          </label>
+        </div>
+
+        <button type="submit">ICS erstellen</button>
+      </form>
+
+      <div class="hint">Hinweis: Die Datei wird nur temporär für die Konvertierung verarbeitet.</div>
+    </section>
+  </main>
+</body>
+</html>