Fix mobile layout: Verbesserte Lösung für Sprachauswahl-Überlappung mit mehr Abstand

app.py

@@ -20,7 +20,7 @@ app.config['BABEL_TRANSLATION_DIRECTORIES'] = 'translations'
 babel = Babel()
 
 # Version der App
-APP_VERSION = "1.4.2"
+APP_VERSION = "1.4.5"
 
 # HTML-Template wird jetzt aus templates/index.html geladen
 

templates/index.html

@@ -473,6 +473,9 @@ button:focus, .accordion-header:focus {
         max-width: none;
         overflow: hidden;
     }
+    .header-section {
+        margin-top: 4.5em; /* Mehr Abstand für Sprachauswahl und Hilfe-Button */
+    }
     h1 {
         font-size: 1.3em;
     }
@@ -618,7 +621,11 @@ footer br + a {
         function changeLanguage(language) {
             // Speichere Sprache in localStorage (datenschutzfreundlich)
             localStorage.setItem('preferred_language', language);
-            window.location.href = '/set_language/' + language;
+            
+            // Erstelle neue URL mit korrektem lang-Parameter
+            const currentUrl = new URL(window.location.href);
+            currentUrl.searchParams.set('lang', language);
+            window.location.href = currentUrl.toString();
         }
         function openAccordion(idx) {
             const headers = document.querySelectorAll('.accordion-header');
@@ -792,7 +799,7 @@ footer br + a {
                 <option value="en" {% if get_locale() == 'en' %}selected{% endif %}>{{ _('English') }}</option>
             </select>
         </div>
-        <div style="text-align:center; margin-bottom:1.2em;">
+        <div class="header-section" style="text-align:center; margin-bottom:1.2em;">
             <div style="font-size:1.1em; font-style:italic; color:#475569;">{{ _('Elpatrons') }}</div>
             <h1 style="margin:0;">{{ _('Datumsrechner') }}</h1>
             <div style="font-size:0.9em; color:#1e293b; margin-top:0.3em;">
@@ -848,7 +855,7 @@ footer br + a {
                                 </select>
                             </label>
                         </fieldset>
-                        <button name="action" value="tage_werktage" type="submit">Berechnen</button>
+                        <button name="action" value="tage_werktage" type="submit">{{ _('Berechnen') }}</button>
                     </form>
                     {% if tage is not none %}
                         <div class="result" aria-live="polite">