Bump version to 1.4.10

- Schließen-Button ist jetzt 'floating' mit position: fixed
- Button hat Hintergrund, Rahmen und Schatten für bessere Sichtbarkeit
- Alle Texte im Help Modal verwenden jetzt Übersetzungsfunktionen
- Vollständige mehrsprachige Unterstützung (Deutsch/Englisch)
- Bessere mobile Darstellung ohne Überschneidungen

README.md

@@ -1,6 +1,10 @@
 # Elpatrons Datumsrechner
 
 [![Test Coverage](https://img.shields.io/badge/test%20coverage-90%25-brightgreen)](https://github.com/elpatron/datecalc)
+[![Lighthouse Performance](https://img.shields.io/badge/lighthouse%20performance-100%25-brightgreen)](https://date.elpatron.me)
+[![Lighthouse Accessibility](https://img.shields.io/badge/lighthouse%20accessibility-100%25-brightgreen)](https://date.elpatron.me)
+[![Lighthouse Best Practices](https://img.shields.io/badge/lighthouse%20best%20practices-100%25-brightgreen)](https://date.elpatron.me)
+[![Lighthouse SEO](https://img.shields.io/badge/lighthouse%20seo-100%25-brightgreen)](https://date.elpatron.me)
 
 Diese moderne Python-Webanwendung (Flask) ermöglicht verschiedene Datumsberechnungen über eine übersichtliche, barrierefreie Weboberfläche.
 
@@ -40,7 +44,11 @@ Datumsrechner Live: [https://date.elpatron.me](https://date.elpatron.me)
 
 ![App Screenshot](./assets/image-20250725095959116.png)
 
-**Lighthouse-Performance-Score:** [Lighthouse-Ergebnis anzeigen](./lighthouse-score.pdf) - Die Webanwendung erreicht hervorragende Performance-Werte in allen Kategorien (Performance, Accessibility, Best Practices, SEO).
+**[Lighthouse](https://en.wikipedia.org/wiki/Lighthouse_(software))-Performance-Score:** 
+
+Die Webanwendung erreicht hervorragende Performance-Werte in allen Kategorien (Performance, Accessibility, Best Practices, SEO).
+
+[Lighthouse-Ergebnis (PDF)](./lighthouse/lighthouse-score.pdf)
 
 ## Funktionen
 
@@ -52,6 +60,7 @@ Datumsrechner Live: [https://date.elpatron.me](https://date.elpatron.me)
 - Datum plus/minus X Wochen/Monate
 - Kalenderwoche zu Datum
 - Start-/Enddatum einer Kalenderwoche eines Jahres
+- Mehrsprachige Unterstützung (Deutsch/Englisch) mit automatischer Browser-Spracherkennung
 - Sprachausgabe für alle Ergebnisse (barrierefrei)
 - Statistik-Dashboard mit Passwortschutz unter `/stats`
 
@@ -79,6 +88,34 @@ Die Werktagsberechnung kann optional bundeslandspezifische Feiertage berücksich
 
 Die Feiertage werden automatisch für den gewählten Zeitraum abgerufen und bei der Werktagsberechnung als arbeitsfreie Tage behandelt. Im Ergebnis werden zusätzlich die Anzahl der Wochenendtage und Feiertage angezeigt.
 
+## Mehrsprachige Unterstützung (i18n)
+
+Die Anwendung unterstützt Deutsch und Englisch mit folgenden Features:
+
+### Automatische Spracherkennung:
+- *Browser-Sprache*: Automatische Erkennung der Browser-Einstellung
+- *URL-Parameter*: Sprachauswahl über `?lang=de` oder `?lang=en`
+- *localStorage*: Persistente Sprachauswahl im Browser
+- *Fallback*: Deutsch als Standardsprache
+
+### *Datenschutzfreundliche Implementierung:*
+- *Keine Cookies*: Sprachauswahl ohne Cookies
+- *URL-Parameter*: Transparente Sprachauswahl in der URL
+- *localStorage*: Lokale Speicherung im Browser
+- *Teilbare URLs*: URLs mit Sprachauswahl können geteilt werden
+
+### *Barrierefreiheit:*
+- *Screenreader*: Vollständige Unterstützung
+- *Tastatur-Navigation*: Vollständig bedienbar
+- *ARIA-Attribute*: Korrekte Beschriftungen
+- *Semantische HTML*: Korrekte Struktur
+
+### *Technische Details:*
+- *Flask-Babel*: Professionelle i18n-Implementierung
+- *Gettext*: Standard für Übersetzungen
+- *Responsive Design*: Angepasst für alle Geräte
+- *SEO-freundlich*: URLs sind indexierbar
+
 ## Installation (lokal)
 
 1. Python 3.8+ installieren
@@ -297,6 +334,7 @@ curl -X POST http://localhost:5000/api/plusminus \
 ```
 
 **Hinweis:**  
+
 - `"einheit"`: `"tage"`, `"wochen"` oder `"monate"`
 - `"richtung"`: `"add"` (plus) oder `"sub"` (minus)
 - `"werktage"`: `true` für Werktage, sonst `false` (nur bei `"tage"` unterstützt)
@@ -435,22 +473,23 @@ Damit ist die App für Menschen mit unterschiedlichen Einschränkungen (z.B. Seh
 
 ### Code Statistik
 
-cloc|github.com/AlDanial/cloc v 2.06  T=0.16 s (137.5 files/s, 29033.4 lines/s)
+cloc|github.com/AlDanial/cloc v 2.06  T=0.17 s (146.7 files/s, 35235.5 lines/s)
 --- | ---
 
 Language|files|blank|comment|code
 :-------|-------:|-------:|-------:|-------:
-HTML|8|36|6|1998
-Python|2|53|57|614
+HTML|8|48|6|2092
+Python|2|59|68|690
 JavaScript|2|95|87|571
-Markdown|2|123|0|353
+Markdown|3|176|0|493
+PO File|2|234|240|492
 JSON|3|0|0|243
 CSS|1|186|3|188
 SVG|2|0|0|14
 Dockerfile|1|5|6|8
 DOS Batch|1|0|0|1
 --------|--------|--------|--------|--------
-SUM:|22|498|159|3990
+SUM:|25|803|410|4792
 
 ## Lizenz
 
@@ -458,3 +497,5 @@ Dieses Projekt steht unter der [MIT-Lizenz](LICENSE).
 
 ---
 (c) 2025 [Markus Busche](https://digitalcourage.social/@elpatron)
+
+**Version 1.4.0** - Mehrsprachige Unterstützung hinzugefügt

app.py

@@ -1,4 +1,5 @@
-from flask import Flask, render_template, request, redirect, url_for, session, abort, jsonify
+from flask import Flask, render_template, request, redirect, url_for, session, abort, jsonify, g
+from flask_babel import Babel, gettext, ngettext, get_locale
 from datetime import datetime, timedelta
 import numpy as np
 from dateutil.relativedelta import relativedelta
@@ -11,12 +12,40 @@ app_start_time = time.time()
 app = Flask(__name__)
 app.secret_key = os.environ.get('SECRET_KEY', 'dev-key')
 
+# Babel Konfiguration
+app.config['BABEL_DEFAULT_LOCALE'] = 'de'
+app.config['BABEL_SUPPORTED_LOCALES'] = ['de', 'en']
+app.config['BABEL_TRANSLATION_DIRECTORIES'] = 'translations'
+
+babel = Babel()
+
 # Version der App
-APP_VERSION = "1.3.13"
+APP_VERSION = "1.4.10"
 
 # HTML-Template wird jetzt aus templates/index.html geladen
 
 WOCHENTAGE = ["Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag", "Sonntag"]
+WOCHENTAGE_EN = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]
+
+def get_locale():
+    # Prüfe URL-Parameter für Sprachauswahl (datenschutzfreundlich)
+    if request.args.get('lang') in ['de', 'en']:
+        return request.args.get('lang')
+    # Prüfe Session für Sprachauswahl (Fallback für ältere Browser)
+    if 'language' in session:
+        return session['language']
+    # Fallback auf Browser-Sprache
+    return request.accept_languages.best_match(['de', 'en'], default='de')
+
+# Registriere die Locale-Funktion mit Babel
+babel.init_app(app, locale_selector=get_locale)
+
+def get_wochentage():
+    """Gibt die Wochentage in der aktuellen Sprache zurück"""
+    locale = get_locale()
+    if locale == 'en':
+        return WOCHENTAGE_EN
+    return WOCHENTAGE
 
 def get_feiertage(year, bundesland):
     """Holt die Feiertage für ein Jahr und Bundesland von feiertage-api.de."""
@@ -30,6 +59,24 @@ def get_feiertage(year, bundesland):
         print(f"Fehler beim Abrufen der Feiertage: {e}")
         return []
 
+@app.route('/set_language/<language>')
+def set_language(language):
+    """Setzt die Sprache über URL-Parameter (datenschutzfreundlich)"""
+    if language in ['de', 'en']:
+        # URL-Parameter verwenden statt Session
+        referrer = request.referrer or url_for('index')
+        if '?' in referrer:
+            # URL hat bereits Parameter
+            if 'lang=' in referrer:
+                # Ersetze bestehenden lang-Parameter
+                import re
+                referrer = re.sub(r'[?&]lang=[^&]*', '', referrer)
+            return redirect(f"{referrer}&lang={language}")
+        else:
+            # URL hat keine Parameter
+            return redirect(f"{referrer}?lang={language}")
+    return redirect(request.referrer or url_for('index'))
+
 @app.route('/', methods=['GET', 'POST'])
 def index():
     # Rudimentäres Logging für Page Impressions
@@ -94,24 +141,29 @@ def index():
                 else:
                     tage = abs((d2 - d1).days)
             except Exception:
-                tage = 'Ungültige Eingabe'
+                tage = gettext('Ungültige Eingabe')
         elif action == 'wochentag':
             active_idx = 1
             datum = request.form.get('datum3')
             try:
                 d = datetime.strptime(datum, '%Y-%m-%d')
-                wochentag = WOCHENTAGE[d.weekday()]
+                wochentage = get_wochentage()
+                wochentag = wochentage[d.weekday()]
             except Exception:
-                wochentag = 'Ungültige Eingabe'
+                wochentag = gettext('Ungültige Eingabe')
         elif action == 'kw_berechnen':
             active_idx = 2
             datum = request.form.get('datum6')
             try:
                 d = datetime.strptime(datum, '%Y-%m-%d')
                 kw = d.isocalendar().week
+                locale = get_locale()
+                if locale == 'en':
+                    kw_berechnen = f"Week {kw} ({d.year})"
+                else:
                     kw_berechnen = f"KW {kw} ({d.year})"
             except Exception:
-                kw_berechnen = 'Ungültige Eingabe'
+                kw_berechnen = gettext('Ungültige Eingabe')
         elif action == 'kw_datum':
             active_idx = 3
             jahr = request.form.get('jahr7')
@@ -122,9 +174,13 @@ def index():
                 # Montag der KW
                 start = datetime.fromisocalendar(jahr, kw, 1)
                 end = datetime.fromisocalendar(jahr, kw, 7)
+                locale = get_locale()
+                if locale == 'en':
+                    kw_datum = f"{start.strftime('%m/%d/%Y')} to {end.strftime('%m/%d/%Y')}"
+                else:
                     kw_datum = f"{start.strftime('%d.%m.%Y')} bis {end.strftime('%d.%m.%Y')}"
             except Exception:
-                kw_datum = 'Ungültige Eingabe'
+                kw_datum = gettext('Ungültige Eingabe')
         elif action == 'plusminus':
             active_idx = 4
             datum = request.form.get('datum_pm')
@@ -137,57 +193,107 @@ def index():
                 anzahl_int = int(anzahl)
                 if richtung == 'sub':
                     anzahl_int = -anzahl_int
+                locale = get_locale()
                 if einheit == 'tage':
                     if is_werktage:
                         # Werktage: numpy busday_offset
                         result = np.busday_offset(d.date(), anzahl_int, roll='forward')
                         result_dt = datetime.strptime(str(result), '%Y-%m-%d')
+                        if locale == 'en':
+                            plusminus_result = f"Date {d.strftime('%m/%d/%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} workdays: {result_dt.strftime('%m/%d/%Y')}"
+                        else:
                             plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Werktage: {result_dt.strftime('%d.%m.%Y')}"
                     else:
                         result = d + timedelta(days=anzahl_int)
+                        if locale == 'en':
+                            plusminus_result = f"Date {d.strftime('%m/%d/%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} days: {result.strftime('%m/%d/%Y')}"
+                        else:
                             plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Tage: {result.strftime('%d.%m.%Y')}"
                 elif einheit == 'wochen':
                     if is_werktage:
-                        plusminus_result = 'Nicht unterstützt: Werktage + Wochen.'
+                        plusminus_result = gettext('Nicht unterstützt: Werktage + Wochen.')
                     else:
                         result = d + timedelta(weeks=anzahl_int)
+                        if locale == 'en':
+                            plusminus_result = f"Date {d.strftime('%m/%d/%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} weeks: {result.strftime('%m/%d/%Y')}"
+                        else:
                             plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Wochen: {result.strftime('%d.%m.%Y')}"
                 elif einheit == 'monate':
                     if is_werktage:
-                        plusminus_result = 'Nicht unterstützt: Werktage + Monate.'
+                        plusminus_result = gettext('Nicht unterstützt: Werktage + Monate.')
                     else:
                         result = d + relativedelta(months=anzahl_int)
+                        if locale == 'en':
+                            plusminus_result = f"Date {d.strftime('%m/%d/%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} months: {result.strftime('%m/%d/%Y')}"
+                        else:
                             plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Monate: {result.strftime('%d.%m.%Y')}"
             except Exception:
-                plusminus_result = 'Ungültige Eingabe'
+                plusminus_result = gettext('Ungültige Eingabe')
     return render_template('index.html', tage=tage, werktage=werktage, wochentag=wochentag, plusminus_result=plusminus_result, kw_berechnen=kw_berechnen, kw_datum=kw_datum, active_idx=active_idx
-        , feiertage_anzahl=feiertage_anzahl, wochenendtage_anzahl=wochenendtage_anzahl, app_version=APP_VERSION
+        , feiertage_anzahl=feiertage_anzahl, wochenendtage_anzahl=wochenendtage_anzahl, app_version=APP_VERSION, get_locale=get_locale
     )
 
 
 def parse_log_stats(log_path):
     pageviews = 0
     func_counts = {}
+    func_counts_hourly = {}
     impressions_per_day = {}
+    impressions_per_hour = {}
     api_counts = {}
+    api_counts_hourly = {}
     if os.path.exists(log_path):
         with open(log_path, encoding='utf-8') as f:
             for line in f:
                 if 'PAGEVIEW' in line:
                     pageviews += 1
                     try:
-                        date = line[:10]
+                        # Parse timestamp (format: YYYY-MM-DDTHH:MM:SS)
+                        timestamp = line[:19]  # First 19 chars for YYYY-MM-DDTHH:MM:SS
+                        date = timestamp[:10]  # YYYY-MM-DD
+                        hour = timestamp[11:13]  # HH
+                        
                         if len(date) == 10 and date[4] == '-' and date[7] == '-':
                             impressions_per_day[date] = impressions_per_day.get(date, 0) + 1
+                            
+                        if len(hour) == 2 and hour.isdigit():
+                            hour_key = f"{date} {hour}:00"
+                            impressions_per_hour[hour_key] = impressions_per_hour.get(hour_key, 0) + 1
                     except Exception:
                         pass
                 elif 'FUNC:' in line:
                     func = line.split('FUNC:')[1].strip()
                     func_counts[func] = func_counts.get(func, 0) + 1
+                    
+                    # Stündliche Funktionsaufrufe
+                    try:
+                        timestamp = line[:19]
+                        date = timestamp[:10]
+                        hour = timestamp[11:13]
+                        if len(hour) == 2 and hour.isdigit():
+                            hour_key = f"{date} {hour}:00"
+                            if hour_key not in func_counts_hourly:
+                                func_counts_hourly[hour_key] = {}
+                            func_counts_hourly[hour_key][func] = func_counts_hourly[hour_key].get(func, 0) + 1
+                    except Exception:
+                        pass
                 elif 'FUNC_API:' in line:
                     api = line.split('FUNC_API:')[1].strip()
                     api_counts[api] = api_counts.get(api, 0) + 1
-    return pageviews, func_counts, impressions_per_day, api_counts
+                    
+                    # Stündliche API-Aufrufe
+                    try:
+                        timestamp = line[:19]
+                        date = timestamp[:10]
+                        hour = timestamp[11:13]
+                        if len(hour) == 2 and hour.isdigit():
+                            hour_key = f"{date} {hour}:00"
+                            if hour_key not in api_counts_hourly:
+                                api_counts_hourly[hour_key] = {}
+                            api_counts_hourly[hour_key][api] = api_counts_hourly[hour_key].get(api, 0) + 1
+                    except Exception:
+                        pass
+    return pageviews, func_counts, func_counts_hourly, impressions_per_day, impressions_per_hour, api_counts, api_counts_hourly
 
 @app.route('/stats', methods=['GET', 'POST'])
 def stats():
@@ -201,8 +307,8 @@ def stats():
                 return render_template('stats_login.html', error='Falsches Passwort!')
         return render_template('stats_login.html', error=None)
     log_path = os.path.join('log', 'pageviews.log')
-    pageviews, func_counts, impressions_per_day, api_counts = parse_log_stats(log_path)
-    return render_template('stats_dashboard.html', pageviews=pageviews, func_counts=func_counts, impressions_per_day=impressions_per_day, api_counts=api_counts)
+    pageviews, func_counts, func_counts_hourly, impressions_per_day, impressions_per_hour, api_counts, api_counts_hourly = parse_log_stats(log_path)
+    return render_template('stats_dashboard.html', pageviews=pageviews, func_counts=func_counts, func_counts_hourly=func_counts_hourly, impressions_per_day=impressions_per_day, impressions_per_hour=impressions_per_hour, api_counts=api_counts, api_counts_hourly=api_counts_hourly)
 
 # --- REST API ---
 def log_api_usage(api_name):
@@ -247,7 +353,8 @@ def api_wochentag():
     datum = data.get('datum')
     try:
         d = datetime.strptime(datum, '%Y-%m-%d')
-        wochentag = WOCHENTAGE[d.weekday()]
+        wochentage = get_wochentage()
+        wochentag = wochentage[d.weekday()]
         return jsonify({'result': wochentag})
     except Exception as e:
         return jsonify({'error': 'Ungültige Eingabe', 'details': str(e)}), 400
@@ -260,7 +367,12 @@ def api_kw_berechnen():
     try:
         d = datetime.strptime(datum, '%Y-%m-%d')
         kw = d.isocalendar().week
-        return jsonify({'result': f"KW {kw} ({d.year})", 'kw': kw, 'jahr': d.year})
+        locale = get_locale()
+        if locale == 'en':
+            kw_berechnen = f"Week {kw} ({d.year})"
+        else:
+            kw_berechnen = f"KW {kw} ({d.year})"
+        return jsonify({'result': kw_berechnen, 'kw': kw, 'jahr': d.year})
     except Exception as e:
         return jsonify({'error': 'Ungültige Eingabe', 'details': str(e)}), 400
 
@@ -275,7 +387,12 @@ def api_kw_datum():
         kw = int(kw)
         start = datetime.fromisocalendar(jahr, kw, 1)
         end = datetime.fromisocalendar(jahr, kw, 7)
-        return jsonify({'result': f"{start.strftime('%d.%m.%Y')} bis {end.strftime('%d.%m.%Y')}", 'start': start.strftime('%Y-%m-%d'), 'end': end.strftime('%Y-%m-%d')})
+        locale = get_locale()
+        if locale == 'en':
+            kw_datum = f"{start.strftime('%m/%d/%Y')} to {end.strftime('%m/%d/%Y')}"
+        else:
+            kw_datum = f"{start.strftime('%d.%m.%Y')} bis {end.strftime('%d.%m.%Y')}"
+        return jsonify({'result': kw_datum, 'start': start.strftime('%Y-%m-%d'), 'end': end.strftime('%Y-%m-%d')})
     except Exception as e:
         return jsonify({'error': 'Ungültige Eingabe', 'details': str(e)}), 400
 
@@ -293,6 +410,7 @@ def api_plusminus():
         anzahl_int = int(anzahl)
         if richtung == 'sub':
             anzahl_int = -anzahl_int
+        locale = get_locale()
         if einheit == 'tage':
             if is_werktage:
                 result = np.busday_offset(d.date(), anzahl_int, roll='forward')
@@ -321,8 +439,13 @@ def api_plusminus():
 @app.route('/api/stats', methods=['GET'])
 def api_stats():
     log_path = os.path.join('log', 'pageviews.log')
-    pageviews, func_counts, impressions_per_day, api_counts = parse_log_stats(log_path)
-    return render_template('stats_dashboard.html', pageviews=pageviews, func_counts=func_counts, impressions_per_day=impressions_per_day, api_counts=api_counts)
+    pageviews, func_counts, func_counts_hourly, impressions_per_day, impressions_per_hour, api_counts, api_counts_hourly = parse_log_stats(log_path)
+    return jsonify({
+        "pageviews": pageviews,
+        "func_counts": func_counts,
+        "impressions_per_day": impressions_per_day,
+        "api_counts": api_counts
+    })
 
 @app.route('/api/monitor', methods=['GET'])
 def api_monitor():

babel.cfg

@@ -0,0 +1,3 @@
+[python: **.py]
+[jinja2: **/templates/**.html]
+extensions=jinja2.ext.autoescape,jinja2.ext.with_ 

code-stats.cmd

@@ -1 +1 @@
-@cloc . .\templates\ .\static\ --exclude-dir=.venv,.git,log,__pycache__,.pytest_cache --exclude-ext=txt,bak --md
+@cloc . .\templates\ .\static\ --exclude-dir=.venv,.git,log,__pycache__,.pytest_cache,lighthouse --exclude-ext=txt,bak --md

h origin main --no-edit

@@ -1,324 +0,0 @@
-
-                   SSUUMMMMAARRYY OOFF LLEESSSS CCOOMMMMAANNDDSS
-
-      Commands marked with * may be preceded by a number, _N.
-      Notes in parentheses indicate the behavior if _N is given.
-      A key preceded by a caret indicates the Ctrl key; thus ^K is ctrl-K.
-
-  h  H                 Display this help.
-  q  :q  Q  :Q  ZZ     Exit.
- ---------------------------------------------------------------------------
-
-                           MMOOVVIINNGG
-
-  e  ^E  j  ^N  CR  *  Forward  one line   (or _N lines).
-  y  ^Y  k  ^K  ^P  *  Backward one line   (or _N lines).
-  ESC-j             *  Forward  one file line (or _N file lines).
-  ESC-k             *  Backward one file line (or _N file lines).
-  f  ^F  ^V  SPACE  *  Forward  one window (or _N lines).
-  b  ^B  ESC-v      *  Backward one window (or _N lines).
-  z                 *  Forward  one window (and set window to _N).
-  w                 *  Backward one window (and set window to _N).
-  ESC-SPACE         *  Forward  one window, but don't stop at end-of-file.
-  ESC-b             *  Backward one window, but don't stop at beginning-of-file.
-  d  ^D             *  Forward  one half-window (and set half-window to _N).
-  u  ^U             *  Backward one half-window (and set half-window to _N).
-  ESC-)  RightArrow *  Right one half screen width (or _N positions).
-  ESC-(  LeftArrow  *  Left  one half screen width (or _N positions).
-  ESC-}  ^RightArrow   Right to last column displayed.
-  ESC-{  ^LeftArrow    Left  to first column.
-  F                    Forward forever; like "tail -f".
-  ESC-F                Like F but stop when search pattern is found.
-  r  ^R  ^L            Repaint screen.
-  R                    Repaint screen, discarding buffered input.
-        ---------------------------------------------------
-        Default "window" is the screen height.
-        Default "half-window" is half of the screen height.
- ---------------------------------------------------------------------------
-
-                          SSEEAARRCCHHIINNGG
-
-  /_p_a_t_t_e_r_n          *  Search forward for (_N-th) matching line.
-  ?_p_a_t_t_e_r_n          *  Search backward for (_N-th) matching line.
-  n                 *  Repeat previous search (for _N-th occurrence).
-  N                 *  Repeat previous search in reverse direction.
-  ESC-n             *  Repeat previous search, spanning files.
-  ESC-N             *  Repeat previous search, reverse dir. & spanning files.
-  ^O^N  ^On         *  Search forward for (_N-th) OSC8 hyperlink.
-  ^O^P  ^Op         *  Search backward for (_N-th) OSC8 hyperlink.
-  ^O^L  ^Ol            Jump to the currently selected OSC8 hyperlink.
-  ESC-u                Undo (toggle) search highlighting.
-  ESC-U                Clear search highlighting.
-  &_p_a_t_t_e_r_n          *  Display only matching lines.
-        ---------------------------------------------------
-		Search is case-sensitive unless changed with -i or -I.
-        A search pattern may begin with one or more of:
-        ^N or !  Search for NON-matching lines.
-        ^E or *  Search multiple files (pass thru END OF FILE).
-        ^F or @  Start search at FIRST file (for /) or last file (for ?).
-        ^K       Highlight matches, but don't move (KEEP position).
-        ^R       Don't use REGULAR EXPRESSIONS.
-        ^S _n     Search for match in _n-th parenthesized subpattern.
-        ^W       WRAP search if no match found.
-        ^L       Enter next character literally into pattern.
- ---------------------------------------------------------------------------
-
-                           JJUUMMPPIINNGG
-
-  g  <  ESC-<       *  Go to first line in file (or line _N).
-  G  >  ESC->       *  Go to last line in file (or line _N).
-  p  %              *  Go to beginning of file (or _N percent into file).
-  t                 *  Go to the (_N-th) next tag.
-  T                 *  Go to the (_N-th) previous tag.
-  {  (  [           *  Find close bracket } ) ].
-  }  )  ]           *  Find open bracket { ( [.
-  ESC-^F _<_c_1_> _<_c_2_>  *  Find close bracket _<_c_2_>.
-  ESC-^B _<_c_1_> _<_c_2_>  *  Find open bracket _<_c_1_>.
-        ---------------------------------------------------
-        Each "find close bracket" command goes forward to the close bracket 
-          matching the (_N-th) open bracket in the top line.
-        Each "find open bracket" command goes backward to the open bracket 
-          matching the (_N-th) close bracket in the bottom line.
-
-  m_<_l_e_t_t_e_r_>            Mark the current top line with <letter>.
-  M_<_l_e_t_t_e_r_>            Mark the current bottom line with <letter>.
-  '_<_l_e_t_t_e_r_>            Go to a previously marked position.
-  ''                   Go to the previous position.
-  ^X^X                 Same as '.
-  ESC-m_<_l_e_t_t_e_r_>        Clear a mark.
-        ---------------------------------------------------
-        A mark is any upper-case or lower-case letter.
-        Certain marks are predefined:
-             ^  means  beginning of the file
-             $  means  end of the file
- ---------------------------------------------------------------------------
-
-                        CCHHAANNGGIINNGG FFIILLEESS
-
-  :e [_f_i_l_e]            Examine a new file.
-  ^X^V                 Same as :e.
-  :n                *  Examine the (_N-th) next file from the command line.
-  :p                *  Examine the (_N-th) previous file from the command line.
-  :x                *  Examine the first (or _N-th) file from the command line.
-  ^O^O                 Open the currently selected OSC8 hyperlink.
-  :d                   Delete the current file from the command line list.
-  =  ^G  :f            Print current file name.
- ---------------------------------------------------------------------------
-
-                    MMIISSCCEELLLLAANNEEOOUUSS CCOOMMMMAANNDDSS
-
-  -_<_f_l_a_g_>              Toggle a command line option [see OPTIONS below].
-  --_<_n_a_m_e_>             Toggle a command line option, by name.
-  __<_f_l_a_g_>              Display the setting of a command line option.
-  ___<_n_a_m_e_>             Display the setting of an option, by name.
-  +_c_m_d                 Execute the less cmd each time a new file is examined.
-
-  !_c_o_m_m_a_n_d             Execute the shell command with $SHELL.
-  #_c_o_m_m_a_n_d             Execute the shell command, expanded like a prompt.
-  |XX_c_o_m_m_a_n_d            Pipe file between current pos & mark XX to shell command.
-  s _f_i_l_e               Save input to a file.
-  v                    Edit the current file with $VISUAL or $EDITOR.
-  V                    Print version number of "less".
- ---------------------------------------------------------------------------
-
-                           OOPPTTIIOONNSS
-
-        Most options may be changed either on the command line,
-        or from within less by using the - or -- command.
-        Options may be given in one of two forms: either a single
-        character preceded by a -, or a name preceded by --.
-
-  -?  ........  --help
-                  Display help (from command line).
-  -a  ........  --search-skip-screen
-                  Search skips current screen.
-  -A  ........  --SEARCH-SKIP-SCREEN
-                  Search starts just after target line.
-  -b [_N]  ....  --buffers=[_N]
-                  Number of buffers.
-  -B  ........  --auto-buffers
-                  Don't automatically allocate buffers for pipes.
-  -c  ........  --clear-screen
-                  Repaint by clearing rather than scrolling.
-  -d  ........  --dumb
-                  Dumb terminal.
-  -D xx_c_o_l_o_r  .  --color=xx_c_o_l_o_r
-                  Set screen colors.
-  -e  -E  ....  --quit-at-eof  --QUIT-AT-EOF
-                  Quit at end of file.
-  -f  ........  --force
-                  Force open non-regular files.
-  -F  ........  --quit-if-one-screen
-                  Quit if entire file fits on first screen.
-  -g  ........  --hilite-search
-                  Highlight only last match for searches.
-  -G  ........  --HILITE-SEARCH
-                  Don't highlight any matches for searches.
-  -h [_N]  ....  --max-back-scroll=[_N]
-                  Backward scroll limit.
-  -i  ........  --ignore-case
-                  Ignore case in searches that do not contain uppercase.
-  -I  ........  --IGNORE-CASE
-                  Ignore case in all searches.
-  -j [_N]  ....  --jump-target=[_N]
-                  Screen position of target lines.
-  -J  ........  --status-column
-                  Display a status column at left edge of screen.
-  -k _f_i_l_e  ...  --lesskey-file=_f_i_l_e
-                  Use a compiled lesskey file.
-  -K  ........  --quit-on-intr
-                  Exit less in response to ctrl-C.
-  -L  ........  --no-lessopen
-                  Ignore the LESSOPEN environment variable.
-  -m  -M  ....  --long-prompt  --LONG-PROMPT
-                  Set prompt style.
-  -n .........  --line-numbers
-                  Suppress line numbers in prompts and messages.
-  -N .........  --LINE-NUMBERS
-                  Display line number at start of each line.
-  -o [_f_i_l_e] ..  --log-file=[_f_i_l_e]
-                  Copy to log file (standard input only).
-  -O [_f_i_l_e] ..  --LOG-FILE=[_f_i_l_e]
-                  Copy to log file (unconditionally overwrite).
-  -p _p_a_t_t_e_r_n .  --pattern=[_p_a_t_t_e_r_n]
-                  Start at pattern (from command line).
-  -P [_p_r_o_m_p_t]   --prompt=[_p_r_o_m_p_t]
-                  Define new prompt.
-  -q  -Q  ....  --quiet  --QUIET  --silent --SILENT
-                  Quiet the terminal bell.
-  -r  -R  ....  --raw-control-chars  --RAW-CONTROL-CHARS
-                  Output "raw" control characters.
-  -s  ........  --squeeze-blank-lines
-                  Squeeze multiple blank lines.
-  -S  ........  --chop-long-lines
-                  Chop (truncate) long lines rather than wrapping.
-  -t _t_a_g  ....  --tag=[_t_a_g]
-                  Find a tag.
-  -T [_t_a_g_s_f_i_l_e] --tag-file=[_t_a_g_s_f_i_l_e]
-                  Use an alternate tags file.
-  -u  -U  ....  --underline-special  --UNDERLINE-SPECIAL
-                  Change handling of backspaces, tabs and carriage returns.
-  -V  ........  --version
-                  Display the version number of "less".
-  -w  ........  --hilite-unread
-                  Highlight first new line after forward-screen.
-  -W  ........  --HILITE-UNREAD
-                  Highlight first new line after any forward movement.
-  -x [_N[,...]]  --tabs=[_N[,...]]
-                  Set tab stops.
-  -X  ........  --no-init
-                  Don't use termcap init/deinit strings.
-  -y [_N]  ....  --max-forw-scroll=[_N]
-                  Forward scroll limit.
-  -z [_N]  ....  --window=[_N]
-                  Set size of window.
-  -" [_c[_c]]  .  --quotes=[_c[_c]]
-                  Set shell quote characters.
-  -~  ........  --tilde
-                  Don't display tildes after end of file.
-  -# [_N]  ....  --shift=[_N]
-                  Set horizontal scroll amount (0 = one half screen width).
-
-                --exit-follow-on-close
-                  Exit F command on a pipe when writer closes pipe.
-                --file-size
-                  Automatically determine the size of the input file.
-                --follow-name
-                  The F command changes files if the input file is renamed.
-                --form-feed
-                  Stop scrolling when a form feed character is reached.
-                --header=[_L[,_C[,_N]]]
-                  Use _L lines (starting at line _N) and _C columns as headers.
-                --incsearch
-                  Search file as each pattern character is typed in.
-                --intr=[_C]
-                  Use _C instead of ^X to interrupt a read.
-                --lesskey-context=_t_e_x_t
-                  Use lesskey source file contents.
-                --lesskey-src=_f_i_l_e
-                  Use a lesskey source file.
-                --line-num-width=[_N]
-                  Set the width of the -N line number field to _N characters.
-                --match-shift=[_N]
-                  Show at least _N characters to the left of a search match.
-                --modelines=[_N]
-                  Read _N lines from the input file and look for vim modelines.
-                --mouse
-                  Enable mouse input.
-                --no-edit-warn
-                  Don't warn when using v command on a file opened via LESSOPEN.
-                --no-keypad
-                  Don't send termcap keypad init/deinit strings.
-                --no-histdups
-                  Remove duplicates from command history.
-                --no-number-headers
-                  Don't give line numbers to header lines.
-                --no-paste
-                  Ignore pasted input.
-                --no-search-header-lines
-                  Searches do not include header lines.
-                --no-search-header-columns
-                  Searches do not include header columns.
-                --no-search-headers
-                  Searches do not include header lines or columns.
-                --no-vbell
-                  Disable the terminal's visual bell.
-                --redraw-on-quit
-                  Redraw final screen when quitting.
-                --rscroll=[_C]
-                  Set the character used to mark truncated lines.
-                --save-marks
-                  Retain marks across invocations of less.
-                --search-options=[EFKNRW-]
-                  Set default options for every search.
-                --show-preproc-errors
-                  Display a message if preprocessor exits with an error status.
-                --proc-backspace
-                  Process backspaces for bold/underline.
-                --PROC-BACKSPACE
-                  Treat backspaces as control characters.
-                --proc-return
-                  Delete carriage returns before newline.
-                --PROC-RETURN
-                  Treat carriage returns as control characters.
-                --proc-tab
-                  Expand tabs to spaces.
-                --PROC-TAB
-                  Treat tabs as control characters.
-                --status-col-width=[_N]
-                  Set the width of the -J status column to _N characters.
-                --status-line
-                  Highlight or color the entire line containing a mark.
-                --use-backslash
-                  Subsequent options use backslash as escape char.
-                --use-color
-                  Enables colored text.
-                --wheel-lines=[_N]
-                  Each click of the mouse wheel moves _N lines.
-                --wordwrap
-                  Wrap lines at spaces.
-
-
- ---------------------------------------------------------------------------
-
-                          LLIINNEE EEDDIITTIINNGG
-
-        These keys can be used to edit text being entered 
-        on the "command line" at the bottom of the screen.
-
- RightArrow ..................... ESC-l ... Move cursor right one character.
- LeftArrow ...................... ESC-h ... Move cursor left one character.
- ctrl-RightArrow  ESC-RightArrow  ESC-w ... Move cursor right one word.
- ctrl-LeftArrow   ESC-LeftArrow   ESC-b ... Move cursor left one word.
- HOME ........................... ESC-0 ... Move cursor to start of line.
- END ............................ ESC-$ ... Move cursor to end of line.
- BACKSPACE ................................ Delete char to left of cursor.
- DELETE ......................... ESC-x ... Delete char under cursor.
- ctrl-BACKSPACE   ESC-BACKSPACE ........... Delete word to left of cursor.
- ctrl-DELETE .... ESC-DELETE .... ESC-X ... Delete word under cursor.
- ctrl-U ......... ESC (MS-DOS only) ....... Delete entire line.
- UpArrow ........................ ESC-k ... Retrieve previous command line.
- DownArrow ...................... ESC-j ... Retrieve next command line.
- TAB ...................................... Complete filename & cycle.
- SHIFT-TAB ...................... ESC-TAB   Complete filename & reverse cycle.
- ctrl-L ................................... Complete filename, list all.

i18n_implementation.md

@@ -0,0 +1,138 @@
+# Internationalisierung (i18n) Implementierung
+
+## Übersicht
+
+Die Internationalisierung wurde erfolgreich in Elpatrons Datumsrechner implementiert. Das System unterstützt derzeit Deutsch (Standard) und Englisch.
+
+## Implementierte Funktionen
+
+### 1. Flask-Babel Integration
+- **Flask-Babel 4.0.0** für Übersetzungsverwaltung
+- **Babel 2.17.0** für Übersetzungskompilierung
+- **Automatische Spracherkennung** basierend auf Browser-Einstellungen
+- **Session-basierte Sprachauswahl** für Benutzer
+
+### 2. Sprachauswahl
+- **DE/EN Toggle** in der oberen linken Ecke
+- **Visueller Indikator** für aktive Sprache
+- **Persistente Sprachauswahl** über Session
+
+### 3. Übersetzungsdateien
+- **Deutsche Übersetzungen**: `translations/de/LC_MESSAGES/messages.po`
+- **Englische Übersetzungen**: `translations/en/LC_MESSAGES/messages.po`
+- **Kompilierte .mo Dateien** für optimale Performance
+
+### 4. Übersetzte Inhalte
+
+#### Meta-Tags
+- Titel und Beschreibung
+- Open Graph Tags
+- Keywords
+
+#### UI-Elemente
+- Haupttitel und Untertitel
+- Formular-Labels
+- Button-Texte
+- Hilfe-Texte
+- Footer-Links
+
+#### Dynamische Inhalte
+- Wochentage (Deutsch/Englisch)
+- Kalenderwochen-Format
+- Datumsformate (DD.MM.YYYY vs MM/DD/YYYY)
+- Fehlermeldungen
+
+### 5. Technische Details
+
+#### App-Konfiguration
+```python
+app.config['BABEL_DEFAULT_LOCALE'] = 'de'
+app.config['BABEL_SUPPORTED_LOCALES'] = ['de', 'en']
+app.config['BABEL_TRANSLATION_DIRECTORIES'] = 'translations'
+```
+
+#### Sprachauswahl-Funktion
+```python
+@app.route('/set_language/<language>')
+def set_language(language):
+    if language in ['de', 'en']:
+        session['language'] = language
+    return redirect(request.referrer or url_for('index'))
+```
+
+#### Locale-Selector
+```python
+@babel.localeselector
+def get_locale():
+    if 'language' in session:
+        return session['language']
+    return request.accept_languages.best_match(['de', 'en'], default='de')
+```
+
+## Verzeichnisstruktur
+
+```
+translations/
+├── de/
+│   └── LC_MESSAGES/
+│       ├── messages.po
+│       └── messages.mo
+└── en/
+    └── LC_MESSAGES/
+        ├── messages.po
+        └── messages.mo
+```
+
+## Verwendung
+
+### Für Entwickler
+
+1. **Neue Texte hinzufügen**:
+   ```html
+   {{ _('Neuer Text') }}
+   ```
+
+2. **Übersetzungen extrahieren**:
+   ```bash
+   pybabel extract -F babel.cfg -k _l -o messages.pot .
+   ```
+
+3. **Neue Übersetzungsdatei erstellen**:
+   ```bash
+   pybabel init -i messages.pot -d translations -l en
+   ```
+
+4. **Übersetzungen kompilieren**:
+   ```bash
+   pybabel compile -d translations
+   ```
+
+### Für Benutzer
+
+- **Sprachauswahl**: Klick auf DE/EN in der oberen linken Ecke
+- **Automatische Erkennung**: Browser-Sprache wird automatisch erkannt
+- **Persistenz**: Sprachauswahl bleibt über Session erhalten
+
+## Nächste Schritte
+
+1. **Weitere Sprachen hinzufügen** (z.B. Französisch, Spanisch)
+2. **Pluralisierung** für verschiedene Sprachen implementieren
+3. **Dynamische Übersetzungen** für API-Responses
+4. **RTL-Sprachen** unterstützen (Arabisch, Hebräisch)
+
+## Dateien
+
+- `app.py`: Hauptanwendung mit i18n-Integration
+- `babel.cfg`: Babel-Konfiguration
+- `requirements.txt`: Flask-Babel Abhängigkeit
+- `templates/index.html`: Übersetzte UI-Templates
+- `translations/`: Übersetzungsdateien
+
+## Status
+
+✅ **Vollständig implementiert und funktionsfähig**
+- Deutsche und englische Übersetzungen
+- Sprachauswahl-UI
+- Automatische Spracherkennung
+- Session-basierte Persistenz
+- Kompilierte Übersetzungen für Performance 

idea.txt

@@ -1,8 +0,0 @@
-erstelle eine python web app, die verschiedene datumsberechnungen durchführt:
-- Berechnung der Anzahl der Tage zwischen zwei Daten
-- Berechnung der Anzahl der Werktage zwischen zwei Daten
-- Anzeige des Wochentags eines Datums
-
-Beachte:
-- Virtual Environment unter ./.venv
-- Wir entwickeln unter Windows

requirements.txt

@@ -1,5 +1,5 @@
-Flask==3.0.3 
+Flask==3.0.0
 numpy==1.26.4
 python-dateutil==2.9.0.post0
-pytest==8.2.2 
-requests 
+requests==2.31.0
+Flask-Babel==4.0.0 

static/service-worker.js

@@ -1,15 +1,25 @@
 const CACHE_NAME = 'datumsrechner-cache-v1';
 const urlsToCache = [
   '/',
-  '/static/style.css',
   '/static/favicon.ico',
   '/static/favicon.png',
+  '/static/favicon.svg',
   '/static/logo.svg',
+  '/static/manifest.json',
 ];
 self.addEventListener('install', event => {
   event.waitUntil(
     caches.open(CACHE_NAME)
-      .then(cache => cache.addAll(urlsToCache))
+      .then(cache => {
+        // Füge nur existierende Dateien zum Cache hinzu
+        return Promise.allSettled(
+          urlsToCache.map(url => 
+            cache.add(url).catch(err => {
+              console.log('Failed to cache:', url, err);
+            })
+          )
+        );
+      })
   );
 });
 self.addEventListener('fetch', event => {

static/swagger.json

@@ -1,4 +1,4 @@
-.v{
+{
   "openapi": "3.0.3",
   "info": {
     "title": "Elpatrons Datumsrechner API",

templates/index.html

@@ -6,14 +6,14 @@
     {%- endif -%}
 {% endmacro %}
 <!doctype html>
-<html lang="de">
+<html lang="{{ get_locale() }}">
 <head>
     <meta charset="utf-8">
-    <title>Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen</title>
-    <meta name="description" content="Elpatrons Datumsrechner: Open Source Web-App für Kalender- und Datumsberechnungen. Tage, Werktage, Wochen, Monate, Kalenderwochen, Wochentage und mehr berechnen – barrierefrei, werbefrei, trackingfrei, kostenlos.">
-    <meta name="keywords" content="Datum, Kalender, Datumsrechner, Werktage, Tage zählen, Kalenderwoche, Wochentag, Open Source, Python, Flask, barrierefreiheit, barrierefrei, kostenlos, werbefrei, trackingfrei, cookiefrei">
-    <meta property="og:title" content="Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen">
-    <meta property="og:description" content="Open Source Web-App für Kalender- und Datumsberechnungen. Werbefrei, trackingfrei, kostenlos.">
+    <title>{{ _('Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen') }}</title>
+    <meta name="description" content="{{ _('Elpatrons Datumsrechner: Open Source Web-App für Kalender- und Datumsberechnungen. Tage, Werktage, Wochen, Monate, Kalenderwochen, Wochentage und mehr berechnen – barrierefrei, werbefrei, trackingfrei, kostenlos.') }}">
+    <meta name="keywords" content="{{ _('Datum, Kalender, Datumsrechner, Werktage, Tage zählen, Kalenderwoche, Wochentag, Open Source, barrierefreiheit, barrierefrei, kostenlos, werbefrei, trackingfrei, cookiefrei, progressive web app, pwa') }}">
+    <meta property="og:title" content="{{ _('Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen') }}">
+    <meta property="og:description" content="{{ _('Open Source Web-App für Kalender- und Datumsberechnungen. Werbefrei, trackingfrei, kostenlos.') }}">
     <meta property="og:type" content="website">
     <meta property="og:url" content="https://codeberg.org/elpatron/datecalc">
     <meta property="og:image" content="/static/logo.svg">
@@ -40,6 +40,11 @@
 * {
     box-sizing: border-box;
 }
+
+html {
+    overflow-x: hidden;
+    width: 100%;
+}
 body {
     background: var(--background);
     color: var(--text);
@@ -47,7 +52,10 @@ body {
     margin: 0;
     padding: 0;
     overflow-x: hidden;
+    overflow-y: auto;
     box-sizing: border-box;
+    min-height: 100vh;
+    width: 100%;
 }
 .container {
     max-width: 480px;
@@ -60,10 +68,11 @@ body {
     border: 1px solid var(--border);
     position: relative;
     box-sizing: border-box;
+    overflow: hidden;
 }
 .help-button-container {
     position: absolute;
-    top: 2.5em;
+    top: 1em;
     right: 2em;
     z-index: 10;
 }
@@ -145,8 +154,9 @@ body {
     padding: 2em;
     max-width: 90%;
     width: 90%;
-    max-height: 90%;
+    max-height: 90vh;
     overflow-y: auto;
+    overflow-x: hidden;
     position: relative;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
     margin: 0 auto;
@@ -155,17 +165,17 @@ body {
     box-sizing: border-box;
 }
 .modal-close {
-    position: absolute;
+    position: fixed;
     top: 1em;
     right: 1em;
-    background: none;
-    border: none;
+    background: rgba(255, 255, 255, 0.95);
+    border: 2px solid var(--border);
     font-size: 1.5em;
     cursor: pointer;
     color: var(--text);
     padding: 0.5em;
     border-radius: 50%;
-    transition: background 0.2s;
+    transition: all 0.2s;
     width: 2.5em;
     height: 2.5em;
     display: flex;
@@ -173,6 +183,8 @@ body {
     justify-content: center;
     min-width: 44px;
     min-height: 44px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    z-index: 1001;
 }
 .modal-close:hover {
     background: var(--border);
@@ -345,6 +357,7 @@ button:focus, .accordion-header:focus {
     /* Layout-Shift-Prävention */
     min-height: 200px;
     contain: layout style paint;
+    width: 100%;
 }
 .accordion-item + .accordion-item {
     border-top: 1px solid var(--border);
@@ -374,6 +387,7 @@ button:focus, .accordion-header:focus {
     overflow: hidden;
     transition: max-height 0.3s ease-out, padding 0.3s ease-out;
     opacity: 0;
+    width: 100%;
 }
 .accordion-content.active {
     display: block;
@@ -459,12 +473,16 @@ button:focus, .accordion-header:focus {
         padding: 1.2em 0.7em 1em 0.7em;
         width: calc(100% - 2em);
         max-width: none;
+        overflow: hidden;
+    }
+    .header-section {
+        margin-top: 4.5em; /* Mehr Abstand für Sprachauswahl und Hilfe-Button */
     }
     h1 {
         font-size: 1.3em;
     }
     .help-button-container {
-        top: 1.5em;
+        top: 1em;
         right: 1.2em;
     }
     .help-button {
@@ -474,6 +492,17 @@ button:focus, .accordion-header:focus {
         min-width: 48px;
         min-height: 48px;
     }
+    
+    .language-selector {
+        top: 1em;
+        left: 1.2em;
+    }
+    
+    #language-dropdown {
+        min-width: 100px;
+        font-size: 0.85em;
+        padding: 0.4em 0.6em;
+    }
     .help-tooltip {
         font-size: 0.8em;
         padding: 0.4em 0.6em;
@@ -483,9 +512,84 @@ button:focus, .accordion-header:focus {
         margin: 1em;
         width: calc(100% - 2em);
         max-width: none;
+        max-height: 85vh;
         left: 0;
         transform: none;
+        overflow-y: auto;
+        overflow-x: hidden;
     }
+    
+    .modal-close {
+        top: 0.8em;
+        right: 0.8em;
+        font-size: 1.3em;
+        width: 2.2em;
+        height: 2.2em;
+        min-width: 48px;
+        min-height: 48px;
+        background: rgba(255, 255, 255, 0.98);
+        border: 2px solid var(--border);
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+    }
+    
+    .modal-content h1 {
+        margin-top: 0;
+        margin-bottom: 1em;
+        font-size: 1.2em;
+        line-height: 1.3;
+    }
+}
+
+/* Sprachauswahl */
+.language-selector {
+    position: absolute;
+    top: 1em;
+    left: 2em;
+    z-index: 10;
+}
+
+#language-dropdown {
+    padding: 0.5em 0.8em;
+    border-radius: 6px;
+    border: 1px solid var(--border);
+    background: var(--surface);
+    color: var(--text);
+    font-size: 0.9em;
+    font-weight: 600;
+    cursor: pointer;
+    min-width: 120px;
+    min-height: 44px;
+    transition: all 0.2s;
+    box-shadow: 0 1px 3px rgba(30,41,59,0.05);
+}
+
+#language-dropdown:hover {
+    border-color: var(--primary);
+    box-shadow: 0 2px 6px rgba(30,41,59,0.1);
+}
+
+#language-dropdown:focus {
+    outline: 3px solid #facc15;
+    outline-offset: 2px;
+    border-color: var(--primary);
+}
+
+#language-dropdown option {
+    padding: 0.5em;
+    font-size: 0.9em;
+}
+
+/* Screen Reader Only */
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
 }
 
 /* Touch-Target Optimierungen für Footer-Links */
@@ -535,6 +639,16 @@ footer br + a {
             const today = new Date().toISOString().split('T')[0];
             document.getElementById(id).value = today;
         }
+        
+        function changeLanguage(language) {
+            // Speichere Sprache in localStorage (datenschutzfreundlich)
+            localStorage.setItem('preferred_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');
             const panels = document.querySelectorAll('.accordion-content');
@@ -569,7 +683,8 @@ footer br + a {
         function readAloud(text, button) {
             // Stoppe vorherige Wiedergabe
             if (currentSpeech) {
-                currentSpeech.cancel();
+                speechSynthesis.cancel();
+                currentSpeech = null;
             }
             
             // Entferne "playing" Klasse von allen Buttons
@@ -578,12 +693,92 @@ footer br + a {
                 btn.textContent = '🔊';
             });
             
+            // Bestimme die aktuelle Sprache
+            let currentLang = 'de-DE'; // Standard
+            
+            // Methode 1: Prüfe URL-Parameter
+            const urlParams = new URLSearchParams(window.location.search);
+            const langParam = urlParams.get('lang');
+            
+            // Methode 2: Prüfe localStorage
+            const savedLang = localStorage.getItem('preferred_language');
+            
+            // Methode 3: Prüfe das HTML lang-Attribut
+            const htmlLang = document.documentElement.lang;
+            
+            // Debug-Ausgabe
+            console.log('URL lang param:', langParam);
+            console.log('Saved lang:', savedLang);
+            console.log('HTML lang:', htmlLang);
+            
+            // Verbesserte Spracherkennung - prüfe alle Quellen
+            if (langParam === 'en' || savedLang === 'en' || htmlLang === 'en') {
+                // Prüfe, ob eine britische Stimme verfügbar ist
+                const voices = speechSynthesis.getVoices();
+                const hasBritishVoice = voices.some(voice => voice.lang === 'en-GB');
+                const hasAmericanVoice = voices.some(voice => voice.lang === 'en-US');
+                
+                if (hasBritishVoice) {
+                    currentLang = 'en-GB';
+                    console.log('Setting language to British English:', currentLang);
+                } else if (hasAmericanVoice) {
+                    currentLang = 'en-US';
+                    console.log('Setting language to American English:', currentLang);
+                } else {
+                    // Fallback auf en-US, auch wenn keine Stimme verfügbar ist
+                    currentLang = 'en-US';
+                    console.log('Setting language to English (no specific voice available):', currentLang);
+                }
+            } else {
+                console.log('Setting language to German:', currentLang);
+            }
+            
             // Erstelle neue Sprachausgabe
             currentSpeech = new SpeechSynthesisUtterance(text);
-            currentSpeech.lang = 'de-DE';
+            currentSpeech.lang = currentLang;
             currentSpeech.rate = 0.9;
             currentSpeech.pitch = 1;
             
+            // Versuche eine passende Stimme zu finden
+            const voices = speechSynthesis.getVoices();
+            console.log('Available voices:', voices.map(v => `${v.name} (${v.lang})`));
+            
+            // Suche nach einer Stimme in der gewünschten Sprache
+            let preferredVoice = voices.find(voice => 
+                voice.lang === currentLang
+            );
+            
+            // Falls keine exakte Übereinstimmung, suche nach ähnlicher Sprache
+            if (!preferredVoice) {
+                preferredVoice = voices.find(voice => 
+                    voice.lang.startsWith(currentLang.split('-')[0])
+                );
+            }
+            
+            // Falls immer noch keine Stimme gefunden, suche nach englischen Stimmen für Englisch
+            if (!preferredVoice && (currentLang === 'en-US' || currentLang === 'en-GB')) {
+                // Bevorzuge britische Stimmen für en-GB
+                if (currentLang === 'en-GB') {
+                    preferredVoice = voices.find(voice => 
+                        voice.lang === 'en-GB' || voice.name.toLowerCase().includes('british')
+                    );
+                }
+                
+                // Falls keine britische Stimme, suche nach amerikanischen oder allgemeinen englischen Stimmen
+                if (!preferredVoice) {
+                    preferredVoice = voices.find(voice => 
+                        voice.lang.includes('en') || voice.name.toLowerCase().includes('english')
+                    );
+                }
+            }
+            
+            if (preferredVoice) {
+                currentSpeech.voice = preferredVoice;
+                console.log('Using voice:', preferredVoice.name, 'for language:', currentLang);
+            } else {
+                console.log('No specific voice found for language:', currentLang, '- using default');
+            }
+            
             // Button-Status aktualisieren
             button.classList.add('playing');
             button.textContent = '⏹️';
@@ -606,6 +801,16 @@ footer br + a {
         }
         
         function readAloudFromElement(button) {
+            // Prüfe, ob bereits eine Wiedergabe läuft
+            if (currentSpeech && speechSynthesis.speaking) {
+                // Stoppe die aktuelle Wiedergabe
+                speechSynthesis.cancel();
+                currentSpeech = null;
+                button.classList.remove('playing');
+                button.textContent = '🔊';
+                return;
+            }
+            
             // Finde das Ergebnis-Element (das div mit class="result")
             const resultElement = button.closest('.result');
             if (!resultElement) return;
@@ -622,7 +827,7 @@ footer br + a {
         
         function stopReading() {
             if (currentSpeech) {
-                currentSpeech.cancel();
+                speechSynthesis.cancel();
                 currentSpeech = null;
             }
             document.querySelectorAll('.read-aloud-btn').forEach(btn => {
@@ -632,6 +837,21 @@ footer br + a {
         }
         
         document.addEventListener('DOMContentLoaded', function() {
+            // Stelle sicher, dass die Stimmen geladen sind
+            if (speechSynthesis.onvoiceschanged !== undefined) {
+                speechSynthesis.onvoiceschanged = function() {
+                    console.log('Voices loaded:', speechSynthesis.getVoices().length);
+                };
+            }
+            
+            // Prüfe localStorage für gespeicherte Sprachauswahl
+            const savedLanguage = localStorage.getItem('preferred_language');
+            if (savedLanguage && !window.location.search.includes('lang=')) {
+                // Wenn Sprache in localStorage gespeichert ist, aber nicht in URL
+                window.location.href = window.location.pathname + '?lang=' + savedLanguage;
+                return;
+            }
+            
             // Sofortige Aktivierung der ersten Accordion-Sektion um Layout-Shifts zu vermeiden
             const activeIdx = parseInt("{{ active_idx|default(0) }}");
             const headers = document.querySelectorAll('.accordion-header');
@@ -690,14 +910,20 @@ footer br + a {
 <body>
     <div class="container">
         <div class="help-button-container">
-            <button type="button" class="help-button" onclick="showHelp()" aria-label="Hilfe anzeigen" title="Hilfe anzeigen" aria-describedby="help-tooltip">?</button>
-            <div id="help-tooltip" class="help-tooltip" role="tooltip">Öffnet ein Hilfefenster mit Informationen über den Datumsrechner</div>
+            <button type="button" class="help-button" onclick="showHelp()" aria-label="{{ _('Hilfe anzeigen') }}" title="{{ _('Hilfe anzeigen') }}" aria-describedby="help-tooltip">?</button>
+            <div id="help-tooltip" class="help-tooltip" role="tooltip">{{ _('Öffnet ein Hilfefenster mit Informationen über den Datumsrechner') }}</div>
         </div>
-        <div 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 class="language-selector">
+            <select id="language-dropdown" onchange="changeLanguage(this.value)" aria-label="{{ _('Sprache auswählen') }}" title="{{ _('Sprache auswählen') }}">
+                <option value="de" {% if get_locale() == 'de' %}selected{% endif %}>{{ _('Deutsch') }}</option>
+                <option value="en" {% if get_locale() == 'en' %}selected{% endif %}>{{ _('English') }}</option>
+            </select>
+        </div>
+        <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;">
-                Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>.
+                {{ _('Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>.') | safe }}
             </div>
         </div>
         <div class="accordion">
@@ -707,67 +933,67 @@ footer br + a {
                         <!-- Kalender mit Doppelpfeil -->
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="5" width="18" height="16" rx="4" fill="#fff" stroke="#2563eb" stroke-width="2"/><rect x="3" y="5" width="18" height="4" rx="2" fill="#2563eb"/><rect x="6" y="2" width="2" height="4" rx="1" fill="#2563eb"/><rect x="16" y="2" width="2" height="4" rx="1" fill="#2563eb"/><path d="M8 15h8M8 15l2-2M8 15l2 2M16 15l-2-2M16 15l-2 2" stroke="#2563eb" stroke-width="1.5" stroke-linecap="round"/></svg>
                     </span>
-                    Anzahl der Tage/Werktage zwischen zwei Daten
+                    {{ _('Anzahl der Tage/Werktage zwischen zwei Daten') }}
                 </button>
                 <div class="accordion-content active" id="accordion-panel-0" role="region" aria-labelledby="accordion-header-0">
                     <form method="post">
-                        <label for="start1">Startdatum:<br>
+                        <label for="start1">{{ _('Startdatum:') }}<br>
                             <span class="date-row">
                                 <input type="date" name="start1" id="start1">
-                                <button type="button" class="today-btn" onclick="setToday('start1')">Heute</button>
+                                <button type="button" class="today-btn" onclick="setToday('start1')">{{ _('Heute') }}</button>
                             </span>
                         </label>
-                        <label for="end1">Enddatum:<br>
+                        <label for="end1">{{ _('Enddatum:') }}<br>
                             <span class="date-row">
                                 <input type="date" name="end1" id="end1">
-                                <button type="button" class="today-btn" onclick="setToday('end1')">Heute</button>
+                                <button type="button" class="today-btn" onclick="setToday('end1')">{{ _('Heute') }}</button>
                             </span>
                         </label>
                         <fieldset style="display:flex;align-items:center;gap:0.5em;margin-top:0.7em; border:none; padding:0;">
                             <legend class="sr-only">Optionen</legend>
                             <input type="checkbox" name="werktage" id="werktage" {% if request.form.get('werktage') %}checked{% endif %} aria-checked="{{ 'true' if request.form.get('werktage') else 'false' }}">
-                            <label for="werktage" style="margin:0;">Nur Werktage</label>
-                            <label for="bundesland" style="margin-left:1em;">Feiertage berücksichtigen für:
+                            <label for="werktage" style="margin:0;">{{ _('Nur Werktage') }}</label>
+                            <label for="bundesland" style="margin-left:1em;">{{ _('Feiertage berücksichtigen für:') }}
                                 <select name="bundesland" id="bundesland" {% if not request.form.get('werktage') %}disabled{% endif %}>
-                                    <option value="">(kein Bundesland)</option>
-                                    <option value="BW" {% if request.form.get('bundesland') == 'BW' %}selected{% endif %}>Baden-Württemberg</option>
-                                    <option value="BY" {% if request.form.get('bundesland') == 'BY' %}selected{% endif %}>Bayern</option>
-                                    <option value="BE" {% if request.form.get('bundesland') == 'BE' %}selected{% endif %}>Berlin</option>
-                                    <option value="BB" {% if request.form.get('bundesland') == 'BB' %}selected{% endif %}>Brandenburg</option>
-                                    <option value="HB" {% if request.form.get('bundesland') == 'HB' %}selected{% endif %}>Bremen</option>
-                                    <option value="HH" {% if request.form.get('bundesland') == 'HH' %}selected{% endif %}>Hamburg</option>
-                                    <option value="HE" {% if request.form.get('bundesland') == 'HE' %}selected{% endif %}>Hessen</option>
-                                    <option value="MV" {% if request.form.get('bundesland') == 'MV' %}selected{% endif %}>Mecklenburg-Vorpommern</option>
-                                    <option value="NI" {% if request.form.get('bundesland') == 'NI' %}selected{% endif %}>Niedersachsen</option>
-                                    <option value="NW" {% if request.form.get('bundesland') == 'NW' %}selected{% endif %}>Nordrhein-Westfalen</option>
-                                    <option value="RP" {% if request.form.get('bundesland') == 'RP' %}selected{% endif %}>Rheinland-Pfalz</option>
-                                    <option value="SL" {% if request.form.get('bundesland') == 'SL' %}selected{% endif %}>Saarland</option>
-                                    <option value="SN" {% if request.form.get('bundesland') == 'SN' %}selected{% endif %}>Sachsen</option>
-                                    <option value="ST" {% if request.form.get('bundesland') == 'ST' %}selected{% endif %}>Sachsen-Anhalt</option>
-                                    <option value="SH" {% if request.form.get('bundesland') == 'SH' %}selected{% endif %}>Schleswig-Holstein</option>
-                                    <option value="TH" {% if request.form.get('bundesland') == 'TH' %}selected{% endif %}>Thüringen</option>
+                                    <option value="">{{ _('(kein Bundesland)') }}</option>
+                                    <option value="BW" {% if request.form.get('bundesland') == 'BW' %}selected{% endif %}>{{ _('Baden-Württemberg') }}</option>
+                                    <option value="BY" {% if request.form.get('bundesland') == 'BY' %}selected{% endif %}>{{ _('Bayern') }}</option>
+                                    <option value="BE" {% if request.form.get('bundesland') == 'BE' %}selected{% endif %}>{{ _('Berlin') }}</option>
+                                    <option value="BB" {% if request.form.get('bundesland') == 'BB' %}selected{% endif %}>{{ _('Brandenburg') }}</option>
+                                    <option value="HB" {% if request.form.get('bundesland') == 'HB' %}selected{% endif %}>{{ _('Bremen') }}</option>
+                                    <option value="HH" {% if request.form.get('bundesland') == 'HH' %}selected{% endif %}>{{ _('Hamburg') }}</option>
+                                    <option value="HE" {% if request.form.get('bundesland') == 'HE' %}selected{% endif %}>{{ _('Hessen') }}</option>
+                                    <option value="MV" {% if request.form.get('bundesland') == 'MV' %}selected{% endif %}>{{ _('Mecklenburg-Vorpommern') }}</option>
+                                    <option value="NI" {% if request.form.get('bundesland') == 'NI' %}selected{% endif %}>{{ _('Niedersachsen') }}</option>
+                                    <option value="NW" {% if request.form.get('bundesland') == 'NW' %}selected{% endif %}>{{ _('Nordrhein-Westfalen') }}</option>
+                                    <option value="RP" {% if request.form.get('bundesland') == 'RP' %}selected{% endif %}>{{ _('Rheinland-Pfalz') }}</option>
+                                    <option value="SL" {% if request.form.get('bundesland') == 'SL' %}selected{% endif %}>{{ _('Saarland') }}</option>
+                                    <option value="SN" {% if request.form.get('bundesland') == 'SN' %}selected{% endif %}>{{ _('Sachsen') }}</option>
+                                    <option value="ST" {% if request.form.get('bundesland') == 'ST' %}selected{% endif %}>{{ _('Sachsen-Anhalt') }}</option>
+                                    <option value="SH" {% if request.form.get('bundesland') == 'SH' %}selected{% endif %}>{{ _('Schleswig-Holstein') }}</option>
+                                    <option value="TH" {% if request.form.get('bundesland') == 'TH' %}selected{% endif %}>{{ _('Thüringen') }}</option>
                                 </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">
-                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
+                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="{{ _('Ergebnis vorlesen') }}" title="{{ _('Ergebnis vorlesen') }}" tabindex="0">🔊</button>
                             {% if request.form.get('werktage') %}
-                                Anzahl der Werktage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}:</b>{% if request.form.get('bundesland') %} (Feiertage: {{ request.form.get('bundesland') }}){% endif %}: {{ tage }}
+                                {{ _('Anzahl der Werktage zwischen') }} <b>{{ format_date(request.form.get('start1', '')) }}</b> {{ _('und') }} <b>{{ format_date(request.form.get('end1', '')) }}:</b>{% if request.form.get('bundesland') %} {{ _('(Feiertage:') }} {{ request.form.get('bundesland') }}){% endif %}: {{ tage }}
                             {% else %}
-                                Anzahl der Tage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}</b>: {{ tage }}.
+                                {{ _('Anzahl der Tage zwischen') }} <b>{{ format_date(request.form.get('start1', '')) }}</b> {{ _('und') }} <b>{{ format_date(request.form.get('end1', '')) }}</b>: {{ tage }}.
                             {% endif %}
                             {% if wochenendtage_anzahl is not none or (feiertage_anzahl is not none and request.form.get('bundesland')) %}
                                 <br>
                                 <span style="font-size:0.98em; color:#1e293b;">
                                     {% if wochenendtage_anzahl is not none %}
-                                        <b>Davon sind {{ wochenendtage_anzahl }}</b> Tage Wochenendtage.
+                                        <b>{{ _('Davon sind') }} {{ wochenendtage_anzahl }}</b> {{ _('Tage Wochenendtage.') }}
                                     {% endif %}
                                     {% if feiertage_anzahl is not none and request.form.get('bundesland') %}
                                         {% if wochenendtage_anzahl is not none %}, {% endif %}
-                                        <b>{{ feiertage_anzahl }}</b> Feiertage (Mo-Fr, {{ request.form.get('bundesland') }})
+                                        <b>{{ feiertage_anzahl }}</b> {{ _('Feiertage (Mo-Fr,') }} {{ request.form.get('bundesland') }})
                                     {% endif %}
                                 </span>
                             {% endif %}
@@ -781,22 +1007,22 @@ footer br + a {
                         <!-- Kalender mit W -->
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="5" width="18" height="16" rx="4" fill="#fff" stroke="#2563eb" stroke-width="2"/><rect x="3" y="5" width="18" height="4" rx="2" fill="#2563eb"/><rect x="6" y="2" width="2" height="4" rx="1" fill="#2563eb"/><rect x="16" y="2" width="2" height="4" rx="1" fill="#2563eb"/><text x="12" y="17" text-anchor="middle" font-size="12" font-family="Segoe UI, Arial, sans-serif" fill="#2563eb" font-weight="bold">W</text></svg>
                     </span>
-                    Wochentag eines Datums
+                    {{ _('Wochentag eines Datums') }}
                 </button>
                 <div class="accordion-content" id="accordion-panel-1" role="region" aria-labelledby="accordion-header-1">
                     <form method="post">
-                        <label for="datum3">Datum:<br>
+                        <label for="datum3">{{ _('Datum:') }}<br>
                             <span class="date-row">
                                 <input type="date" name="datum3" id="datum3">
-                                <button type="button" class="today-btn" onclick="setToday('datum3')">Heute</button>
+                                <button type="button" class="today-btn" onclick="setToday('datum3')">{{ _('Heute') }}</button>
                             </span>
                         </label>
-                        <button name="action" value="wochentag" type="submit">Anzeigen</button>
+                        <button name="action" value="wochentag" type="submit">{{ _('Anzeigen') }}</button>
                     </form>
                     {% if wochentag is not none %}
                         <div class="result" aria-live="polite">
-                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
-                            Wochentag von <b>{{ format_date(request.form.get('datum3', '')) }}</b>: {{ wochentag }}
+                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="{{ _('Ergebnis vorlesen') }}" title="{{ _('Ergebnis vorlesen') }}" tabindex="0">🔊</button>
+                            {{ _('Wochentag von') }} <b>{{ format_date(request.form.get('datum3', '')) }}</b>: {{ wochentag }}
                         </div>
                     {% endif %}
                 </div>
@@ -807,22 +1033,22 @@ footer br + a {
                         <!-- Kalender mit # -->
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="5" width="18" height="16" rx="4" fill="#fff" stroke="#2563eb" stroke-width="2"/><rect x="3" y="5" width="18" height="4" rx="2" fill="#2563eb"/><rect x="6" y="2" width="2" height="4" rx="1" fill="#2563eb"/><rect x="16" y="2" width="2" height="4" rx="1" fill="#2563eb"/><text x="12" y="17" text-anchor="middle" font-size="13" font-family="Segoe UI, Arial, sans-serif" fill="#2563eb" font-weight="bold">#</text></svg>
                     </span>
-                    Kalenderwoche eines Datums
+                    {{ _('Kalenderwoche eines Datums') }}
                 </button>
                 <div class="accordion-content" id="accordion-panel-2" role="region" aria-labelledby="accordion-header-2">
                     <form method="post">
-                        <label for="datum6">Datum:<br>
+                        <label for="datum6">{{ _('Datum:') }}<br>
                             <span class="date-row">
                                 <input type="date" name="datum6" id="datum6">
-                                <button type="button" class="today-btn" onclick="setToday('datum6')">Heute</button>
+                                <button type="button" class="today-btn" onclick="setToday('datum6')">{{ _('Heute') }}</button>
                             </span>
                         </label>
-                        <button name="action" value="kw_berechnen" type="submit">Kalenderwoche berechnen</button>
+                        <button name="action" value="kw_berechnen" type="submit">{{ _('Kalenderwoche berechnen') }}</button>
                     </form>
                     {% if kw_berechnen is not none %}
                         <div class="result" aria-live="polite">
-                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
-                            Kalenderwoche von <b>{{ format_date(request.form.get('datum6', '')) }}</b>: {{ kw_berechnen }}
+                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="{{ _('Ergebnis vorlesen') }}" title="{{ _('Ergebnis vorlesen') }}" tabindex="0">🔊</button>
+                            {{ _('Kalenderwoche von') }} <b>{{ format_date(request.form.get('datum6', '')) }}</b>: {{ kw_berechnen }}
                         </div>
                     {% endif %}
                 </div>
@@ -833,22 +1059,22 @@ footer br + a {
                         <!-- Kalender mit Pfeil nach außen -->
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="5" width="18" height="16" rx="4" fill="#fff" stroke="#2563eb" stroke-width="2"/><rect x="3" y="5" width="18" height="4" rx="2" fill="#2563eb"/><rect x="6" y="2" width="2" height="4" rx="1" fill="#2563eb"/><rect x="16" y="2" width="2" height="4" rx="1" fill="#2563eb"/><path d="M7 17l5-5 5 5" stroke="#2563eb" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><text x="12" y="12" text-anchor="middle" font-size="8" font-family="Segoe UI, Arial, sans-serif" fill="#2563eb" font-weight="bold">KW</text></svg>
                     </span>
-                    Start-/Enddatum zu Kalenderwoche
+                    {{ _('Start-/Enddatum zu Kalenderwoche') }}
                 </button>
                 <div class="accordion-content" id="accordion-panel-3" role="region" aria-labelledby="accordion-header-3">
                     <form method="post">
-                        <label for="jahr7">Jahr:<br>
+                        <label for="jahr7">{{ _('Jahr:') }}<br>
                             <input type="number" name="jahr7" id="jahr7" min="1900" max="2100" style="width: 7em;">
                         </label>
-                        <label for="kw7">Kalenderwoche:<br>
+                        <label for="kw7">{{ _('Kalenderwoche:') }}<br>
                             <input type="number" name="kw7" id="kw7" min="1" max="53" style="width: 5em;">
                         </label>
-                        <button name="action" value="kw_datum" type="submit">Start-/Enddatum berechnen</button>
+                        <button name="action" value="kw_datum" type="submit">{{ _('Start-/Enddatum berechnen') }}</button>
                     </form>
                     {% if kw_datum is not none %}
                         <div class="result" aria-live="polite">
-                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
-                            Start-/Enddatum der KW <b>{{ request.form.get('kw7', '') }}</b> im Jahr <b>{{ request.form.get('jahr7', '') }}</b>: {{ kw_datum }}
+                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="{{ _('Ergebnis vorlesen') }}" title="{{ _('Ergebnis vorlesen') }}" tabindex="0">🔊</button>
+                            {{ _('Start-/Enddatum der KW') }} <b>{{ request.form.get('kw7', '') }}</b> {{ _('im Jahr') }} <b>{{ request.form.get('jahr7', '') }}</b>: {{ kw_datum }}
                         </div>
                     {% endif %}
                 </div>
@@ -859,41 +1085,41 @@ footer br + a {
                         <!-- Kalender mit ± -->
                         <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="5" width="18" height="16" rx="4" fill="#fff" stroke="#2563eb" stroke-width="2"/><rect x="3" y="5" width="18" height="4" rx="2" fill="#2563eb"/><rect x="6" y="2" width="2" height="4" rx="1" fill="#2563eb"/><rect x="16" y="2" width="2" height="4" rx="1" fill="#2563eb"/><text x="12" y="17" text-anchor="middle" font-size="16" font-family="Segoe UI, Arial, sans-serif" fill="#2563eb" font-weight="bold">±</text></svg>
                     </span>
-                    Datum plus/minus X Tage/Wochen/Monate
+                    {{ _('Datum plus/minus X Tage/Wochen/Monate') }}
                 </button>
                 <div class="accordion-content" id="accordion-panel-4" role="region" aria-labelledby="accordion-header-4">
                     <form method="post">
-                        <label for="datum_pm">Datum:<br>
+                        <label for="datum_pm">{{ _('Datum:') }}<br>
                             <span class="date-row">
                                 <input type="date" name="datum_pm" id="datum_pm">
-                                <button type="button" class="today-btn" onclick="setToday('datum_pm')">Heute</button>
+                                <button type="button" class="today-btn" onclick="setToday('datum_pm')">{{ _('Heute') }}</button>
                             </span>
                         </label>
-                        <label for="anzahl_pm">Anzahl:<br>
+                        <label for="anzahl_pm">{{ _('Anzahl:') }}<br>
                             <input type="number" name="anzahl_pm" id="anzahl_pm" style="width: 6em;">
                         </label>
                         <fieldset class="date-calc-row" style="border:none; padding:0;">
-                            <legend class="sr-only">Rechenrichtung</legend>
-                            <label for="richtung_pm_add"><input type="radio" name="richtung_pm" id="richtung_pm_add" value="add" checked> addieren</label>
-                            <label for="richtung_pm_sub"><input type="radio" name="richtung_pm" id="richtung_pm_sub" value="sub"> subtrahieren</label>
+                            <legend class="sr-only">{{ _('Rechenrichtung') }}</legend>
+                            <label for="richtung_pm_add"><input type="radio" name="richtung_pm" id="richtung_pm_add" value="add" checked> {{ _('addieren') }}</label>
+                            <label for="richtung_pm_sub"><input type="radio" name="richtung_pm" id="richtung_pm_sub" value="sub"> {{ _('subtrahieren') }}</label>
                         </fieldset>
                         <fieldset style="display:flex; align-items:center; gap:0.5em; margin-top:0.7em; border:none; padding:0;">
-                            <legend class="sr-only">Einheit und Werktage</legend>
-                            <label for="einheit_pm" style="margin:0;">Einheit:
+                            <legend class="sr-only">{{ _('Einheit und Werktage') }}</legend>
+                            <label for="einheit_pm" style="margin:0;">{{ _('Einheit:') }}
                                 <select name="einheit_pm" id="einheit_pm">
-                                    <option value="tage">Tage</option>
-                                    <option value="wochen">Wochen</option>
-                                    <option value="monate">Monate</option>
+                                    <option value="tage">{{ _('Tage') }}</option>
+                                    <option value="wochen">{{ _('Wochen') }}</option>
+                                    <option value="monate">{{ _('Monate') }}</option>
                                 </select>
                             </label>
                             <input type="checkbox" name="werktage_pm" id="werktage_pm">
-                            <label for="werktage_pm" style="margin:0;">Nur Werktage</label>
+                            <label for="werktage_pm" style="margin:0;">{{ _('Nur Werktage') }}</label>
                         </fieldset>
-                        <button name="action" value="plusminus" type="submit">Berechnen</button>
+                        <button name="action" value="plusminus" type="submit">{{ _('Berechnen') }}</button>
                     </form>
                     {% if plusminus_result is not none %}
                         <div class="result" aria-live="polite">
-                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
+                            <button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="{{ _('Ergebnis vorlesen') }}" title="{{ _('Ergebnis vorlesen') }}" tabindex="0">🔊</button>
                             {{ plusminus_result }}
                         </div>
                     {% endif %}
@@ -905,57 +1131,57 @@ footer br + a {
     <!-- Help Modal Overlay -->
     <div id="helpModal" class="modal-overlay" role="dialog" aria-labelledby="help-title" aria-describedby="help-content">
         <div class="modal-content">
-            <button type="button" class="modal-close" onclick="hideHelp()" aria-label="Hilfe schließen">&times;</button>
-            <h1 id="help-title">Was ist Elpatrons Datumsrechner?</h1>
+            <button type="button" class="modal-close" onclick="hideHelp()" aria-label="{{ _('Hilfe schließen') }}">&times;</button>
+            <h1 id="help-title">{{ _('Was ist Elpatrons Datumsrechner?') }}</h1>
             
-            <p>Der Datumsrechner kann verschiedene Datumsberechnungen durchführen:</p>
+            <p>{{ _('Der Datumsrechner kann verschiedene Datumsberechnungen durchführen:') }}</p>
             
             <ul>
-                <li>Anzahl der Tage zwischen zwei Daten</li>
-                <li>Anzahl der Werktage zwischen zwei Daten</li>
-                <li>Anzeige des Wochentags eines Datums</li>
-                <li>Datum plus/minus X Tage</li>
-                <li>Datum plus/minus X Werktage</li>
-                <li>Datum plus/minus X Wochen/Monate</li>
-                <li>Kalenderwoche zu Datum</li>
-                <li>Start-/Enddatum einer Kalenderwoche eines Jahres</li>
+                <li>{{ _('Anzahl der Tage zwischen zwei Daten') }}</li>
+                <li>{{ _('Anzahl der Werktage zwischen zwei Daten') }}</li>
+                <li>{{ _('Anzeige des Wochentags eines Datums') }}</li>
+                <li>{{ _('Datum plus/minus X Tage') }}</li>
+                <li>{{ _('Datum plus/minus X Werktage') }}</li>
+                <li>{{ _('Datum plus/minus X Wochen/Monate') }}</li>
+                <li>{{ _('Kalenderwoche zu Datum') }}</li>
+                <li>{{ _('Start-/Enddatum einer Kalenderwoche eines Jahres') }}</li>
             </ul>
             
-            <h2>Online Datumsrechner gibt es bereits in einer Vielzahl, warum also noch einer?</h2>
+            <h2>{{ _('Online Datumsrechner gibt es bereits in einer Vielzahl, warum also noch einer?') }}</h2>
             
-            <p>Aus zwei Gründen:</p>
+            <p>{{ _('Aus zwei Gründen:') }}</p>
             
             <ul>
-                <li>Finde mal einen Datumsrechner, der nicht vollkommen verseucht mit Werbung, Tracking und Cookies ist!</li>
-                <li>Das hat mich so geärgert, dass ich meinen eigenen programmiert habe.
+                <li>{{ _('Finde mal einen Datumsrechner, der nicht vollkommen verseucht mit Werbung, Tracking und Cookies ist!') }}</li>
+                <li>{{ _('Das hat mich so geärgert, dass ich meinen eigenen programmiert habe.') }}
                     <ul>
-                        <li>Genau genommen nicht ich selbst. Diese App wurde zum überwiegenden Teil von KI nach meinen Anweisungen entwickelt (Vibe Coding).</li>
+                        <li>{{ _('Genau genommen nicht ich selbst. Diese App wurde zum überwiegenden Teil von KI nach meinen Anweisungen entwickelt (Vibe Coding).') }}</li>
                     </ul>
                 </li>
             </ul>
             
-            <h2>Was du noch wissen solltest</h2>
+            <h2>{{ _('Was du noch wissen solltest') }}</h2>
             
             <ul>
-                <li>Ich habe versucht, die App möglichst barrierefrei zu gestalten, um Menschen mit Einschränkungen die Benutzung zu erleichtern.</li>
-                <li>Diese App schnüffelt dir nicht hinterher, sammelt keine persönlichen Daten und geht dir auch sonst (hoffentlich!) in keiner Weise auf die Nerven.</li>
-                <li>Den Quellcode dieser App habe ich auf <a href="https://codeberg.org/elpatron/datecalc" target="_blank">Codeberg</a> veröffentlicht, du kannst ihn einsehen, verändern oder damit deinen eigenen kleinen Datumsrechner betreiben.</li>
-                <li>Die App läuft auf meinem kleinen Home-Server und ist derzeit nicht für große Besucherzahlen ausgelegt.</li>
-                <li>Ich übernehme keine Gewähr für die Funktionalität und die Rechenergebnisse. Die KI, die das programmiert hat, übrigens auch nicht.</li>
-                <li>Falls du einen Fehler findest oder eine weitere Funktion wünschst, kannst du mir eine Mail schreiben (siehe Mailto Link in der Fußzeile)</li>
+                <li>{{ _('Ich habe versucht, die App möglichst barrierefrei zu gestalten, um Menschen mit Einschränkungen die Benutzung zu erleichtern.') }}</li>
+                <li>{{ _('Diese App schnüffelt dir nicht hinterher, sammelt keine persönlichen Daten und geht dir auch sonst (hoffentlich!) in keiner Weise auf die Nerven.') }}</li>
+                <li>{{ _('Den Quellcode dieser App habe ich auf') }} <a href="https://codeberg.org/elpatron/datecalc" target="_blank">Codeberg</a> {{ _('veröffentlicht, du kannst ihn einsehen, verändern oder damit deinen eigenen kleinen Datumsrechner betreiben.') }}</li>
+                <li>{{ _('Die App läuft auf meinem kleinen Home-Server und ist derzeit nicht für große Besucherzahlen ausgelegt.') }}</li>
+                <li>{{ _('Ich übernehme keine Gewähr für die Funktionalität und die Rechenergebnisse. Die KI, die das programmiert hat, übrigens auch nicht.') }}</li>
+                <li>{{ _('Falls du einen Fehler findest oder eine weitere Funktion wünschst, kannst du mir eine Mail schreiben (siehe Mailto Link in der Fußzeile)') }}</li>
             </ul>
             
-            <p><strong>Hab Spaß mit Elpatrons Datumsrechner! Dein M. Busche</strong></p>
+            <p><strong>{{ _('Hab Spaß mit Elpatrons Datumsrechner! Dein M. Busche') }}</strong></p>
         </div>
         <div id="help-content" class="sr-only">
-            Hilfe-Informationen für den Datumsrechner mit Erklärungen zu allen Funktionen
+            {{ _('Hilfe-Informationen für den Datumsrechner mit Erklärungen zu allen Funktionen') }}
         </div>
     </div>
     
     <footer style="text-align:center; margin-top:2em; color:#475569; font-size:0.98em; padding-bottom:1.5em;">
-        Dies ist ein werbe- und trackingfreier <a href="https://codeberg.org/elpatron/datecalc/src/branch/main/README.md" target="_blank" style="color:#1e40af; text-decoration:underline;">Open Source Datumsrechner</a><br>
+        Dies ist ein werbe- und trackingfreier <a href="https://codeberg.org/elpatron/datecalc/src/branch/main/README.md" target="_blank" style="color:#1e40af; text-decoration:underline;">Open Source</a> Datumsrechner<br>
         <a href="/api-docs" target="_blank" style="color:#1e40af; text-decoration:underline;">REST API Dokumentation (Swagger)</a><br>
-        © 2025 <a href="mailto:elpatron@mailbox.org?subject=Datumsrechner" style="color:#1e40af; text-decoration:underline;">M. Busche</a>
+        © 2025 <a href="mailto:elpatron@mailbox.org?subject=Datumsrechner" style="color:#1e40af; text-decoration:underline;">Markus Busche</a>
         <div style="margin-top:0.5em; font-size:0.85em; color:#64748b;">v{{ app_version }}</div>
     </footer>
 <script>

templates/stats_dashboard.html

@@ -19,6 +19,32 @@
         .stats-label { color: #64748b; }
         .stats-value { font-size: 1.5em; font-weight: bold; }
         .chart-container { margin: 2em 0; }
+        .toggle-container { 
+            display: flex; 
+            justify-content: center; 
+            margin-bottom: 1.5em; 
+            gap: 0.5em; 
+        }
+        .toggle-btn { 
+            padding: 0.5em 1em; 
+            border: 1px solid #d1d5db; 
+            background: #f9fafb; 
+            color: #6b7280; 
+            border-radius: 6px; 
+            cursor: pointer; 
+            transition: all 0.2s; 
+        }
+        .toggle-btn.active { 
+            background: #2563eb; 
+            color: white; 
+            border-color: #2563eb; 
+        }
+        .toggle-btn:hover { 
+            background: #e5e7eb; 
+        }
+        .toggle-btn.active:hover { 
+            background: #1d4ed8; 
+        }
     </style>
 </head>
 <body>
@@ -28,6 +54,12 @@
             <div class="stats-label">Gesamt-Pageviews (7 Tage):</div>
             <div class="stats-value">{{ pageviews }}</div>
         </div>
+        
+        <div class="toggle-container">
+            <button class="toggle-btn active" data-period="week">Wochenverlauf</button>
+            <button class="toggle-btn" data-period="day">24-Stunden-Verlauf</button>
+        </div>
+        
         <div class="chart-container">
             <canvas id="imprChart" width="400" height="180"></canvas>
         </div>
@@ -43,18 +75,59 @@
     </div>
     <script type="text/javascript">
     document.addEventListener('DOMContentLoaded', function() {
-        // Impressions pro Tag
-        // eslint-disable-next-line
-        const imprData = {{ impressions_per_day|tojson }};
-        const imprLabels = Object.keys(imprData);
-        const imprCounts = Object.values(imprData);
-        new Chart(document.getElementById('imprChart').getContext('2d'), {
+        // Daten für verschiedene Zeiträume
+        const weekData = {{ impressions_per_day|tojson }};
+        const dayData = {{ impressions_per_hour|tojson }};
+        const weekFuncData = {{ func_counts|tojson }};
+        const dayFuncData = {{ func_counts_hourly|tojson }};
+        const weekApiData = {{ api_counts|tojson }};
+        const dayApiData = {{ api_counts_hourly|tojson }};
+        
+        let currentPeriod = 'week';
+        let currentImprChart = null;
+        let currentFuncChart = null;
+        let currentApiChart = null;
+        
+        // Toggle-Buttons Event Listener
+        document.querySelectorAll('.toggle-btn').forEach(btn => {
+            btn.addEventListener('click', function() {
+                // Aktiven Button aktualisieren
+                document.querySelectorAll('.toggle-btn').forEach(b => b.classList.remove('active'));
+                this.classList.add('active');
+                
+                // Zeitraum wechseln
+                currentPeriod = this.dataset.period;
+                updateAllCharts();
+            });
+        });
+        
+        function updateImpressionsChart() {
+            const ctx = document.getElementById('imprChart').getContext('2d');
+            
+            // Bestehenden Chart zerstören
+            if (currentImprChart) {
+                currentImprChart.destroy();
+            }
+            
+            let data, labels, counts;
+            
+            if (currentPeriod === 'week') {
+                data = weekData;
+                labels = Object.keys(data);
+                counts = Object.values(data);
+            } else {
+                data = dayData;
+                labels = Object.keys(data);
+                counts = Object.values(data);
+            }
+            
+            currentImprChart = new Chart(ctx, {
                 type: 'line',
                 data: {
-                labels: imprLabels,
+                    labels: labels,
                     datasets: [{
-                    label: 'Impressions/Tag',
-                    data: imprCounts,
+                        label: currentPeriod === 'week' ? 'Impressions/Tag' : 'Impressions/Stunde',
+                        data: counts,
                         borderColor: '#059669',
                         backgroundColor: 'rgba(5,150,105,0.1)',
                         tension: 0.2,
@@ -62,56 +135,136 @@
                     }]
                 },
                 options: {
-                plugins: { legend: { display: true } },
+                    plugins: { 
+                        legend: { display: true },
+                        title: {
+                            display: true,
+                            text: currentPeriod === 'week' ? 'Wochenverlauf' : '24-Stunden-Verlauf'
+                        }
+                    },
                     scales: {
                         y: { beginAtZero: true, ticks: { stepSize: 1 } }
                     }
                 }
             });
-        // Funktionsaufrufe
-        // eslint-disable-next-line
-        const funcCounts = {{ func_counts|tojson }};
-        const labels = Object.keys(funcCounts);
-        const data = Object.values(funcCounts);
-        new Chart(document.getElementById('funcChart').getContext('2d'), {
+        }
+        
+        function updateFunctionChart() {
+            const ctx = document.getElementById('funcChart').getContext('2d');
+            
+            // Bestehenden Chart zerstören
+            if (currentFuncChart) {
+                currentFuncChart.destroy();
+            }
+            
+            let data, labels, counts;
+            
+            if (currentPeriod === 'week') {
+                data = weekFuncData;
+                labels = Object.keys(data);
+                counts = Object.values(data);
+            } else {
+                // Für stündliche Daten: Summe aller Stunden für jede Funktion
+                const aggregatedData = {};
+                Object.values(dayFuncData).forEach(hourData => {
+                    Object.keys(hourData).forEach(func => {
+                        aggregatedData[func] = (aggregatedData[func] || 0) + hourData[func];
+                    });
+                });
+                data = aggregatedData;
+                labels = Object.keys(data);
+                counts = Object.values(data);
+            }
+            
+            currentFuncChart = new Chart(ctx, {
                 type: 'bar',
                 data: {
                     labels: labels,
                     datasets: [{
                         label: 'Funktionsaufrufe',
-                    data: data,
+                        data: counts,
                         backgroundColor: '#2563eb',
                     }]
                 },
                 options: {
-                plugins: { legend: { display: false } },
+                    plugins: { 
+                        legend: { display: false },
+                        title: {
+                            display: true,
+                            text: currentPeriod === 'week' ? 'Funktionsaufrufe (Woche)' : 'Funktionsaufrufe (24h)'
+                        }
+                    },
                     scales: {
                         y: { beginAtZero: true, ticks: { stepSize: 1 } }
                     }
                 }
             });
-        // API-Nutzung
-        // eslint-disable-next-line
-        const apiCounts = {{ api_counts|tojson }};
-        if (Object.keys(apiCounts).length > 0 && document.getElementById('apiChart')) {
-            new Chart(document.getElementById('apiChart').getContext('2d'), {
+        }
+        
+        function updateApiChart() {
+            const apiChartElement = document.getElementById('apiChart');
+            if (!apiChartElement) return;
+            
+            const ctx = apiChartElement.getContext('2d');
+            
+            // Bestehenden Chart zerstören
+            if (currentApiChart) {
+                currentApiChart.destroy();
+            }
+            
+            let data, labels, counts;
+            
+            if (currentPeriod === 'week') {
+                data = weekApiData;
+            } else {
+                // Für stündliche Daten: Summe aller Stunden für jede API
+                const aggregatedData = {};
+                Object.values(dayApiData).forEach(hourData => {
+                    Object.keys(hourData).forEach(api => {
+                        aggregatedData[api] = (aggregatedData[api] || 0) + hourData[api];
+                    });
+                });
+                data = aggregatedData;
+            }
+            
+            if (Object.keys(data).length === 0) return;
+            
+            labels = Object.keys(data);
+            counts = Object.values(data);
+            
+            currentApiChart = new Chart(ctx, {
                 type: 'bar',
                 data: {
-                    labels: Object.keys(apiCounts),
+                    labels: labels,
                     datasets: [{
                         label: 'API-Aufrufe nach Endpunkt',
-                        data: Object.values(apiCounts),
+                        data: counts,
                         backgroundColor: '#f59e42',
                     }]
                 },
                 options: {
-                    plugins: { legend: { display: false } },
+                    plugins: { 
+                        legend: { display: false },
+                        title: {
+                            display: true,
+                            text: currentPeriod === 'week' ? 'API-Nutzung (Woche)' : 'API-Nutzung (24h)'
+                        }
+                    },
                     scales: {
                         y: { beginAtZero: true, ticks: { stepSize: 1 } }
                     }
                 }
             });
         }
+        
+        function updateAllCharts() {
+            updateImpressionsChart();
+            updateFunctionChart();
+            updateApiChart();
+        }
+        
+        // Initial Charts erstellen
+        updateAllCharts();
     });
     </script>
 </body>

test_app.py

@@ -221,10 +221,11 @@ def test_api_plusminus(client):
 def test_api_stats(client):
     resp = client.get('/api/stats')
     assert resp.status_code == 200
-    # Die Route gibt HTML zurück, nicht JSON
-    html = resp.data.decode('utf-8')
-    # Prüfe auf typische HTML-Elemente des Dashboards
-    assert 'Statistik-Dashboard' in html or 'Dashboard' in html
+    data = resp.get_json()
+    assert "pageviews" in data
+    assert "func_counts" in data
+    assert "impressions_per_day" in data
+    assert "api_counts" in data
 
 def test_api_monitor(client):
     resp = client.get('/api/monitor')

translations/de/LC_MESSAGES/messages.po

@@ -0,0 +1,483 @@
+# German translations for Elpatrons Datumsrechner.
+# Copyright (C) 2025 M. Busche
+# This file is distributed under the same license as the Elpatrons Datumsrechner package.
+msgid ""
+msgstr ""
+"Project-Id-Version: 1.3.13\n"
+"Report-Msgid-Bugs-To: elpatron@mailbox.org\n"
+"POT-Creation-Date: 2025-08-01 15:58+0100\n"
+"PO-Revision-Date: 2025-08-01 15:58+0100\n"
+"Last-Translator: M. Busche <elpatron@mailbox.org>\n"
+"Language: de\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+#: templates/index.html:12
+msgid "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+msgstr "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+
+#: templates/index.html:13
+msgid "Elpatrons Datumsrechner: Open Source Web-App für Kalender- und Datumsberechnungen. Tage, Werktage, Wochen, Monate, Kalenderwochen, Wochentage und mehr berechnen – barrierefrei, werbefrei, trackingfrei, kostenlos."
+msgstr "Elpatrons Datumsrechner: Open Source Web-App für Kalender- und Datumsberechnungen. Tage, Werktage, Wochen, Monate, Kalenderwochen, Wochentage und mehr berechnen – barrierefrei, werbefrei, trackingfrei, kostenlos."
+
+#: templates/index.html:14
+msgid "Datum, Kalender, Datumsrechner, Werktage, Tage zählen, Kalenderwoche, Wochentag, Open Source, Python, Flask, barrierefreiheit, barrierefrei, kostenlos, werbefrei, trackingfrei, cookiefrei"
+msgstr "Datum, Kalender, Datumsrechner, Werktage, Tage zählen, Kalenderwoche, Wochentag, Open Source, Python, Flask, barrierefreiheit, barrierefrei, kostenlos, werbefrei, trackingfrei, cookiefrei"
+
+#: templates/index.html:15
+msgid "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+msgstr "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+
+#: templates/index.html:16
+msgid "Open Source Web-App für Kalender- und Datumsberechnungen. Werbefrei, trackingfrei, kostenlos."
+msgstr "Open Source Web-App für Kalender- und Datumsberechnungen. Werbefrei, trackingfrei, kostenlos."
+
+#: templates/index.html:17
+msgid "website"
+msgstr "website"
+
+#: templates/index.html:18
+msgid "https://codeberg.org/elpatron/datecalc"
+msgstr "https://codeberg.org/elpatron/datecalc"
+
+#: templates/index.html:19
+msgid "/static/logo.svg"
+msgstr "/static/logo.svg"
+
+#: templates/index.html:20
+msgid "width=device-width, initial-scale=1"
+msgstr "width=device-width, initial-scale=1"
+
+#: templates/index.html:21
+msgid "true"
+msgstr "true"
+
+#: templates/index.html:22
+msgid "yes"
+msgstr "yes"
+
+#: templates/index.html:23
+msgid "default"
+msgstr "default"
+
+#: templates/index.html:24
+msgid "telephone=no"
+msgstr "telephone=no"
+
+#: templates/index.html:25
+msgid "IE=edge"
+msgstr "IE=edge"
+
+#: templates/index.html:26
+msgid "Elpatrons Datumsrechner"
+msgstr "Elpatrons Datumsrechner"
+
+#: templates/index.html:27
+msgid "#2563eb"
+msgstr "#2563eb"
+
+#: templates/index.html:28
+msgid "/static/favicon.ico"
+msgstr "/static/favicon.ico"
+
+#: templates/index.html:29
+msgid "Hilfe anzeigen"
+msgstr "Hilfe anzeigen"
+
+#: templates/index.html:30
+msgid "Hilfe anzeigen"
+msgstr "Hilfe anzeigen"
+
+#: templates/index.html:31
+msgid "Öffnet ein Hilfefenster mit Informationen über den Datumsrechner"
+msgstr "Öffnet ein Hilfefenster mit Informationen über den Datumsrechner"
+
+#: templates/index.html:32
+msgid "Elpatrons"
+msgstr "Elpatrons"
+
+#: templates/index.html:33
+msgid "Datumsrechner"
+msgstr "Datumsrechner"
+
+#: templates/index.html:34
+msgid "Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>."
+msgstr "Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>."
+
+#: templates/index.html:35
+msgid "Anzahl der Tage/Werktage zwischen zwei Daten"
+msgstr "Anzahl der Tage/Werktage zwischen zwei Daten"
+
+#: templates/index.html:36
+msgid "Startdatum:"
+msgstr "Startdatum:"
+
+#: templates/index.html:37
+msgid "Heute"
+msgstr "Heute"
+
+#: templates/index.html:38
+msgid "Enddatum:"
+msgstr "Enddatum:"
+
+#: templates/index.html:39
+msgid "Optionen"
+msgstr "Optionen"
+
+#: templates/index.html:40
+msgid "Nur Werktage"
+msgstr "Nur Werktage"
+
+#: templates/index.html:41
+msgid "Feiertage berücksichtigen für:"
+msgstr "Feiertage berücksichtigen für:"
+
+#: templates/index.html:42
+msgid "(kein Bundesland)"
+msgstr "(kein Bundesland)"
+
+#: templates/index.html:43
+msgid "Baden-Württemberg"
+msgstr "Baden-Württemberg"
+
+#: templates/index.html:44
+msgid "Bayern"
+msgstr "Bayern"
+
+#: templates/index.html:45
+msgid "Berlin"
+msgstr "Berlin"
+
+#: templates/index.html:46
+msgid "Brandenburg"
+msgstr "Brandenburg"
+
+#: templates/index.html:47
+msgid "Bremen"
+msgstr "Bremen"
+
+#: templates/index.html:48
+msgid "Hamburg"
+msgstr "Hamburg"
+
+#: templates/index.html:49
+msgid "Hessen"
+msgstr "Hessen"
+
+#: templates/index.html:50
+msgid "Mecklenburg-Vorpommern"
+msgstr "Mecklenburg-Vorpommern"
+
+#: templates/index.html:51
+msgid "Niedersachsen"
+msgstr "Niedersachsen"
+
+#: templates/index.html:52
+msgid "Nordrhein-Westfalen"
+msgstr "Nordrhein-Westfalen"
+
+#: templates/index.html:53
+msgid "Rheinland-Pfalz"
+msgstr "Rheinland-Pfalz"
+
+#: templates/index.html:54
+msgid "Saarland"
+msgstr "Saarland"
+
+#: templates/index.html:55
+msgid "Sachsen"
+msgstr "Sachsen"
+
+#: templates/index.html:56
+msgid "Sachsen-Anhalt"
+msgstr "Sachsen-Anhalt"
+
+#: templates/index.html:57
+msgid "Schleswig-Holstein"
+msgstr "Schleswig-Holstein"
+
+#: templates/index.html:58
+msgid "Thüringen"
+msgstr "Thüringen"
+
+#: templates/index.html:59
+msgid "Berechnen"
+msgstr "Berechnen"
+
+#: templates/index.html:60
+msgid "Ergebnis vorlesen"
+msgstr "Ergebnis vorlesen"
+
+#: templates/index.html:61
+msgid "Ergebnis vorlesen"
+msgstr "Ergebnis vorlesen"
+
+#: templates/index.html:62
+msgid "Anzahl der Werktage zwischen"
+msgstr "Anzahl der Werktage zwischen"
+
+#: templates/index.html:63
+msgid "und"
+msgstr "und"
+
+#: templates/index.html:64
+msgid "(Feiertage:"
+msgstr "(Feiertage:"
+
+#: templates/index.html:65
+msgid "Anzahl der Tage zwischen"
+msgstr "Anzahl der Tage zwischen"
+
+#: templates/index.html:66
+msgid "Davon sind"
+msgstr "Davon sind"
+
+#: templates/index.html:67
+msgid "Tage Wochenendtage."
+msgstr "Tage Wochenendtage."
+
+#: templates/index.html:68
+msgid "Feiertage (Mo-Fr,"
+msgstr "Feiertage (Mo-Fr,"
+
+#: templates/index.html:69
+msgid "Wochentag eines Datums"
+msgstr "Wochentag eines Datums"
+
+#: templates/index.html:70
+msgid "Datum:"
+msgstr "Datum:"
+
+#: templates/index.html:71
+msgid "Anzeigen"
+msgstr "Anzeigen"
+
+#: templates/index.html:72
+msgid "Wochentag von"
+msgstr "Wochentag von"
+
+#: templates/index.html:73
+msgid "Kalenderwoche eines Datums"
+msgstr "Kalenderwoche eines Datums"
+
+#: templates/index.html:74
+msgid "Kalenderwoche berechnen"
+msgstr "Kalenderwoche berechnen"
+
+#: templates/index.html:75
+msgid "Kalenderwoche von"
+msgstr "Kalenderwoche von"
+
+#: templates/index.html:76
+msgid "Start-/Enddatum zu Kalenderwoche"
+msgstr "Start-/Enddatum zu Kalenderwoche"
+
+#: templates/index.html:77
+msgid "Jahr:"
+msgstr "Jahr:"
+
+#: templates/index.html:78
+msgid "Kalenderwoche:"
+msgstr "Kalenderwoche:"
+
+#: templates/index.html:79
+msgid "Start-/Enddatum berechnen"
+msgstr "Start-/Enddatum berechnen"
+
+#: templates/index.html:80
+msgid "Start-/Enddatum der KW"
+msgstr "Start-/Enddatum der KW"
+
+#: templates/index.html:81
+msgid "im Jahr"
+msgstr "im Jahr"
+
+#: templates/index.html:82
+msgid "Datum plus/minus X Tage/Wochen/Monate"
+msgstr "Datum plus/minus X Tage/Wochen/Monate"
+
+#: templates/index.html:83
+msgid "Anzahl:"
+msgstr "Anzahl:"
+
+#: templates/index.html:84
+msgid "Rechenrichtung"
+msgstr "Rechenrichtung"
+
+#: templates/index.html:85
+msgid "addieren"
+msgstr "addieren"
+
+#: templates/index.html:86
+msgid "subtrahieren"
+msgstr "subtrahieren"
+
+#: templates/index.html:87
+msgid "Einheit und Werktage"
+msgstr "Einheit und Werktage"
+
+#: templates/index.html:88
+msgid "Einheit:"
+msgstr "Einheit:"
+
+#: templates/index.html:89
+msgid "Tage"
+msgstr "Tage"
+
+#: templates/index.html:90
+msgid "Wochen"
+msgstr "Wochen"
+
+#: templates/index.html:91
+msgid "Monate"
+msgstr "Monate"
+
+#: templates/index.html:92
+msgid "Nur Werktage"
+msgstr "Nur Werktage"
+
+#: templates/index.html:93
+msgid "Hilfe schließen"
+msgstr "Hilfe schließen"
+
+#: templates/index.html:94
+msgid "Was ist Elpatrons Datumsrechner?"
+msgstr "Was ist Elpatrons Datumsrechner?"
+
+#: templates/index.html:95
+msgid "Der Datumsrechner kann verschiedene Datumsberechnungen durchführen:"
+msgstr "Der Datumsrechner kann verschiedene Datumsberechnungen durchführen:"
+
+#: templates/index.html:96
+msgid "Anzahl der Tage zwischen zwei Daten"
+msgstr "Anzahl der Tage zwischen zwei Daten"
+
+#: templates/index.html:97
+msgid "Anzahl der Werktage zwischen zwei Daten"
+msgstr "Anzahl der Werktage zwischen zwei Daten"
+
+#: templates/index.html:98
+msgid "Anzeige des Wochentags eines Datums"
+msgstr "Anzeige des Wochentags eines Datums"
+
+#: templates/index.html:99
+msgid "Datum plus/minus X Tage"
+msgstr "Datum plus/minus X Tage"
+
+#: templates/index.html:100
+msgid "Datum plus/minus X Werktage"
+msgstr "Datum plus/minus X Werktage"
+
+#: templates/index.html:101
+msgid "Datum plus/minus X Wochen/Monate"
+msgstr "Datum plus/minus X Wochen/Monate"
+
+#: templates/index.html:102
+msgid "Kalenderwoche zu Datum"
+msgstr "Kalenderwoche zu Datum"
+
+#: templates/index.html:103
+msgid "Start-/Enddatum einer Kalenderwoche eines Jahres"
+msgstr "Start-/Enddatum einer Kalenderwoche eines Jahres"
+
+#: templates/index.html:104
+msgid "Online Datumsrechner gibt es bereits in einer Vielzahl, warum also noch einer?"
+msgstr "Online Datumsrechner gibt es bereits in einer Vielzahl, warum also noch einer?"
+
+#: templates/index.html:105
+msgid "Aus zwei Gründen:"
+msgstr "Aus zwei Gründen:"
+
+#: templates/index.html:106
+msgid "Finde mal einen Datumsrechner, der nicht vollkommen verseucht mit Werbung, Tracking und Cookies ist!"
+msgstr "Finde mal einen Datumsrechner, der nicht vollkommen verseucht mit Werbung, Tracking und Cookies ist!"
+
+#: templates/index.html:107
+msgid "Das hat mich so geärgert, dass ich meinen eigenen programmiert habe."
+msgstr "Das hat mich so geärgert, dass ich meinen eigenen programmiert habe."
+
+#: templates/index.html:108
+msgid "Genau genommen nicht ich selbst. Diese App wurde zum überwiegenden Teil von KI nach meinen Anweisungen entwickelt (Vibe Coding)."
+msgstr "Genau genommen nicht ich selbst. Diese App wurde zum überwiegenden Teil von KI nach meinen Anweisungen entwickelt (Vibe Coding)."
+
+#: templates/index.html:109
+msgid "Was du noch wissen solltest"
+msgstr "Was du noch wissen solltest"
+
+#: templates/index.html:110
+msgid "Ich habe versucht, die App möglichst barrierefrei zu gestalten, um Menschen mit Einschränkungen die Benutzung zu erleichtern."
+msgstr "Ich habe versucht, die App möglichst barrierefrei zu gestalten, um Menschen mit Einschränkungen die Benutzung zu erleichtern."
+
+#: templates/index.html:111
+msgid "Diese App schnüffelt dir nicht hinterher, sammelt keine persönlichen Daten und geht dir auch sonst (hoffentlich!) in keiner Weise auf die Nerven."
+msgstr "Diese App schnüffelt dir nicht hinterher, sammelt keine persönlichen Daten und geht dir auch sonst (hoffentlich!) in keiner Weise auf die Nerven."
+
+#: templates/index.html:112
+msgid "Den Quellcode dieser App habe ich auf"
+msgstr "Den Quellcode dieser App habe ich auf"
+
+#: templates/index.html:113
+msgid "veröffentlicht, du kannst ihn einsehen, verändern oder damit deinen eigenen kleinen Datumsrechner betreiben."
+msgstr "veröffentlicht, du kannst ihn einsehen, verändern oder damit deinen eigenen kleinen Datumsrechner betreiben."
+
+#: templates/index.html:114
+msgid "Die App läuft auf meinem kleinen Home-Server und ist derzeit nicht für große Besucherzahlen ausgelegt."
+msgstr "Die App läuft auf meinem kleinen Home-Server und ist derzeit nicht für große Besucherzahlen ausgelegt."
+
+#: templates/index.html:115
+msgid "Ich übernehme keine Gewähr für die Funktionalität und die Rechenergebnisse. Die KI, die das programmiert hat, übrigens auch nicht."
+msgstr "Ich übernehme keine Gewähr für die Funktionalität und die Rechenergebnisse. Die KI, die das programmiert hat, übrigens auch nicht."
+
+#: templates/index.html:116
+msgid "Falls du einen Fehler findest oder eine weitere Funktion wünschst, kannst du mir eine Mail schreiben (siehe Mailto Link in der Fußzeile)"
+msgstr "Falls du einen Fehler findest oder eine weitere Funktion wünschst, kannst du mir eine Mail schreiben (siehe Mailto Link in der Fußzeile)"
+
+#: templates/index.html:117
+msgid "Hab Spaß mit Elpatrons Datumsrechner! Dein M. Busche"
+msgstr "Hab Spaß mit Elpatrons Datumsrechner! Dein M. Busche"
+
+#: templates/index.html:118
+msgid "Hilfe-Informationen für den Datumsrechner mit Erklärungen zu allen Funktionen"
+msgstr "Hilfe-Informationen für den Datumsrechner mit Erklärungen zu allen Funktionen"
+
+#: templates/index.html:119
+msgid "Dies ist ein werbe- und trackingfreier"
+msgstr "Dies ist ein werbe- und trackingfreier"
+
+#: templates/index.html:120
+msgid "Open Source Datumsrechner"
+msgstr "Open Source Datumsrechner"
+
+#: templates/index.html:121
+msgid "REST API Dokumentation (Swagger)"
+msgstr "REST API Dokumentation (Swagger)"
+
+#: templates/index.html:122
+msgid "M. Busche"
+msgstr "M. Busche"
+
+#: app.py:123
+msgid "Ungültige Eingabe"
+msgstr "Ungültige Eingabe"
+
+#: app.py:124
+msgid "Nicht unterstützt: Werktage + Wochen."
+msgstr "Nicht unterstützt: Werktage + Wochen."
+
+#: app.py:125
+msgid "Nicht unterstützt: Werktage + Monate."
+msgstr "Nicht unterstützt: Werktage + Monate."
+
+#: templates/index.html:126
+msgid "Sprache auswählen"
+msgstr "Sprache auswählen"
+
+#: templates/index.html:127
+msgid "Deutsch auswählen"
+msgstr "Deutsch auswählen"
+
+#: templates/index.html:131
+msgid "English auswählen"
+msgstr "English auswählen" 

translations/en/LC_MESSAGES/messages.po

@@ -0,0 +1,483 @@
+# English translations for Elpatrons Datumsrechner.
+# Copyright (C) 2025 M. Busche
+# This file is distributed under the same license as the Elpatrons Datumsrechner package.
+msgid ""
+msgstr ""
+"Project-Id-Version: 1.3.13\n"
+"Report-Msgid-Bugs-To: elpatron@mailbox.org\n"
+"POT-Creation-Date: 2025-08-01 15:58+0100\n"
+"PO-Revision-Date: 2025-08-01 15:58+0100\n"
+"Last-Translator: M. Busche <elpatron@mailbox.org>\n"
+"Language: en\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+#: templates/index.html:12
+msgid "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+msgstr "Elpatrons Date Calculator – Open Source Calendar and Date Calculations"
+
+#: templates/index.html:13
+msgid "Elpatrons Datumsrechner: Open Source Web-App für Kalender- und Datumsberechnungen. Tage, Werktage, Wochen, Monate, Kalenderwochen, Wochentage und mehr berechnen – barrierefrei, werbefrei, trackingfrei, kostenlos."
+msgstr "Elpatrons Date Calculator: Open Source web app for calendar and date calculations. Calculate days, workdays, weeks, months, calendar weeks, weekdays and more – accessible, ad-free, tracking-free, free of charge."
+
+#: templates/index.html:14
+msgid "Datum, Kalender, Datumsrechner, Werktage, Tage zählen, Kalenderwoche, Wochentag, Open Source, Python, Flask, barrierefreiheit, barrierefrei, kostenlos, werbefrei, trackingfrei, cookiefrei"
+msgstr "Date, Calendar, Date Calculator, Workdays, Count Days, Calendar Week, Weekday, Open Source, Python, Flask, accessibility, accessible, free, ad-free, tracking-free, cookie-free"
+
+#: templates/index.html:15
+msgid "Elpatrons Datumsrechner – Open Source Kalender- und Datumsberechnungen"
+msgstr "Elpatrons Date Calculator – Open Source Calendar and Date Calculations"
+
+#: templates/index.html:16
+msgid "Open Source Web-App für Kalender- und Datumsberechnungen. Werbefrei, trackingfrei, kostenlos."
+msgstr "Open Source web app for calendar and date calculations. Ad-free, tracking-free, free of charge."
+
+#: templates/index.html:17
+msgid "website"
+msgstr "website"
+
+#: templates/index.html:18
+msgid "https://codeberg.org/elpatron/datecalc"
+msgstr "https://codeberg.org/elpatron/datecalc"
+
+#: templates/index.html:19
+msgid "/static/logo.svg"
+msgstr "/static/logo.svg"
+
+#: templates/index.html:20
+msgid "width=device-width, initial-scale=1"
+msgstr "width=device-width, initial-scale=1"
+
+#: templates/index.html:21
+msgid "true"
+msgstr "true"
+
+#: templates/index.html:22
+msgid "yes"
+msgstr "yes"
+
+#: templates/index.html:23
+msgid "default"
+msgstr "default"
+
+#: templates/index.html:24
+msgid "telephone=no"
+msgstr "telephone=no"
+
+#: templates/index.html:25
+msgid "IE=edge"
+msgstr "IE=edge"
+
+#: templates/index.html:26
+msgid "Elpatrons Datumsrechner"
+msgstr "Elpatrons Date Calculator"
+
+#: templates/index.html:27
+msgid "#2563eb"
+msgstr "#2563eb"
+
+#: templates/index.html:28
+msgid "/static/favicon.ico"
+msgstr "/static/favicon.ico"
+
+#: templates/index.html:29
+msgid "Hilfe anzeigen"
+msgstr "Show Help"
+
+#: templates/index.html:30
+msgid "Hilfe anzeigen"
+msgstr "Show Help"
+
+#: templates/index.html:31
+msgid "Öffnet ein Hilfefenster mit Informationen über den Datumsrechner"
+msgstr "Opens a help window with information about the date calculator"
+
+#: templates/index.html:32
+msgid "Elpatrons"
+msgstr "Elpatrons"
+
+#: templates/index.html:33
+msgid "Datumsrechner"
+msgstr "Date Calculator"
+
+#: templates/index.html:34
+msgid "Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>."
+msgstr "A <em>free</em> web app: <em>accessible</em>, <em>ad-free</em>, <em>tracking-free</em>, <em>license-free</em> and <em>cost-free</em>."
+
+#: templates/index.html:35
+msgid "Anzahl der Tage/Werktage zwischen zwei Daten"
+msgstr "Number of days/workdays between two dates"
+
+#: templates/index.html:36
+msgid "Startdatum:"
+msgstr "Start date:"
+
+#: templates/index.html:37
+msgid "Heute"
+msgstr "Today"
+
+#: templates/index.html:38
+msgid "Enddatum:"
+msgstr "End date:"
+
+#: templates/index.html:39
+msgid "Optionen"
+msgstr "Options"
+
+#: templates/index.html:40
+msgid "Nur Werktage"
+msgstr "Workdays only"
+
+#: templates/index.html:41
+msgid "Feiertage berücksichtigen für:"
+msgstr "Consider holidays for:"
+
+#: templates/index.html:42
+msgid "(kein Bundesland)"
+msgstr "(no state)"
+
+#: templates/index.html:43
+msgid "Baden-Württemberg"
+msgstr "Baden-Württemberg"
+
+#: templates/index.html:44
+msgid "Bayern"
+msgstr "Bavaria"
+
+#: templates/index.html:45
+msgid "Berlin"
+msgstr "Berlin"
+
+#: templates/index.html:46
+msgid "Brandenburg"
+msgstr "Brandenburg"
+
+#: templates/index.html:47
+msgid "Bremen"
+msgstr "Bremen"
+
+#: templates/index.html:48
+msgid "Hamburg"
+msgstr "Hamburg"
+
+#: templates/index.html:49
+msgid "Hessen"
+msgstr "Hesse"
+
+#: templates/index.html:50
+msgid "Mecklenburg-Vorpommern"
+msgstr "Mecklenburg-Vorpommern"
+
+#: templates/index.html:51
+msgid "Niedersachsen"
+msgstr "Lower Saxony"
+
+#: templates/index.html:52
+msgid "Nordrhein-Westfalen"
+msgstr "North Rhine-Westphalia"
+
+#: templates/index.html:53
+msgid "Rheinland-Pfalz"
+msgstr "Rhineland-Palatinate"
+
+#: templates/index.html:54
+msgid "Saarland"
+msgstr "Saarland"
+
+#: templates/index.html:55
+msgid "Sachsen"
+msgstr "Saxony"
+
+#: templates/index.html:56
+msgid "Sachsen-Anhalt"
+msgstr "Saxony-Anhalt"
+
+#: templates/index.html:57
+msgid "Schleswig-Holstein"
+msgstr "Schleswig-Holstein"
+
+#: templates/index.html:58
+msgid "Thüringen"
+msgstr "Thuringia"
+
+#: templates/index.html:59
+msgid "Berechnen"
+msgstr "Calculate"
+
+#: templates/index.html:60
+msgid "Ergebnis vorlesen"
+msgstr "Read result aloud"
+
+#: templates/index.html:61
+msgid "Ergebnis vorlesen"
+msgstr "Read result aloud"
+
+#: templates/index.html:62
+msgid "Anzahl der Werktage zwischen"
+msgstr "Number of workdays between"
+
+#: templates/index.html:63
+msgid "und"
+msgstr "and"
+
+#: templates/index.html:64
+msgid "(Feiertage:"
+msgstr "(Holidays:"
+
+#: templates/index.html:65
+msgid "Anzahl der Tage zwischen"
+msgstr "Number of days between"
+
+#: templates/index.html:66
+msgid "Davon sind"
+msgstr "Of which"
+
+#: templates/index.html:67
+msgid "Tage Wochenendtage."
+msgstr "days are weekend days."
+
+#: templates/index.html:68
+msgid "Feiertage (Mo-Fr,"
+msgstr "holidays (Mon-Fri,"
+
+#: templates/index.html:69
+msgid "Wochentag eines Datums"
+msgstr "Weekday of a date"
+
+#: templates/index.html:70
+msgid "Datum:"
+msgstr "Date:"
+
+#: templates/index.html:71
+msgid "Anzeigen"
+msgstr "Show"
+
+#: templates/index.html:72
+msgid "Wochentag von"
+msgstr "Weekday of"
+
+#: templates/index.html:73
+msgid "Kalenderwoche eines Datums"
+msgstr "Calendar week of a date"
+
+#: templates/index.html:74
+msgid "Kalenderwoche berechnen"
+msgstr "Calculate calendar week"
+
+#: templates/index.html:75
+msgid "Kalenderwoche von"
+msgstr "Calendar week of"
+
+#: templates/index.html:76
+msgid "Start-/Enddatum zu Kalenderwoche"
+msgstr "Start/end date to calendar week"
+
+#: templates/index.html:77
+msgid "Jahr:"
+msgstr "Year:"
+
+#: templates/index.html:78
+msgid "Kalenderwoche:"
+msgstr "Calendar week:"
+
+#: templates/index.html:79
+msgid "Start-/Enddatum berechnen"
+msgstr "Calculate start/end date"
+
+#: templates/index.html:80
+msgid "Start-/Enddatum der KW"
+msgstr "Start/end date of week"
+
+#: templates/index.html:81
+msgid "im Jahr"
+msgstr "in year"
+
+#: templates/index.html:82
+msgid "Datum plus/minus X Tage/Wochen/Monate"
+msgstr "Date plus/minus X days/weeks/months"
+
+#: templates/index.html:83
+msgid "Anzahl:"
+msgstr "Amount:"
+
+#: templates/index.html:84
+msgid "Rechenrichtung"
+msgstr "Calculation direction"
+
+#: templates/index.html:85
+msgid "addieren"
+msgstr "add"
+
+#: templates/index.html:86
+msgid "subtrahieren"
+msgstr "subtract"
+
+#: templates/index.html:87
+msgid "Einheit und Werktage"
+msgstr "Unit and workdays"
+
+#: templates/index.html:88
+msgid "Einheit:"
+msgstr "Unit:"
+
+#: templates/index.html:89
+msgid "Tage"
+msgstr "Days"
+
+#: templates/index.html:90
+msgid "Wochen"
+msgstr "Weeks"
+
+#: templates/index.html:91
+msgid "Monate"
+msgstr "Months"
+
+#: templates/index.html:92
+msgid "Nur Werktage"
+msgstr "Workdays only"
+
+#: templates/index.html:93
+msgid "Hilfe schließen"
+msgstr "Close help"
+
+#: templates/index.html:94
+msgid "Was ist Elpatrons Datumsrechner?"
+msgstr "What is Elpatrons Date Calculator?"
+
+#: templates/index.html:95
+msgid "Der Datumsrechner kann verschiedene Datumsberechnungen durchführen:"
+msgstr "The date calculator can perform various date calculations:"
+
+#: templates/index.html:96
+msgid "Anzahl der Tage zwischen zwei Daten"
+msgstr "Number of days between two dates"
+
+#: templates/index.html:97
+msgid "Anzahl der Werktage zwischen zwei Daten"
+msgstr "Number of workdays between two dates"
+
+#: templates/index.html:98
+msgid "Anzeige des Wochentags eines Datums"
+msgstr "Display of the weekday of a date"
+
+#: templates/index.html:99
+msgid "Datum plus/minus X Tage"
+msgstr "Date plus/minus X days"
+
+#: templates/index.html:100
+msgid "Datum plus/minus X Werktage"
+msgstr "Date plus/minus X workdays"
+
+#: templates/index.html:101
+msgid "Datum plus/minus X Wochen/Monate"
+msgstr "Date plus/minus X weeks/months"
+
+#: templates/index.html:102
+msgid "Kalenderwoche zu Datum"
+msgstr "Calendar week to date"
+
+#: templates/index.html:103
+msgid "Start-/Enddatum einer Kalenderwoche eines Jahres"
+msgstr "Start/end date of a calendar week of a year"
+
+#: templates/index.html:104
+msgid "Online Datumsrechner gibt es bereits in einer Vielzahl, warum also noch einer?"
+msgstr "Online date calculators already exist in abundance, so why another one?"
+
+#: templates/index.html:105
+msgid "Aus zwei Gründen:"
+msgstr "For two reasons:"
+
+#: templates/index.html:106
+msgid "Finde mal einen Datumsrechner, der nicht vollkommen verseucht mit Werbung, Tracking und Cookies ist!"
+msgstr "Try to find a date calculator that isn't completely infested with ads, tracking and cookies!"
+
+#: templates/index.html:107
+msgid "Das hat mich so geärgert, dass ich meinen eigenen programmiert habe."
+msgstr "This annoyed me so much that I programmed my own."
+
+#: templates/index.html:108
+msgid "Genau genommen nicht ich selbst. Diese App wurde zum überwiegenden Teil von KI nach meinen Anweisungen entwickelt (Vibe Coding)."
+msgstr "Actually not me myself. This app was developed largely by AI following my instructions (Vibe Coding)."
+
+#: templates/index.html:109
+msgid "Was du noch wissen solltest"
+msgstr "What else you should know"
+
+#: templates/index.html:110
+msgid "Ich habe versucht, die App möglichst barrierefrei zu gestalten, um Menschen mit Einschränkungen die Benutzung zu erleichtern."
+msgstr "I have tried to make the app as accessible as possible to make it easier for people with disabilities to use."
+
+#: templates/index.html:111
+msgid "Diese App schnüffelt dir nicht hinterher, sammelt keine persönlichen Daten und geht dir auch sonst (hoffentlich!) in keiner Weise auf die Nerven."
+msgstr "This app doesn't spy on you, doesn't collect personal data and doesn't get on your nerves in any other way (hopefully!)."
+
+#: templates/index.html:112
+msgid "Den Quellcode dieser App habe ich auf"
+msgstr "I have published the source code of this app on"
+
+#: templates/index.html:113
+msgid "veröffentlicht, du kannst ihn einsehen, verändern oder damit deinen eigenen kleinen Datumsrechner betreiben."
+msgstr "you can view it, modify it or use it to run your own small date calculator."
+
+#: templates/index.html:114
+msgid "Die App läuft auf meinem kleinen Home-Server und ist derzeit nicht für große Besucherzahlen ausgelegt."
+msgstr "The app runs on my small home server and is currently not designed for large visitor numbers."
+
+#: templates/index.html:115
+msgid "Ich übernehme keine Gewähr für die Funktionalität und die Rechenergebnisse. Die KI, die das programmiert hat, übrigens auch nicht."
+msgstr "I do not guarantee the functionality and calculation results. By the way, neither does the AI that programmed this."
+
+#: templates/index.html:116
+msgid "Falls du einen Fehler findest oder eine weitere Funktion wünschst, kannst du mir eine Mail schreiben (siehe Mailto Link in der Fußzeile)"
+msgstr "If you find a bug or want an additional feature, you can write me an email (see mailto link in the footer)"
+
+#: templates/index.html:117
+msgid "Hab Spaß mit Elpatrons Datumsrechner! Dein M. Busche"
+msgstr "Have fun with Elpatrons Date Calculator! Yours, M. Busche"
+
+#: templates/index.html:118
+msgid "Hilfe-Informationen für den Datumsrechner mit Erklärungen zu allen Funktionen"
+msgstr "Help information for the date calculator with explanations of all functions"
+
+#: templates/index.html:119
+msgid "Dies ist ein werbe- und trackingfreier"
+msgstr "This is an ad- and tracking-free"
+
+#: templates/index.html:120
+msgid "Open Source Datumsrechner"
+msgstr "Open Source Date Calculator"
+
+#: templates/index.html:121
+msgid "REST API Dokumentation (Swagger)"
+msgstr "REST API Documentation (Swagger)"
+
+#: templates/index.html:122
+msgid "M. Busche"
+msgstr "M. Busche"
+
+#: app.py:123
+msgid "Ungültige Eingabe"
+msgstr "Invalid input"
+
+#: app.py:124
+msgid "Nicht unterstützt: Werktage + Wochen."
+msgstr "Not supported: Workdays + weeks."
+
+#: app.py:125
+msgid "Nicht unterstützt: Werktage + Monate."
+msgstr "Not supported: Workdays + months."
+
+#: templates/index.html:126
+msgid "Sprache auswählen"
+msgstr "Select language"
+
+#: templates/index.html:127
+msgid "Deutsch auswählen"
+msgstr "Select German"
+
+#: templates/index.html:131
+msgid "English auswählen"
+msgstr "Select English"