v2026.5.37 — Refonte vue horizontale (sidebar complète) : topbar supprimée, user-badge + titre + bouton Aujourd'hui + date/heure + stats en sidebar

viewer.js

@@ -1078,7 +1078,11 @@ function _applyViewMode() {
 
   // Liste des IDs à déplacer entre topbar (classique) et sidebar (horizontal)
   // Ordre = ordre visuel dans la sidebar en mode horizontal (haut → bas)
+  // v2026.5.37 : user-badge, app-title, theme-toggle déplacés aussi → la topbar
+  //              devient vide en vue horizontale.
   const ELEMENTS_TO_RELOCATE = [
+    "user-badge",              // tout en haut de la sidebar
+    "app-title",               // juste après user-badge
     "date-nav",                // (pas un id mais une classe, traité à part)
     "app-clock",
     "capture-info",
@@ -1088,7 +1092,8 @@ function _applyViewMode() {
     "refresh-partial-btn",
     "refresh-btn",
     "abort-btn",
-    "clear-cache-btn"
+    "clear-cache-btn",
+    "theme-toggle"             // tout en bas de la sidebar
   ];
 
   if (mode === "horizontal") {
@@ -1137,11 +1142,35 @@ function _moveElementsToSidebar(ids) {
   }
 
   // Traitement spécial : .date-nav (classe, pas id)
+  // v2026.5.37 : en vue horizontale, on décompose .date-nav pour :
+  //   - Mettre btn-today en haut
+  //   - Intercaler app-clock entre btn-today et date-custom
+  //   - Grouper les 2 flèches dans un wrapper #sidebar-arrows pour qu'elles
+  //     soient côte à côte et même largeur
   const dateNav = document.querySelector(".date-nav");
   if (dateNav) {
     _memorizeOriginalParent(dateNav);
     sidebar.appendChild(dateNav);
     console.log("[viewMode] déplacé dans sidebar : .date-nav");
+
+    // Créer le wrapper des flèches si pas déjà fait, et y mettre prev + next
+    let arrowsWrap = document.getElementById("sidebar-arrows");
+    if (!arrowsWrap) {
+      arrowsWrap = document.createElement("div");
+      arrowsWrap.id = "sidebar-arrows";
+      sidebar.appendChild(arrowsWrap);
+      console.log("[viewMode] wrapper flèches #sidebar-arrows créé");
+    }
+    const prevBtn = document.getElementById("nav-prev");
+    const nextBtn = document.getElementById("nav-next");
+    if (prevBtn && !arrowsWrap.contains(prevBtn)) {
+      _memorizeOriginalParent(prevBtn);
+      arrowsWrap.appendChild(prevBtn);
+    }
+    if (nextBtn && !arrowsWrap.contains(nextBtn)) {
+      _memorizeOriginalParent(nextBtn);
+      arrowsWrap.appendChild(nextBtn);
+    }
   }
 
   // Pour chaque ID listé, trouver et déplacer
@@ -1163,8 +1192,34 @@ function _moveElementsToSidebar(ids) {
  * data-orig-parent). Utilisé quand on revient en vue classique.
  */
 function _restoreElementsToTopbar(ids) {
-  // Restaurer .date-nav
+  // v2026.5.37 : d'abord remettre les flèches dans .date-nav (avant de
+  // restaurer .date-nav à son parent d'origine), puis supprimer le wrapper
+  // #sidebar-arrows.
   const dateNav = document.querySelector(".date-nav");
+  const prevBtn = document.getElementById("nav-prev");
+  const nextBtn = document.getElementById("nav-next");
+  if (dateNav && prevBtn && !dateNav.contains(prevBtn)) {
+    // Remettre prev en premier dans date-nav
+    dateNav.insertBefore(prevBtn, dateNav.firstChild);
+  }
+  if (dateNav && nextBtn && !dateNav.contains(nextBtn)) {
+    // Remettre next après date-custom-wrapper (position d'origine) :
+    // l'ordre d'origine est [prev, date-custom-wrapper, next, today].
+    const dateCustomWrap = dateNav.querySelector(".date-custom-wrapper");
+    if (dateCustomWrap && dateCustomWrap.nextSibling) {
+      dateNav.insertBefore(nextBtn, dateCustomWrap.nextSibling);
+    } else {
+      dateNav.appendChild(nextBtn);
+    }
+  }
+  // Supprimer le wrapper des flèches (normalement vide maintenant)
+  const arrowsWrap = document.getElementById("sidebar-arrows");
+  if (arrowsWrap) {
+    arrowsWrap.remove();
+    console.log("[viewMode] wrapper #sidebar-arrows supprimé");
+  }
+
+  // Restaurer .date-nav à son parent d'origine
   if (dateNav) _restoreToOriginalParent(dateNav, ".date-nav");
 
   for (const id of ids) {