From e4890bf2f27d0198ee1ab232f9a80e0c6a9d142f Mon Sep 17 00:00:00 2001
From: elpatron <m.busche@gmail.com>
Date: Tue, 19 Aug 2025 21:42:09 +0200
Subject: [PATCH] =?UTF-8?q?Verbessere=20Eingabefelder:=20Gr=C3=B6=C3=9Fere?=
 =?UTF-8?q?=20Schrift,=20Monospace-Font=20und=20automatische=20Gro=C3=9Fbu?=
 =?UTF-8?q?chstaben-Transformation?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/index.html | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/templates/index.html b/templates/index.html
index 414173e..273e014 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -38,7 +38,8 @@
         .page-header h1 { margin: 0; }
         @media (max-width: 480px) { .page-header h1 { font-size: 1.5rem; } }
         .grid { display: grid; grid-template-columns: repeat(5, 3rem); gap: .5rem; }
-        .grid input { text-align: center; font-size: 1.25rem; padding: .4rem; background: var(--input-bg); color: var(--input-text); border: 1px solid var(--border); border-radius: .375rem; }
+        .grid input { text-align: center; font-size: 1.25rem; padding: .4rem; background: var(--input-bg); color: var(--input-text); border: 1px solid var(--border); border-radius: .375rem; font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', 'Monaco', 'Courier New', monospace; text-transform: uppercase; }
+        .text-input { font-size: 1.1rem; padding: .5rem; background: var(--input-bg); color: var(--input-text); border: 1px solid var(--border); border-radius: .375rem; width: 100%; box-sizing: border-box; font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', 'Monaco', 'Courier New', monospace; text-transform: uppercase; }
         label { font-weight: 600; display: block; margin-top: 1rem; margin-bottom: .25rem; }
         .results { margin-top: 1.5rem; }
         .results-box { border: 1px solid var(--border); border-radius: .5rem; padding: .75rem; }
@@ -90,11 +91,11 @@
                 </fieldset>
 
                 <label for="includes">Weitere enthaltene Buchstaben (beliebige Reihenfolge)</label>
-                <input id="includes" name="includes" aria-describedby="includes-hint" inputmode="text" autocomplete="off" value="{{ includes }}" />
+                <input id="includes" name="includes" class="text-input" aria-describedby="includes-hint" inputmode="text" autocomplete="off" value="{{ includes }}" />
                 <p id="includes-hint" class="hint">Mehrere Buchstaben ohne Trennzeichen eingeben (z. B. „aei“).</p>
 
                 <label for="excludes">Ausgeschlossene Buchstaben</label>
-                <input id="excludes" name="excludes" aria-describedby="excludes-hint" inputmode="text" autocomplete="off" value="{{ excludes }}" />
+                <input id="excludes" name="excludes" class="text-input" aria-describedby="excludes-hint" inputmode="text" autocomplete="off" value="{{ excludes }}" />
                 <p id="excludes-hint" class="hint">Buchstaben, die nicht vorkommen (z. B. „rst“).</p>
 
                 <button type="submit">Suchen</button>