From c899139fdd5f7b1c53387dbb10b3babcad54c271 Mon Sep 17 00:00:00 2001
From: Lars Gebhardt-Kusche <lars@kusche.berlin>
Date: Sat, 22 Nov 2025 03:29:31 +0100
Subject: [PATCH] =?UTF-8?q?=C3=A4dnerung?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 partials/structure/header.php | 65 +++++++++++++++++++++++++----------
 1 file changed, 46 insertions(+), 19 deletions(-)

diff --git a/partials/structure/header.php b/partials/structure/header.php
index 763ce67..f69393e 100644
--- a/partials/structure/header.php
+++ b/partials/structure/header.php
@@ -6,13 +6,13 @@ $scheme  = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') ? 'https'
 $host    = $_SERVER['HTTP_HOST'] ?? 'usbcheck.it';
 $baseUrl = $scheme . '://' . $host;
 
-// Falls navAnchors nicht gesetzt sind → leeres Array
+// Wenn $navAnchors NICHT gesetzt ist → leeres Array
 if (!isset($navAnchors) || !is_array($navAnchors)) {
     $navAnchors = [];
 }
 
 // Session sollte in config/fileload.php bereits gestartet sein.
-// Fallback:
+// Falls nicht, hier Fallback:
 if (session_status() !== PHP_SESSION_ACTIVE) {
     @session_start();
 }
@@ -50,7 +50,7 @@ if ($isLoggedIn) {
 
         <!-- Logo -->
         <div class="flex items-center gap-3">
-            <a href="/?lang=<?= htmlspecialchars($lang) ?>" class="flex items-center gap-3">
+            <a href="/?lang=<?= htmlspecialchars($lang ?? 'de') ?>" class="flex items-center gap-3">
                 <img src="<?= $baseUrl ?>/assets/img/logo_slogan.png"
                      alt="usbcheck.it Logo"
                      class="h-9 w-auto">
@@ -66,11 +66,11 @@ if ($isLoggedIn) {
             </a>
         </div>
 
-        <!-- Navigation / Controls -->
+        <!-- Navigation + Controls -->
         <div class="flex items-center gap-6">
 
             <!-- Hauptnavigation -->
-            <nav class="md:flex items-center gap-6 text-xs font-medium text-brand-muted uppercase tracking-[0.18em]">
+            <nav class="hidden md:flex items-center gap-6 text-xs font-medium text-brand-muted uppercase tracking-[0.18em]">
                 <?php foreach ($navAnchors as $item): ?>
                     <a href="<?= htmlspecialchars($item['href']) ?>"
                        class="hover:text-brand-primary transition-colors"
@@ -84,14 +84,14 @@ if ($isLoggedIn) {
                 <button id="langCurrent"
                         type="button"
                         class="flex items-center gap-1 text-xs uppercase tracking-[0.18em] text-brand-muted hover:text-brand-primary transition">
-                    <span id="langCurrentLabel"><?= strtoupper($lang) ?></span>
+                    <span id="langCurrentLabel"><?= strtoupper($lang ?? 'de') ?></span>
                     <svg class="w-3 h-3 opacity-70" viewBox="0 0 20 20" aria-hidden="true">
                         <path d="M5 7l5 6 5-6" fill="currentColor" />
                     </svg>
                 </button>
 
                 <div id="langMenu"
-                     class="hidden absolute right-0 mt-2 w-20 rounded-xl bg-brand-surface border border-brand-border shadow-lg py-1 text-xs">
+                     class="hidden absolute right-0 mt-2 w-24 rounded-xl bg-brand-surface border border-brand-border shadow-lg py-1 text-xs z-40">
                     <button type="button"
                             class="lang-pill flex items-center gap-2 w-full text-left px-3 py-1.5 uppercase tracking-[0.18em] text-brand-muted hover:text-brand-primary hover:bg-brand-bg/60"
                             data-lang="de">
@@ -124,39 +124,66 @@ if ($isLoggedIn) {
                 <?php if (!$isLoggedIn): ?>
                     <!-- Nicht eingeloggt: Login-Button -->
                     <button id="loginButton"
+                            type="button"
                             class="relative inline-flex items-center justify-center rounded-full bg-brand-primary px-4 py-1.5 text-xs font-semibold uppercase tracking-[0.18em] text-brand-bg shadow-soft hover:bg-cyan-400 transition-colors"
                             data-i18n="header_btn_login">
                         Login
                     </button>
                 <?php else: ?>
-                    <!-- Eingeloggt: Avatar + Menü -->
+                    <!-- Eingeloggt: Avatar + Dropdown -->
                     <button id="userAvatar"
+                            type="button"
                             class="h-9 w-9 rounded-full border border-brand-border bg-brand-surface flex items-center justify-center text-xs font-semibold text-brand-text shadow-soft hover:border-brand-primary transition"
-                            aria-haspopup="true"
+                            aria-label="Mein Konto"
                             aria-expanded="false"
-                            aria-label="Mein Konto">
+                            aria-haspopup="true">
                         <span><?= htmlspecialchars($userInitials) ?></span>
                     </button>
 
                     <div id="userMenu"
-                         class="hidden absolute right-0 mt-2 w-44 rounded-xl bg-brand-surface border border-brand-border shadow-lg py-1 text-xs">
-                        <a href="/dashboard/?lang=<?= urlencode($lang) ?>"
-                           class="flex items-center justify-between px-3 py-2 hover:bg-brand-bg/60 text-brand-muted hover:text-brand-primary transition-colors"
+                         class="hidden absolute right-0 mt-2 w-44 rounded-xl bg-brand-surface border border-brand-border shadow-lg py-1 text-xs z-40">
+                        <a href="/dashboard/?lang=<?= htmlspecialchars($lang ?? 'de') ?>"
+                           class="flex items-center gap-2 px-3 py-2 text-brand-muted hover:text-brand-primary hover:bg-brand-bg/60 transition-colors"
                            data-i18n="header_menu_dashboard">
-                            <span>Dashboard</span>
+                            Dashboard
                         </a>
-
                         <button type="button"
+                                class="flex items-center gap-2 w-full text-left px-3 py-2 text-brand-muted hover:text-red-400 hover:bg-red-500/10 transition-colors"
                                 data-logout-link="true"
-                                data-logout-href="/auth/logout?lang=<?= urlencode($lang) ?>"
-                                class="flex w-full items-center justify-between px-3 py-2 hover:bg-red-500/10 text-brand-muted hover:text-red-400 transition-colors"
+                                data-logout-href="/auth/logout?lang=<?= htmlspecialchars($lang ?? 'de') ?>"
                                 data-i18n="header_menu_logout">
-                            <span>Logout</span>
+                            Logout
                         </button>
                     </div>
                 <?php endif; ?>
             </div>
-
         </div>
     </div>
 </header>
+
+<!-- Logout-Modal -->
+<div id="logoutModalBackdrop"
+     class="hidden fixed inset-0 z-50 flex items-center justify-center bg-black/60">
+    <div class="w-full max-w-sm rounded-2xl border border-brand-border bg-brand-surface/95 shadow-soft p-6 space-y-4">
+        <h2 class="font-heading text-lg font-semibold text-white" data-i18n="logout_title">
+            Wirklich abmelden?
+        </h2>
+        <p class="text-sm text-brand-muted" data-i18n="logout_text">
+            Du wirst von deinem USBCheck-Konto abgemeldet. Aktive Tests im Browser-Modus sind davon nicht betroffen.
+        </p>
+        <div class="flex justify-end gap-3 pt-2">
+            <button id="logoutCancel"
+                    type="button"
+                    class="px-4 py-2 rounded-full border border-brand-border text-xs font-semibold uppercase tracking-[0.18em] text-brand-muted hover:text-brand-primary hover:border-brand-primary transition-colors"
+                    data-i18n="logout_cancel">
+                Abbrechen
+            </button>
+            <button id="logoutConfirm"
+                    type="button"
+                    class="px-4 py-2 rounded-full bg-red-500 text-xs font-semibold uppercase tracking-[0.18em] text-white hover:bg-red-400 transition-colors"
+                    data-i18n="logout_confirm">
+                Ja, abmelden
+            </button>
+        </div>
+    </div>
+</div>