nodebb-plugin-ezoic-infinite 1.8.32 → 1.8.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-ezoic-infinite",
-  "version": "1.8.32",
+  "version": "1.8.33",
   "description": "Production-ready Ezoic infinite ads integration for NodeBB 4.x",
   "main": "library.js",
   "license": "MIT",

package/public/style.css

@@ -1,10 +1,6 @@
 /*
- * NodeBB Ezoic Infinite Ads — style.css (v20.5)
- * Objectif:
- * - comportement v50-like (pas de rognage involontaire)
- * - neutraliser les wrappers Ezoic "adaptive/multi" (970px inline) sur mobile
- * - éviter l'affichage multi-annonces (forcer 1 annonce / ligne)
- * - garder anti-sticky + gestion .is-empty
+ * NodeBB Ezoic Infinite Ads — style.css (v20.6)
+ * Fix mobile: supprimer le léger scroll horizontal lors de l'apparition du "reportline" Ezoic.
  */
 
 /* ── Wrapper ──────────────────────────────────────────────────────────────── */
@@ -13,11 +9,7 @@
   width: 100%;
   margin: 0 !important;
   padding: 0 !important;
-
-  /* Ne pas couper les ads rendues */
   overflow: visible;
-
-  /* On évite les effets de layout imprévus avec certains thèmes */
   contain: none;
 }
 
@@ -40,7 +32,7 @@
   font-size: 0 !important;
 }
 
-/* Container Google/Ezoic : surtout PAS overflow hidden (sinon rognage) */
+/* Container Google/Ezoic : ne pas rogner */
 .nodebb-ezoic-wrap div[id$="__container__"],
 .nodebb-ezoic-wrap [id^="google_ads_iframe_"][id$="__container__"] {
   display: block !important;
@@ -55,7 +47,7 @@
   max-width: 100% !important;
 }
 
-/* Conteneur Ezoic : ne pas casser la hauteur, centrer */
+/* Conteneur Ezoic : centrer, ne pas casser la hauteur */
 .nodebb-ezoic-wrap .ezoic-ad,
 .nodebb-ezoic-wrap span.ezoic-ad {
   display: block !important;
@@ -70,7 +62,7 @@
   max-width: 100% !important;
 }
 
-/* Iframes : centrées, bornées */
+/* Iframes : bornées */
 .nodebb-ezoic-wrap iframe {
   margin-left: auto !important;
   margin-right: auto !important;
@@ -82,7 +74,7 @@
   position: absolute !important;
 }
 
-/* Neutralise sticky dans nos wraps (évite l'effet "gliding") */
+/* Neutralise sticky dans nos wraps */
 .nodebb-ezoic-wrap .ezads-sticky-intradiv {
   position: static !important;
   top: auto !important;
@@ -110,16 +102,6 @@
 }
 
 /* ── Fix: Ezoic "adaptive/multi" qui force 970px & multi-annonces ────────── */
-/*
-  Certains placements "adaptive/multi" gardent des inline styles:
-  width/min-width: 970px + display:flex + plusieurs blocs 300x250.
-  Ce n'est pas souhaité -> on:
-  - neutralise les largeurs forcées
-  - empêche l'affichage multi en ne gardant que le 1er slot rendu
-  - force une mise en page "1 annonce centrée"
-*/
-
-/* Neutralise les inline width/min-width (970px) sur ces wrappers */
 .nodebb-ezoic-wrap .ezoic-ad-adaptive,
 .nodebb-ezoic-wrap .adtester-container,
 .nodebb-ezoic-wrap [class*="Content-multi-"] {
@@ -129,7 +111,6 @@
   box-sizing: border-box !important;
 }
 
-/* Ces wrappers sont souvent en flex -> on les remet en bloc centrable */
 .nodebb-ezoic-wrap .ezoic-ad-adaptive,
 .nodebb-ezoic-wrap .adtester-container {
   display: block !important;
@@ -137,20 +118,30 @@
   margin-right: auto !important;
 }
 
-/* Si Ezoic met plusieurs "Content-multi-XXX" dans le même placeholder:
-   on masque toutes les occurrences sauf la première. */
+/* Masque les multi-slots non voulus */
 .nodebb-ezoic-wrap [class*="Content-multi-"] ~ [class*="Content-multi-"] {
   display: none !important;
 }
-
-/* Si plusieurs containers Google sont présents (multi slots), on masque tout sauf le premier */
 .nodebb-ezoic-wrap div[id$="__container__"] ~ div[id$="__container__"] {
   display: none !important;
 }
 
-/* ── Mobile: éviter tout débordement horizontal ──────────────────────────── */
+/* ── MOBILE: anti scroll horizontal “1–3px” (reportline / absolute / padding) ─ */
 @media (max-width: 767px) {
-  /* On s'assure que les wrappers ne gardent pas de min-width forcé */
+  /* 1) Empêche le dézoom/scroll horizontal global */
+  html, body {
+    overflow-x: hidden !important;
+  }
+
+  /* 2) Rien dans le wrap ne doit dépasser le viewport */
+  .nodebb-ezoic-wrap,
+  .nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"],
+  .nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] > div {
+    max-width: 100vw !important;
+    box-sizing: border-box !important;
+  }
+
+  /* 3) Les wrappers Ezoic ne doivent jamais garder un min-width implicite */
   .nodebb-ezoic-wrap .ezoic-ad,
   .nodebb-ezoic-wrap span.ezoic-ad,
   .nodebb-ezoic-wrap .ezoic-ad-adaptive,
@@ -161,10 +152,24 @@
     max-width: 100% !important;
   }
 
-  /* Si un thème parent clippe encore, on préfère un scroll interne au rognage */
+  /* 4) Reportline: c'est souvent lui qui “dépasse” de 1–2px */
+  .nodebb-ezoic-wrap .reportline {
+    left: 0 !important;
+    right: 0 !important;
+    width: auto !important;
+    max-width: 100% !important;
+    box-sizing: border-box !important;
+    overflow: hidden !important; /* évite qu’un enfant dépasse */
+  }
+  .nodebb-ezoic-wrap .reportline * {
+    max-width: 100% !important;
+    box-sizing: border-box !important;
+  }
+
+  /* IMPORTANT: on enlève le scroll interne auto (ça peut créer un micro-scroll sur la page catégories) */
   .nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] {
-    overflow-x: auto !important;
-    -webkit-overflow-scrolling: touch;
+    overflow-x: visible !important;
+    -webkit-overflow-scrolling: auto;
   }
 }