This commit is contained in:
KONE SOREL 2026-01-05 11:48:06 +00:00
parent 2664fbac5a
commit 716b32e4ed
2 changed files with 39 additions and 12 deletions

View File

@ -352,6 +352,28 @@ body {
background: #97999B;
}
/* État fermé via body.sidebar-collapsed */
body.sidebar-collapsed .app-sidebar {
width: var(--sidebar-collapsed);
}
body.sidebar-collapsed .app-main {
margin-left: var(--sidebar-collapsed);
}
body.sidebar-collapsed .nav-bar {
left: var(--sidebar-collapsed);
}
/* Accessibilité et clickabilité du bouton */
.toggle-sidebar-btn {
cursor: pointer;
}
.toggle-sidebar-btn[role="button"] {
outline: none;
}
/* Content card */
.content-card {
background: var(--office-card);

View File

@ -123,7 +123,7 @@ $photoAssureCrypte = $_SESSION['photoAssureCrypte'];
<link rel="manifest" href="<?= $racineWeb ?>manifest.json">
<!-- 4. VOS STYLES PERSONNALISÉS (en dernier pour qu'ils dominent) -->
<link href="<?= $racineWeb ?>Bootstrap_new/css/style_office.css?ver=2026.01.05.01" rel="stylesheet">
<link href="<?= $racineWeb ?>Bootstrap_new/css/style_office.css?ver=2026.01.05.03" rel="stylesheet">
<link href="<?= $racineWeb ?>Bootstrap_new/css/ux_enhancements.css?ver=2025.12.21.02" rel="stylesheet">
<!-- ============================================
@ -754,20 +754,25 @@ $photoAssureCrypte = $_SESSION['photoAssureCrypte'];
<script>
document.addEventListener("DOMContentLoaded", function () {
const toggleBtn = document.querySelector(".toggle-sidebar-btn");
const sidebar = document.querySelector(".app-sidebar");
const main = document.querySelector(".app-main");
const navBar = document.querySelector(".nav-bar");
if (!toggleBtn) {
console.warn("Toggle button .toggle-sidebar-btn introuvable");
return;
}
toggleBtn.addEventListener("click", function () {
// Toggle sidebar
sidebar.classList.toggle("collapsed");
// Rendez le bouton accessible aux clics clavier
toggleBtn.setAttribute("role", "button");
toggleBtn.setAttribute("tabindex", "0");
toggleBtn.setAttribute("aria-label", "Basculer le menu latéral");
// Ajuster le main
main.classList.toggle("collapsed");
const toggle = () => {
document.body.classList.toggle("sidebar-collapsed");
};
// Ajuster la nav-bar si elle existe
if (navBar) {
navBar.classList.toggle("collapsed");
toggleBtn.addEventListener("click", toggle);
toggleBtn.addEventListener("keydown", (e) => {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
toggle();
}
});
});