fix: page Configurations inutilisable en mode mobile BUG-071

frontend/js/config.js

@@ -767,6 +767,10 @@ function initConfigModal() {
   openBtn.addEventListener("click", async () => {
     modal.classList.add("active");
     closeHeaderMenu();
+    // BUG-071: reset the TOC to the CSS default (mobile: hidden, desktop:
+    // visible) like the help modal does on open.
+    var configNavOnOpen = document.getElementById("config-nav");
+    if (configNavOnOpen) configNavOnOpen.style.display = '';
     renderConfigFilters();
     loadConfigFields();
     loadDiagnostics();
@@ -886,6 +890,44 @@ function initConfigModal() {
     });
   }
 
+  // BUG-071: mobile table of contents. #config-nav shares the .help-nav
+  // rule that hides it below 768px, but — unlike the help modal — the config
+  // modal had no toggle to reveal it, leaving mobile users with no way to
+  // reach a section. The header hamburger opens it as a top block; picking
+  // a section smooth-scrolls inside the modal and collapses it on mobile.
+  var configNav = document.getElementById("config-nav");
+  var configHamburger = document.getElementById("config-hamburger");
+  function _isConfigMobile() { return window.innerWidth <= 768; }
+  function _setConfigNav(open) {
+    if (!configNav) return;
+    configNav.style.display = open ? "flex" : "none";
+    if (configHamburger) configHamburger.classList.toggle("active", !!open);
+  }
+  if (configHamburger) {
+    configHamburger.addEventListener("click", function(e) {
+      e.stopPropagation();
+      var hidden = !configNav || configNav.style.display === "none" || configNav.style.display === "";
+      _setConfigNav(hidden);
+    });
+  }
+  if (configNav) {
+    configNav.querySelectorAll(".help-nav-link").forEach(function(a) {
+      a.addEventListener("click", function(e) {
+        var hash = a.getAttribute("href");
+        if (!hash || hash.charAt(0) !== "#") return;
+        var target = document.getElementById(hash.slice(1));
+        if (!target) return;
+        e.preventDefault();
+        configNav.querySelectorAll(".help-nav-link").forEach(function(o) { o.classList.remove("active"); });
+        a.classList.add("active");
+        if (typeof target.scrollIntoView === "function") {
+          target.scrollIntoView({ behavior: "smooth", block: "start" });
+        }
+        if (_isConfigMobile()) _setConfigNav(false);
+      });
+    });
+  }
+
   document.addEventListener("keydown", (e) => {
     if (e.key === "Escape" && modal.classList.contains("active")) {
       closeConfigModal();

frontend/js/i18n.js

@@ -5,6 +5,7 @@
  *   Static DOM:  data-i18n="key"             → textContent
  *                data-i18n-placeholder="key"  → placeholder
  *                data-i18n-attr:title="key"    → title attribute
+ *                data-i18n-attr="a:k1;b:k2"    → several attributes (";"-separated)
  *                data-i18n-html="key"         → innerHTML (use sparingly)
  *   Dynamic JS:  import { t } from './i18n.js';  t('key', {param: 'val'})
  *   Live reload: setLocale('en') updates every data-i18n element instantly.
@@ -183,13 +184,19 @@ function _applyDOM() {
     el.innerHTML = t(key);
   });
 
-  // data-i18n-attr:TITLE → sets any attribute
+  // data-i18n-attr:ATTR:key[;ATTR:key…] → sets any attribute(s).
+  // Single-pair form (data-i18n-attr="title:key") is preserved; multiple
+  // pairs are separated with ";" (BUG-071: the config TOC toggle needs both
+  // title and aria-label translated).
   document.querySelectorAll('[data-i18n-attr]').forEach(function (el) {
     const raw = el.getAttribute('data-i18n-attr');
-    const colon = raw.indexOf(':');
-    if (colon === -1) return;
-    const attr = raw.substring(0, colon);
-    const key = raw.substring(colon + 1);
-    el.setAttribute(attr, t(key));
+    raw.split(';').forEach(function (pair) {
+      const colon = pair.indexOf(':');
+      if (colon === -1) return;
+      const attr = pair.substring(0, colon).trim();
+      const key = pair.substring(colon + 1).trim();
+      if (!attr || !key) return;
+      el.setAttribute(attr, t(key));
+    });
   });
 }