petites améliorations smartphones, logo et fond de header et footer gérés dans NodeData

1 files changed, 38 insertions, 27 deletions

diff --git a/public/js/main.js b/public/js/main.js
index 6eb0162..2ffd33b 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -8,33 +8,6 @@ function newPassword(page, id = ''){
         }, 0);
 }
 
-// ouvrir/fermer les sous-menus avec écran tactile
-document.addEventListener('DOMContentLoaded', () => { // sinon on ne trouve pas les boutons
-        document.querySelectorAll('.sub-menu-toggle').forEach(button => {
-                button.addEventListener('click', e => {
-                        e.preventDefault();
-                        const li = button.parentElement; // <li class="drop-down">
-
-                        // fermer les autres sous-menus de même niveau
-                        // :scope pour pouvoir utiliser > pour restreindre aux frères directs
-                        li.parentElement.querySelectorAll(':scope > .drop-down, :scope > .drop-right').forEach(sibling => {
-                                if(sibling !== li){
-                                        sibling.classList.remove('open'); // fermer sous-menus frères
-                                        sibling.querySelectorAll('.drop-right').forEach(desc => {
-                                                desc.classList.remove('open'); // fermer sous-menus neveux
-                                        });
-                                }
-                        });
-
-                        if(!li.classList.toggle('open')){ // fermer sous-menu
-                                li.querySelectorAll('.drop-right').forEach(desc => {
-                                        desc.classList.remove('open'); // fermer sous-menus enfants
-                                });
-                        }
-                });
-        });
-});
-
 function copyInClipBoard(link){
         // une balise <input> avec des attributs
         var element = document.createElement("input");
@@ -64,6 +37,44 @@ function toastNotify(message) {
 }
 
 
+document.addEventListener('DOMContentLoaded', () => { // pour pouvoir attraper les balises
+        // ouvrir/fermer les sous-menus avec écran tactile
+        document.querySelectorAll('.sub-menu-toggle').forEach(button => {
+                button.addEventListener('click', e => {
+                        e.preventDefault();
+                        const li = button.parentElement; // <li class="drop-down">
+
+                        // fermer les autres sous-menus de même niveau
+                        // :scope pour pouvoir utiliser > pour restreindre aux frères directs
+                        li.parentElement.querySelectorAll(':scope > .drop-down, :scope > .drop-right').forEach(sibling => {
+                                if(sibling !== li){
+                                        sibling.classList.remove('open'); // fermer sous-menus frères
+                                        sibling.querySelectorAll('.drop-right').forEach(desc => {
+                                                desc.classList.remove('open'); // fermer sous-menus neveux
+                                        });
+                                }
+                        });
+
+                        if(!li.classList.toggle('open')){ // fermer sous-menu
+                                li.querySelectorAll('.drop-right').forEach(desc => {
+                                        desc.classList.remove('open'); // fermer sous-menus enfants
+                                });
+                        }
+                });
+        });
+
+        // hauteur de <nav> en fonction de celle du menu en position fixe
+        const nav = document.querySelector('nav');
+        const nav_zone = document.getElementById('nav_zone');
+        const resize_observer = new ResizeObserver(entries => {
+                for(const entry of entries){
+                        nav_zone.style.height = entry.contentRect.height + 'px';
+                }
+        });
+        resize_observer.observe(nav);
+});
+
+
 // complète les fonctions dans tinymce.js
 function switchPositions(article_id, direction)
 {