https://www.fjkm.mg/app/themes/fjkm/assets/js/custom.js

1document.addEventListener("DOMContentLoaded", function () {
2  let headerTop = document.querySelector(".header-top-simple-border-bottom");
3  const logoCroped = document.querySelector("#header .header-logo img#logo-fjkm-croped");
4  const logoNormal = document.querySelector("#header .header-logo img#logo-fjkm");
5
6  if (!headerTop || !logoCroped || !logoNormal) return;
7
8  // Injecte le CSS mobile dans la page
9  let mobileStyle = document.createElement("style");
10  mobileStyle.textContent = `
11    @media (max-width: 992px) {
12        #header .header-logo img#logo-fjkm-croped {
13            display: block !important;
14            top: -55px !important;
15        }
16
17        #header .header-logo img#logo-fjkm {
18            display: none !important;
19        }
20
21        p,
22        #footer a,
23        #footer h5 {
24            font-size: 16px !important;
25        }
26
27        .get-started {
28            display: flex;
29            justify-content: flex-end;
30        }
31    }
32  `;
33  document.head.appendChild(mobileStyle);
34
35  // Fonction de bascule de logo sur desktop uniquement
36  function toggleLogo() {
37    let isMobile = window.matchMedia("(max-width: 992px)").matches;
38
39    if (isMobile) {
40      // En mobile : toujours afficher le logo cropé
41      logoCroped.style.display = "block";
42      logoCroped.style.top = "-55px";
43      logoNormal.style.display = "none";
44      return;
45    }
46
47    // Comportement desktop
48    const height = headerTop.offsetHeight;
49    if (height === 1) {
50      logoCroped.style.top = "-170px";
51      logoCroped.style.display = "block";
52      logoNormal.style.display = "none";
53    } else {
54      logoCroped.style.display = "none";
55      logoNormal.style.display = "block";
56    }
57  }
58
59  // État initial
60  setTimeout(toggleLogo, 150);
61
62  // Réagir au scroll et au resize
63  window.addEventListener("scroll", toggleLogo);
64  window.addEventListener("resize", toggleLogo);
65
66  // Observer les changements de style du header
67  const observer = new MutationObserver(toggleLogo);
68  observer.observe(headerTop, { attributes: true, attributeFilter: ["style"] });
69});