WebApp

2025-10-05 10:53:22 +02:00 · 2025-10-05 10:53:22 +02:00 · 844967f578
commit 844967f578
parent c9b4ee7af6
4 changed files with 501 additions and 7 deletions
--- a/6aus49APP/templates/index.html
+++ b/6aus49APP/templates/index.html
@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+  <meta charset="utf-8" />
+  <title>Lotto-Ziehungen</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <script src="https://unpkg.com/htmx.org@1.9.12"></script>
+  <link rel="icon" href="/static/favicon.ico">
+  <style>
+    body {
+      font-family: "Segoe UI", Arial, sans-serif;
+      background: #f6f6f6;
+      color: #222;
+      margin: 0;
+      padding: 2rem;
+    }
+    main {
+      max-width: 960px;
+      margin: 0 auto;
+      background: #fff;
+      border: 1px solid #ddd;
+      border-radius: 8px;
+      box-shadow: 0 2px 5px rgba(0,0,0,0.05);
+      padding: 2rem 2.5rem;
+    }
+    h1 {
+      margin-top: 0;
+      font-size: 1.9rem;
+      font-weight: 600;
+      text-align: center;
+      letter-spacing: 0.02em;
+    }
+    p.service-note {
+      text-align: center;
+      margin-top: 0.3rem;
+      margin-bottom: 1.8rem;
+      font-size: 0.95rem;
+      color: #666;
+      font-style: italic;
+    }
+    form {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      justify-content: center;
+      gap: 0.6rem;
+      margin-bottom: 1rem;
+    }
+    label { font-weight: 500; }
+    input, select, button {
+      padding: 0.35rem 0.6rem;
+      border: 1px solid #bbb;
+      border-radius: 4px;
+      background: #fff;
+      font-size: 0.95rem;
+    }
+    button {
+      background: #0a6;
+      color: #fff;
+      border: none;
+      font-weight: 600;
+      cursor: pointer;
+      transition: background 0.2s;
+    }
+    button:hover { background: #098557; }
+
+    table {
+      width: 100%;
+      border-collapse: collapse;
+      margin-top: 0.5rem;
+      font-size: 0.95rem;
+    }
+    th, td {
+      border: 1px solid #ddd;
+      padding: 0.45rem 0.5rem;
+      text-align: center;
+    }
+    th {
+      background: #efefef;
+      font-weight: 600;
+    }
+    .numbers { text-align: left; }
+    .badge {
+      display: inline-block;
+      background: #0a6;
+      color: white;
+      padding: 0.25em 0.5em;
+      border-radius: 0.4em;
+      margin: 0 0.1em;
+      font-weight: 600;
+    }
+    .muted {
+      color: #555;
+      font-size: 0.9rem;
+      margin-top: 0.5rem;
+      text-align: right;
+    }
+  </style>
+</head>
+<body>
+  <main>
+    <h1>Lotto-Ziehungen</h1>
+    <p class="service-note">Ein Service der Hintergasse – Angaben ohne Gewähr!</p>
+
+    <form hx-get="/ui/draws" hx-target="#results" hx-trigger="change, submit" hx-swap="innerHTML">
+      <label for="game">Spiel:</label>
+      <select name="game" id="game">
+        <option value="6aus49">6 aus 49</option>
+        <option value="euro">Eurojackpot</option>
+      </select>
+
+      <label for="date_from">von:</label>
+      <input type="date" name="date_from" />
+
+      <label for="date_to">bis:</label>
+      <input type="date" name="date_to" />
+
+      <label for="order">Sortierung:</label>
+      <select name="order">
+        <option value="desc" selected>neueste zuerst</option>
+        <option value="asc">älteste zuerst</option>
+      </select>
+
+      <label for="limit">Limit:</label>
+      <input type="number" name="limit" value="{{ page_size }}" min="1" max="500" />
+
+      <button type="submit">Anzeigen</button>
+    </form>
+
+    <div id="results" hx-get="/ui/draws" hx-trigger="load" hx-target="#results" hx-swap="innerHTML"></div>
+  </main>
+</body>
+</html>