perco/HouseHub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

settings correction
Deploy HouseHub / deploy (push) Successful in 1s
Details

Browse Source
This commit is contained in:
Cedric
2026-05-12 17:23:24 +02:00
parent fd53b33e9f
commit b3f320975b
2 changed files with 316 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
global.css
+266
View File
@@ -29,6 +29,17 @@
--shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-lg: --shadow-lg:
0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
/* Alertes / badges (clair) — paramètres & blocs similaires */
--alert-success-bg: #dcfce7;
--alert-success-border: #86efac;
--alert-success-text: #166534;
--alert-error-bg: #fee2e2;
--alert-error-border: #fca5a5;
--alert-error-text: #991b1b;
--invite-code-color: #1d4ed8;
--badge-admin-bg: #dbeafe;
--badge-admin-text: #1d4ed8;
} }
/* 🛡️ RESET MOBILE UNIVERSEL */ /* 🛡️ RESET MOBILE UNIVERSEL */
@@ -272,6 +283,252 @@ body.pf-home .pf-mobile-close-btn {
margin-bottom: 24px; margin-bottom: 24px;
} }
/* ═══ Paramètres & petits blocs réutilisables ═══ */
.pf-settings-page {
max-width: 680px;
margin: 32px auto;
padding: 0 16px;
}
.pf-settings-title {
font-size: 1.4rem;
font-weight: 700;
margin-bottom: 32px;
color: var(--text-main);
}
.pf-card-h2 {
font-size: 1rem;
font-weight: 700;
margin-bottom: 20px;
color: var(--text-main);
}
.pf-card-h2--tight {
margin-bottom: 6px;
}
.pf-muted-note {
color: var(--text-muted);
font-size: 0.85rem;
margin-bottom: 20px;
}
.pf-muted-note.pf-muted-note--tight {
margin-bottom: 8px;
}
.pf-muted-tiny {
color: var(--text-muted);
font-size: 0.8rem;
}
.pf-muted-inline {
color: var(--text-muted);
font-size: 0.85rem;
margin-left: 6px;
}
.pf-alert {
border-radius: 8px;
padding: 12px 16px;
margin-bottom: 24px;
}
.pf-alert--success {
background: var(--alert-success-bg);
border: 1px solid var(--alert-success-border);
color: var(--alert-success-text);
}
.pf-alert--error {
background: var(--alert-error-bg);
border: 1px solid var(--alert-error-border);
color: var(--alert-error-text);
}
.pf-lang-form {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.pf-btn--current-lang {
pointer-events: none;
}
.pf-stack-md {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 20px;
}
.pf-stack-sm {
display: flex;
flex-direction: column;
gap: 8px;
}
/* Tuile module (checkbox) — état coché via :has(), compatible thème */
.pf-module-tile {
display: flex;
align-items: center;
gap: 14px;
padding: 14px 16px;
border: 2px solid var(--border-light);
border-radius: 10px;
cursor: pointer;
background: var(--bg-page);
transition:
border-color 0.15s ease,
background 0.15s ease;
}
.pf-module-tile:has(input:checked) {
border-color: var(--primary);
background: var(--bg-soft);
}
.pf-checkbox-lg {
width: 18px;
height: 18px;
accent-color: var(--primary);
cursor: pointer;
flex-shrink: 0;
}
.pf-tile-icon {
font-size: 1.3rem;
line-height: 1;
}
.pf-tile-label {
font-weight: 600;
font-size: 0.95rem;
color: var(--text-main);
}
/* Encadré pointillé (code d’invitation, etc.) */
.pf-dashed-panel {
background: var(--bg-page);
border: 2px dashed var(--border-strong);
border-radius: 10px;
padding: 20px;
}
.pf-home-bg-preview {
margin-bottom: 16px;
border-radius: 10px;
overflow: hidden;
max-height: 160px;
position: relative;
}
.pf-home-bg-preview img {
width: 100%;
height: 160px;
object-fit: cover;
display: block;
}
.pf-badge-overlay {
position: absolute;
top: 8px;
right: 8px;
background: var(--bg-overlay);
color: var(--text-on-primary);
font-size: 0.75rem;
padding: 3px 8px;
border-radius: 6px;
}
.pf-inline-form-end {
display: flex;
align-items: flex-end;
gap: 10px;
flex-wrap: wrap;
}
.pf-inline-form-end .pf-form-group {
flex: 1;
min-width: 200px;
}
.pf-shrink-0 {
flex-shrink: 0;
}
.pf-mt-sm {
margin-top: 10px;
}
.pf-btn-sm-text {
font-size: 0.85rem;
}
.pf-mb-section {
margin-bottom: 20px;
}
.pf-invite-row {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.pf-invite-code {
font-size: 1.3rem;
font-weight: 700;
letter-spacing: 3px;
color: var(--invite-code-color);
cursor: pointer;
}
.pf-copy-msg {
color: var(--success);
font-size: 0.85rem;
opacity: 0;
transition: opacity 0.3s;
}
.pf-copy-msg.is-visible {
opacity: 1;
}
.pf-ml-auto {
margin-left: auto;
}
.pf-invite-footnote {
margin-top: 12px;
font-size: 0.8rem;
color: var(--text-muted);
}
.pf-member-card {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 14px;
background: var(--bg-page);
border-radius: 8px;
}
.pf-admin-badge {
background: var(--badge-admin-bg);
color: var(--badge-admin-text);
padding: 1px 7px;
border-radius: 8px;
font-size: 0.75rem;
font-weight: 600;
margin-left: 6px;
}
.pf-members-heading {
font-size: 0.95rem;
font-weight: 600;
margin: 20px 0 12px;
color: var(--text-main);
}
.pf-settings-admin-link {
text-align: center;
margin-top: 8px;
}
.pf-settings-admin-link a {
color: var(--primary);
font-size: 0.9rem;
}
.pf-input--disabled-muted:disabled {
background: var(--bg-page);
color: var(--text-muted);
}
.pf-flag-inline {
vertical-align: middle;
border-radius: 2px;
margin-right: 5px;
}
.pf-flex-gap-8 {
display: flex;
gap: 8px;
}
h1 { h1 {
font-size: 2rem; font-size: 2rem;
font-weight: 800; font-weight: 800;
@@ -726,6 +983,15 @@ p {
--border-strong: #484f58; --border-strong: #484f58;
--border-danger-soft: rgba(239,68,68,.3); --border-danger-soft: rgba(239,68,68,.3);
--focus-ring: rgba(59,130,246,.25); --focus-ring: rgba(59,130,246,.25);
--alert-success-bg: rgba(34, 197, 94, 0.12);
--alert-success-border: rgba(34, 197, 94, 0.45);
--alert-success-text: #86efac;
--alert-error-bg: rgba(239, 68, 68, 0.12);
--alert-error-border: rgba(248, 113, 113, 0.45);
--alert-error-text: #fca5a5;
--invite-code-color: #93c5fd;
--badge-admin-bg: rgba(59, 130, 246, 0.2);
--badge-admin-text: #93c5fd;
} }
[data-theme="dark"] body { background: var(--bg-page); color: var(--text-main); } [data-theme="dark"] body { background: var(--bg-page); color: var(--text-main); }
[data-theme="dark"] .pf-header { background: var(--bg-panel); border-color: var(--border-light); } [data-theme="dark"] .pf-header { background: var(--bg-panel); border-color: var(--border-light); }
settings.php
+50 -53
View File
@@ -136,24 +136,24 @@ $activePage = "settings";
require __DIR__ . '/header.php'; require __DIR__ . '/header.php';
?> ?>
<div class="pf-container" style="max-width:680px;margin:32px auto;padding:0 16px"> <div class="pf-container pf-settings-page">
<h1 style="font-size:1.4rem;font-weight:700;margin-bottom:32px">⚙️ Paramètres</h1> <h1 class="pf-settings-title">⚙️ Paramètres</h1>
<?php if ($success): ?> <?php if ($success): ?>
<div style="background:#dcfce7;border:1px solid #86efac;border-radius:8px;padding:12px 16px;margin-bottom:24px;color:#166534">✓ <?= htmlspecialchars($success) ?></div> <div class="pf-alert pf-alert--success">✓ <?= htmlspecialchars($success) ?></div>
<?php endif; ?> <?php endif; ?>
<?php if ($error): ?> <?php if ($error): ?>
<div style="background:#fee2e2;border:1px solid #fca5a5;border-radius:8px;padding:12px 16px;margin-bottom:24px;color:#991b1b">✗ <?= htmlspecialchars($error) ?></div> <div class="pf-alert pf-alert--error">✗ <?= htmlspecialchars($error) ?></div>
<?php endif; ?> <?php endif; ?>
<!-- ── Langue ─────────────────────────────────────────────────────────── --> <!-- ── Langue ─────────────────────────────────────────────────────────── -->
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:20px">🌐 Langue / Language</h2> <h2 class="pf-card-h2">🌐 Langue / Language</h2>
<form method="post" style="display:flex;gap:10px;flex-wrap:wrap"> <form method="post" class="pf-lang-form">
<input type="hidden" name="action" value="set_lang"> <input type="hidden" name="action" value="set_lang">
<?php <?php
$s = 'style="vertical-align:middle;border-radius:2px;margin-right:5px"'; $s = 'class="pf-flag-inline"';
$fr_flag = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" width="20" height="13" '.$s.'><rect width="6" height="12" fill="#002395"/><rect x="6" width="6" height="12" fill="#fff"/><rect x="12" width="6" height="12" fill="#ED2939"/></svg>'; $fr_flag = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" width="20" height="13" '.$s.'><rect width="6" height="12" fill="#002395"/><rect x="6" width="6" height="12" fill="#fff"/><rect x="12" width="6" height="12" fill="#ED2939"/></svg>';
$en_flag = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 30" width="20" height="13" '.$s.'><rect width="60" height="30" fill="#012169"/><path d="M0,0 L60,30 M60,0 L0,30" stroke="#fff" stroke-width="6"/><path d="M0,0 L60,30 M60,0 L0,30" stroke="#C8102E" stroke-width="4"/><path d="M30,0 V30 M0,15 H60" stroke="#fff" stroke-width="10"/><path d="M30,0 V30 M0,15 H60" stroke="#C8102E" stroke-width="6"/></svg>'; $en_flag = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 30" width="20" height="13" '.$s.'><rect width="60" height="30" fill="#012169"/><path d="M0,0 L60,30 M60,0 L0,30" stroke="#fff" stroke-width="6"/><path d="M0,0 L60,30 M60,0 L0,30" stroke="#C8102E" stroke-width="4"/><path d="M30,0 V30 M0,15 H60" stroke="#fff" stroke-width="10"/><path d="M30,0 V30 M0,15 H60" stroke="#C8102E" stroke-width="6"/></svg>';
$senyera = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" width="20" height="13" '.$s.'><rect width="18" height="12" fill="#FCDD09"/><rect y="1.33" width="18" height="1.33" fill="#DA121A"/><rect y="4" width="18" height="1.33" fill="#DA121A"/><rect y="6.67" width="18" height="1.33" fill="#DA121A"/><rect y="9.33" width="18" height="1.33" fill="#DA121A"/></svg>'; $senyera = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" width="20" height="13" '.$s.'><rect width="18" height="12" fill="#FCDD09"/><rect y="1.33" width="18" height="1.33" fill="#DA121A"/><rect y="4" width="18" height="1.33" fill="#DA121A"/><rect y="6.67" width="18" height="1.33" fill="#DA121A"/><rect y="9.33" width="18" height="1.33" fill="#DA121A"/></svg>';
@@ -166,8 +166,7 @@ require __DIR__ . '/header.php';
foreach ($langs as $code => $lang): foreach ($langs as $code => $lang):
?> ?>
<button type="submit" name="lang" value="<?= $code ?>" <button type="submit" name="lang" value="<?= $code ?>"
class="pf-btn <?= $currentLang === $code ? '' : 'btn-secondary' ?>" class="pf-btn <?= $currentLang === $code ? 'pf-btn--current-lang' : 'btn-secondary' ?>">
style="<?= $currentLang === $code ? 'pointer-events:none' : '' ?>">
<?= $lang['flag'] ?> <?= $lang['label'] ?> <?= $lang['flag'] ?> <?= $lang['label'] ?>
</button> </button>
<?php endforeach; ?> <?php endforeach; ?>
@@ -177,8 +176,8 @@ require __DIR__ . '/header.php';
<!-- ── Modules ────────────────────────────────────────────────────────── --> <!-- ── Modules ────────────────────────────────────────────────────────── -->
<?php if ($family_id): ?> <?php if ($family_id): ?>
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:6px">🧩 Modules actifs</h2> <h2 class="pf-card-h2 pf-card-h2--tight">🧩 Modules actifs</h2>
<p style="color:#64748b;font-size:0.85rem;margin-bottom:20px">Choisissez les modules visibles dans la navigation (partagé avec tous les membres de l'espace).</p> <p class="pf-muted-note">Choisissez les modules visibles dans la navigation (partagé avec tous les membres de l'espace).</p>
<?php <?php
$enabledMods = $_SESSION['enabled_modules'] ?? ['calendar','budget','holidays','gifts']; $enabledMods = $_SESSION['enabled_modules'] ?? ['calendar','budget','holidays','gifts'];
$allModules = [ $allModules = [
@@ -193,14 +192,12 @@ require __DIR__ . '/header.php';
?> ?>
<form method="post"> <form method="post">
<input type="hidden" name="action" value="set_modules"> <input type="hidden" name="action" value="set_modules">
<div style="display:flex;flex-direction:column;gap:12px;margin-bottom:20px"> <div class="pf-stack-md">
<?php foreach ($allModules as $key => $mod): $active = in_array($key, $enabledMods); ?> <?php foreach ($allModules as $key => $mod): $active = in_array($key, $enabledMods); ?>
<label style="display:flex;align-items:center;gap:14px;padding:14px 16px;border:2px solid <?= $active ? '#2563eb' : '#e2e8f0' ?>;border-radius:10px;cursor:pointer;background:<?= $active ? '#eff6ff' : '#f8fafc' ?>;transition:all .15s"> <label class="pf-module-tile">
<input type="checkbox" name="mod_<?= $key ?>" <?= $active ? 'checked' : '' ?> <input type="checkbox" name="mod_<?= $key ?>" <?= $active ? 'checked' : '' ?> class="pf-checkbox-lg">
style="width:18px;height:18px;accent-color:#2563eb;cursor:pointer" <span class="pf-tile-icon"><?= $mod['icon'] ?></span>
onchange="this.closest('label').style.borderColor=this.checked?'#2563eb':'#e2e8f0';this.closest('label').style.background=this.checked?'#eff6ff':'#f8fafc'"> <span class="pf-tile-label"><?= $mod['label'] ?></span>
<span style="font-size:1.3rem"><?= $mod['icon'] ?></span>
<span style="font-weight:600;font-size:0.95rem"><?= $mod['label'] ?></span>
</label> </label>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
@@ -216,29 +213,29 @@ require __DIR__ . '/header.php';
$has_custom_bg = $bg_file !== null; $has_custom_bg = $bg_file !== null;
?> ?>
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:6px">🖼️ Image d'accueil</h2> <h2 class="pf-card-h2 pf-card-h2--tight">🖼️ Image d'accueil</h2>
<p style="color:#64748b;font-size:0.85rem;margin-bottom:20px">Photo de fond affichée sur la page d'accueil (partagée avec tous les membres).</p> <p class="pf-muted-note">Photo de fond affichée sur la page d'accueil (partagée avec tous les membres).</p>
<?php if ($has_custom_bg): ?> <?php if ($has_custom_bg): ?>
<div style="margin-bottom:16px;border-radius:10px;overflow:hidden;max-height:160px;position:relative"> <div class="pf-home-bg-preview">
<img src="/home-bg.php" alt="Fond actuel" style="width:100%;height:160px;object-fit:cover"> <img src="/home-bg.php" alt="Fond actuel">
<span style="position:absolute;top:8px;right:8px;background:rgba(0,0,0,.55);color:#fff;font-size:.75rem;padding:3px 8px;border-radius:6px">Image personnalisée</span> <span class="pf-badge-overlay">Image personnalisée</span>
</div> </div>
<?php endif; ?> <?php endif; ?>
<form method="post" enctype="multipart/form-data" style="display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap"> <form method="post" enctype="multipart/form-data" class="pf-inline-form-end">
<input type="hidden" name="action" value="upload_home_bg"> <input type="hidden" name="action" value="upload_home_bg">
<div class="pf-form-group" style="flex:1;min-width:200px"> <div class="pf-form-group">
<label class="pf-label">Nouvelle image (jpg, png, webp — max 10 Mo)</label> <label class="pf-label">Nouvelle image (jpg, png, webp — max 10 Mo)</label>
<input type="file" name="home_bg" class="pf-input" accept="image/jpeg,image/png,image/webp" required> <input type="file" name="home_bg" class="pf-input" accept="image/jpeg,image/png,image/webp" required>
</div> </div>
<button type="submit" class="pf-btn" style="flex-shrink:0">Enregistrer</button> <button type="submit" class="pf-btn pf-shrink-0">Enregistrer</button>
</form> </form>
<?php if ($has_custom_bg): ?> <?php if ($has_custom_bg): ?>
<form method="post" style="margin-top:10px"> <form method="post" class="pf-mt-sm">
<input type="hidden" name="action" value="reset_home_bg"> <input type="hidden" name="action" value="reset_home_bg">
<button type="submit" class="pf-btn btn-secondary" style="font-size:.85rem" <button type="submit" class="pf-btn btn-secondary pf-btn-sm-text"
onclick="return confirm('Revenir à l\'image par défaut ?')">🔄 Remettre l'image par défaut</button> onclick="return confirm('Revenir à l\'image par défaut ?')">🔄 Remettre l'image par défaut</button>
</form> </form>
<?php endif; ?> <?php endif; ?>
@@ -247,12 +244,12 @@ require __DIR__ . '/header.php';
<!-- ── Profil ──────────────────────────────────────────────────────────── --> <!-- ── Profil ──────────────────────────────────────────────────────────── -->
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:20px">👤 Mon profil</h2> <h2 class="pf-card-h2">👤 Mon profil</h2>
<form method="post"> <form method="post">
<input type="hidden" name="action" value="update_profile"> <input type="hidden" name="action" value="update_profile">
<div class="pf-form-group"> <div class="pf-form-group">
<label class="pf-label">Nom d'utilisateur</label> <label class="pf-label">Nom d'utilisateur</label>
<input type="text" class="pf-input" value="<?= htmlspecialchars($user['username']) ?>" disabled style="background:#f8fafc;color:#94a3b8"> <input type="text" class="pf-input pf-input--disabled-muted" value="<?= htmlspecialchars($user['username']) ?>" disabled>
</div> </div>
<div class="pf-form-group"> <div class="pf-form-group">
<label class="pf-label">Prénom / Pseudo affiché</label> <label class="pf-label">Prénom / Pseudo affiché</label>
@@ -264,7 +261,7 @@ require __DIR__ . '/header.php';
<!-- ── Mot de passe ────────────────────────────────────────────────────── --> <!-- ── Mot de passe ────────────────────────────────────────────────────── -->
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:20px">🔒 Changer le mot de passe</h2> <h2 class="pf-card-h2">🔒 Changer le mot de passe</h2>
<form method="post"> <form method="post">
<input type="hidden" name="action" value="change_password"> <input type="hidden" name="action" value="change_password">
<div class="pf-form-group"> <div class="pf-form-group">
@@ -286,54 +283,54 @@ require __DIR__ . '/header.php';
<?php if ($family): ?> <?php if ($family): ?>
<!-- ── Espace familial ─────────────────────────────────────────────────── --> <!-- ── Espace familial ─────────────────────────────────────────────────── -->
<section class="pf-panel-card"> <section class="pf-panel-card">
<h2 style="font-size:1rem;font-weight:700;margin-bottom:20px">🏠 Mon espace familial</h2> <h2 class="pf-card-h2">🏠 Mon espace familial</h2>
<form method="post" style="margin-bottom:20px"> <form method="post" class="pf-mb-section">
<input type="hidden" name="action" value="update_family_name"> <input type="hidden" name="action" value="update_family_name">
<div class="pf-form-group"> <div class="pf-form-group">
<label class="pf-label">Nom de l'espace</label> <label class="pf-label">Nom de l'espace</label>
<div style="display:flex;gap:8px"> <div class="pf-flex-gap-8">
<input type="text" name="family_name" class="pf-input" value="<?= htmlspecialchars($family['name']) ?>" required> <input type="text" name="family_name" class="pf-input" value="<?= htmlspecialchars($family['name']) ?>" required>
<button type="submit" class="pf-btn" style="flex-shrink:0">Enregistrer</button> <button type="submit" class="pf-btn pf-shrink-0">Enregistrer</button>
</div> </div>
</div> </div>
</form> </form>
<!-- Code d'invitation --> <!-- Code d'invitation -->
<div style="background:#f8fafc;border:2px dashed #cbd5e1;border-radius:10px;padding:20px"> <div class="pf-dashed-panel">
<p style="font-size:0.85rem;color:#64748b;margin-bottom:8px">Code d'invitation — partagez-le pour inviter quelqu'un</p> <p class="pf-muted-note pf-muted-note--tight">Code d'invitation — partagez-le pour inviter quelqu'un</p>
<div style="display:flex;align-items:center;gap:12px;flex-wrap:wrap"> <div class="pf-invite-row">
<code id="invite-code" style="font-size:1.3rem;font-weight:700;letter-spacing:3px;color:#1e40af;cursor:pointer" <code id="invite-code" class="pf-invite-code"
onclick="copyCode()" title="Cliquer pour copier"> onclick="copyCode()" title="Cliquer pour copier">
<?= htmlspecialchars($family['invite_code']) ?> <?= htmlspecialchars($family['invite_code']) ?>
</code> </code>
<span id="copy-msg" style="color:#16a34a;font-size:0.85rem;opacity:0;transition:opacity .3s">✓ Copié !</span> <span id="copy-msg" class="pf-copy-msg">✓ Copié !</span>
<form method="post" style="margin-left:auto"> <form method="post" class="pf-ml-auto">
<input type="hidden" name="action" value="regen_invite"> <input type="hidden" name="action" value="regen_invite">
<button type="submit" class="pf-btn btn-secondary" style="font-size:0.85rem" <button type="submit" class="pf-btn btn-secondary pf-btn-sm-text"
onclick="return confirm('Regénérer le code ? L\'ancien sera invalidé.')"> onclick="return confirm('Regénérer le code ? L\'ancien sera invalidé.')">
🔄 Nouveau code 🔄 Nouveau code
</button> </button>
</form> </form>
</div> </div>
<p style="margin-top:12px;font-size:0.8rem;color:#94a3b8"> <p class="pf-invite-footnote">
Lien d'inscription : <strong><?= $_SERVER['HTTP_HOST'] ?>/register.php</strong> Lien d'inscription : <strong><?= $_SERVER['HTTP_HOST'] ?>/register.php</strong>
</p> </p>
</div> </div>
<!-- Membres --> <!-- Membres -->
<h3 style="font-size:0.95rem;font-weight:600;margin:20px 0 12px">Membres (<?= count($members) ?>)</h3> <h3 class="pf-members-heading">Membres (<?= count($members) ?>)</h3>
<div style="display:flex;flex-direction:column;gap:8px"> <div class="pf-stack-sm">
<?php foreach ($members as $m): ?> <?php foreach ($members as $m): ?>
<div style="display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:#f8fafc;border-radius:8px"> <div class="pf-member-card">
<div> <div>
<strong><?= htmlspecialchars($m['display_name']) ?></strong> <strong><?= htmlspecialchars($m['display_name']) ?></strong>
<span style="color:#94a3b8;font-size:0.85rem;margin-left:6px">@<?= htmlspecialchars($m['username']) ?></span> <span class="pf-muted-inline">@<?= htmlspecialchars($m['username']) ?></span>
<?php if ($m['is_admin']): ?> <?php if ($m['is_admin']): ?>
<span style="background:#dbeafe;color:#1d4ed8;padding:1px 7px;border-radius:8px;font-size:0.75rem;font-weight:600;margin-left:6px">Admin</span> <span class="pf-admin-badge">Admin</span>
<?php endif; ?> <?php endif; ?>
</div> </div>
<span style="font-size:0.8rem;color:#94a3b8"><?= date('d/m/Y', strtotime($m['created_at'])) ?></span> <span class="pf-muted-tiny"><?= date('d/m/Y', strtotime($m['created_at'])) ?></span>
</div> </div>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
@@ -341,8 +338,8 @@ require __DIR__ . '/header.php';
<?php endif; ?> <?php endif; ?>
<?php if ($_SESSION['user']['is_admin']): ?> <?php if ($_SESSION['user']['is_admin']): ?>
<div style="text-align:center;margin-top:8px"> <div class="pf-settings-admin-link">
<a href="/admin/" style="color:#2563eb;font-size:0.9rem">→ Panneau d'administration</a> <a href="/admin/">→ Panneau d'administration</a>
</div> </div>
<?php endif; ?> <?php endif; ?>
@@ -353,8 +350,8 @@ function copyCode() {
const code = document.getElementById('invite-code').textContent.trim(); const code = document.getElementById('invite-code').textContent.trim();
navigator.clipboard.writeText(code).then(() => { navigator.clipboard.writeText(code).then(() => {
const msg = document.getElementById('copy-msg'); const msg = document.getElementById('copy-msg');
msg.style.opacity = '1'; msg.classList.add('is-visible');
setTimeout(() => msg.style.opacity = '0', 2000); setTimeout(() => msg.classList.remove('is-visible'), 2000);
}); });
} }
</script> </script>