secu menu

This commit is contained in:
2026-04-13 11:18:11 +02:00
parent 0412b60b97
commit 30599de125
+29 -23
View File
@@ -6,7 +6,6 @@ require_once __DIR__ . '/includes/i18n.php';
/** /**
* Génère une URL avec le paramètre de langue mis à jour * Génère une URL avec le paramètre de langue mis à jour
* sans perdre les autres paramètres (ex: id, tab, etc.)
*/ */
function getLangUrl($newLang) { function getLangUrl($newLang) {
$params = $_GET; $params = $_GET;
@@ -16,7 +15,7 @@ function getLangUrl($newLang) {
$pageTitle = $pageTitle ?? "PachaFamily"; $pageTitle = $pageTitle ?? "PachaFamily";
$activePage = $activePage ?? ""; $activePage = $activePage ?? "";
$currentLang = $_SESSION['app_lang'] ?? 'fr'; // Récupération de la langue active $currentLang = $_SESSION['app_lang'] ?? 'fr';
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="<?= htmlspecialchars($currentLang) ?>"> <html lang="<?= htmlspecialchars($currentLang) ?>">
@@ -30,12 +29,20 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr'; // Récupération de la langue act
<?php if (!empty($pageCss)): ?> <?php if (!empty($pageCss)): ?>
<link rel="stylesheet" href="<?= htmlspecialchars($pageCss) ?>"> <link rel="stylesheet" href="<?= htmlspecialchars($pageCss) ?>">
<?php endif; ?> <?php endif; ?>
<style>
/* Patch CSS pour la zone droite de l'en-tête (Desktop / Mobile) */
.pf-header-right { display: flex; align-items: center; gap: 15px; }
@media (max-width: 768px) {
.pf-desktop-actions { display: none !important; }
}
</style>
</head> </head>
<body class="<?= htmlspecialchars($bodyClass ?? '') ?>"> <body class="<?= htmlspecialchars($bodyClass ?? '') ?>">
<header class="pf-header"> <header class="pf-header">
<a href="/index.php" class="pf-logo">PachaFamily</a> <a href="/index.php" class="pf-logo">PachaFamily</a>
<?php if (isset($_SESSION['user'])): ?>
<nav class="pf-nav"> <nav class="pf-nav">
<a href="/index.php" class="pf-nav-link <?= $activePage === 'home' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_home') ?></a> <a href="/index.php" class="pf-nav-link <?= $activePage === 'home' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_home') ?></a>
<a href="/family-calendar.php" class="pf-nav-link <?= $activePage === 'family-calendar' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_calendar') ?></a> <a href="/family-calendar.php" class="pf-nav-link <?= $activePage === 'family-calendar' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_calendar') ?></a>
@@ -43,59 +50,58 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr'; // Récupération de la langue act
<a href="/holidays.php" class="pf-nav-link <?= $activePage === 'holidays' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_holidays') ?></a> <a href="/holidays.php" class="pf-nav-link <?= $activePage === 'holidays' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_holidays') ?></a>
<a href="/gift-list.php" class="pf-nav-link <?= $activePage === 'gift-list' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_gifts') ?></a> <a href="/gift-list.php" class="pf-nav-link <?= $activePage === 'gift-list' ? 'pf-nav-link--active' : '' ?>"><?= tr('menu_gifts') ?></a>
</nav> </nav>
<?php endif; ?>
<div class="pf-header-actions"> <div class="pf-header-right">
<div style="display: flex; align-items: center; gap: 8px; margin-right: 15px; border-right: 1px solid #cbd5e1; padding-right: 15px;">
<a href="<?= getLangUrl('fr') ?>" style="text-decoration:none; font-weight:bold; color: <?= $currentLang === 'fr' ? '#2563eb' : '#94a3b8' ?>;" title="Français">FR</a> <div style="display: flex; align-items: center; gap: 8px;">
<a href="<?= getLangUrl('fr') ?>" style="text-decoration:none; font-weight:bold; font-size:1rem; color: <?= $currentLang === 'fr' ? '#2563eb' : '#94a3b8' ?>;" title="Français">FR</a>
<span style="color: #cbd5e1;">|</span> <span style="color: #cbd5e1;">|</span>
<a href="<?= getLangUrl('ca') ?>" style="text-decoration:none; font-weight:bold; color: <?= $currentLang === 'ca' ? '#f59e0b' : '#94a3b8' ?>;" title="Català">CA</a> <a href="<?= getLangUrl('ca') ?>" style="text-decoration:none; font-weight:bold; font-size:1rem; color: <?= $currentLang === 'ca' ? '#f59e0b' : '#94a3b8' ?>;" title="Català">CA</a>
</div> </div>
<?php if (isset($_SESSION['user'])): ?> <?php if (isset($_SESSION['user'])): ?>
<div class="pf-desktop-actions" style="display: flex; align-items: center; gap: 10px; border-left: 1px solid #cbd5e1; padding-left: 15px;">
<div class="pf-user-badge"> <div class="pf-user-badge">
<?= htmlspecialchars($_SESSION['user']['display_name'] ?? $_SESSION['user']['username']) ?> <?= htmlspecialchars($_SESSION['user']['display_name'] ?? $_SESSION['user']['username']) ?>
</div> </div>
<a href="/logout.php" class="pf-logout-btn"><?= tr('btn_logout') ?></a> <a href="/logout.php" class="pf-logout-btn"><?= tr('btn_logout') ?></a>
</div>
<button class="pf-burger-btn" aria-label="<?= tr('aria_menu') ?>" style="margin-left: 5px;">☰</button>
<?php else: ?> <?php else: ?>
<a href="/login.php" class="pf-nav-link"><?= tr('btn_login') ?></a> <a href="/login.php" class="pf-nav-link" style="border-left: 1px solid #cbd5e1; padding-left: 15px; margin-left: 5px;"><?= tr('btn_login') ?></a>
<?php endif; ?> <?php endif; ?>
</div> </div>
<button class="pf-burger-btn" aria-label="<?= tr('aria_menu') ?>">☰</button>
</header> </header>
<?php if (isset($_SESSION['user'])): ?>
<div class="pf-mobile-menu"> <div class="pf-mobile-menu">
<div style="display: flex; justify-content: center; align-items: center; gap: 20px; padding: 15px 0; border-bottom: 1px solid #e2e8f0; margin-bottom: 10px;">
<a href="<?= getLangUrl('fr') ?>" style="text-decoration:none; font-size:1.2rem; font-weight:bold; color: <?= $currentLang === 'fr' ? '#2563eb' : '#94a3b8' ?>;">FR</a>
<span style="color: #cbd5e1; font-size:1.2rem;">|</span>
<a href="<?= getLangUrl('ca') ?>" style="text-decoration:none; font-size:1.2rem; font-weight:bold; color: <?= $currentLang === 'ca' ? '#f59e0b' : '#94a3b8' ?>;">CA</a>
</div>
<a href="/index.php" class="pf-mobile-nav-link"><?= tr('menu_home') ?></a> <a href="/index.php" class="pf-mobile-nav-link"><?= tr('menu_home') ?></a>
<a href="/family-calendar.php" class="pf-mobile-nav-link"><?= tr('menu_calendar') ?></a> <a href="/family-calendar.php" class="pf-mobile-nav-link"><?= tr('menu_calendar') ?></a>
<a href="/budget.php" class="pf-mobile-nav-link"><?= tr('menu_budget') ?></a> <a href="/budget.php" class="pf-mobile-nav-link"><?= tr('menu_budget') ?></a>
<a href="/holidays.php" class="pf-mobile-nav-link"><?= tr('menu_holidays') ?></a> <a href="/holidays.php" class="pf-mobile-nav-link"><?= tr('menu_holidays') ?></a>
<a href="/gift-list.php" class="pf-mobile-nav-link"><?= tr('menu_gifts') ?></a> <a href="/gift-list.php" class="pf-mobile-nav-link"><?= tr('menu_gifts') ?></a>
<hr style="width: 80%; border: 0; border-top: 1px solid #eee; margin: 10px 0;"> <hr style="width: 80%; border: 0; border-top: 1px solid #eee; margin: 10px 0;">
<?php if (isset($_SESSION['user'])): ?>
<a href="/logout.php" class="pf-mobile-nav-link pf-mobile-logout"><?= tr('btn_logout') ?></a> <a href="/logout.php" class="pf-mobile-nav-link pf-mobile-logout"><?= tr('btn_logout') ?></a>
<?php else: ?>
<a href="/login.php" class="pf-mobile-nav-link"><?= tr('btn_login') ?></a>
<?php endif; ?>
</div> </div>
<?php endif; ?>
<main class="pf-main"> <main class="pf-main">
<script> <script>
window.I18N_LANG = '<?= $currentLang === "ca" ? "ca-ES" : "fr-FR" ?>'; /**
* Pont d'Internationalisation pour le Javascript
*/
window.I18N = <?php echo json_encode($current_translations_array ?? []); ?>; window.I18N = <?php echo json_encode($current_translations_array ?? []); ?>;
function tr(key) { function tr(key) {
return window.I18N[key] || key; return window.I18N[key] || key;
} }
// Gestion du menu mobile // Gestion du menu mobile (Uniquement si le bouton Burger est présent dans le DOM)
<?php if (isset($_SESSION['user'])): ?>
const burgerBtn = document.querySelector('.pf-burger-btn'); const burgerBtn = document.querySelector('.pf-burger-btn');
const mobileMenu = document.querySelector('.pf-mobile-menu'); const mobileMenu = document.querySelector('.pf-mobile-menu');
@@ -104,7 +110,6 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr'; // Récupération de la langue act
const isOpen = mobileMenu.classList.toggle('is-open'); const isOpen = mobileMenu.classList.toggle('is-open');
burgerBtn.textContent = isOpen ? '✕' : '☰'; burgerBtn.textContent = isOpen ? '✕' : '☰';
// Bonus sécurité : empêcher le scroll si le menu est ouvert
if (isOpen) { if (isOpen) {
document.body.classList.add('no-scroll'); document.body.classList.add('no-scroll');
} else { } else {
@@ -112,4 +117,5 @@ $currentLang = $_SESSION['app_lang'] ?? 'fr'; // Récupération de la langue act
} }
}); });
} }
<?php endif; ?>
</script> </script>