5 Commits

Author SHA1 Message Date
ext.jeremy.guillot@maxicoffee.domains
9926da6730 fix(layout): corriger le scroll coupé sur mobile
RouterView n'avait pas de contrainte de hauteur dans le flex-col de main,
empêchant overflow-y-auto de se déclencher. Le contenu dépassait la hauteur
de main.overflow-hidden et était silencieusement tronqué sur mobile.
2026-03-26 16:25:36 +01:00
4c80aa6b42 Merge pull request 'fix(reader): corriger le scroll vers le haut bloqué en mode infini' (#31) from fix/reader-infinite-scroll-up into main
All checks were successful
Deploy / deploy (push) Successful in 1m12s
Reviewed-on: #31
2026-03-26 16:11:50 +01:00
c0307a9173 Merge branch 'main' into fix/reader-infinite-scroll-up 2026-03-26 16:11:43 +01:00
ext.jeremy.guillot@maxicoffee.domains
45f7e88024 fix(reader): corriger le scroll vers le haut bloqué en mode infini
Les IntersectionObserver utilisaient root: null (viewport) au lieu du
conteneur de scroll réel (.infinite-reader). Le rootMargin de 1000px
était donc calculé par rapport au viewport, causant un montage/démontage
des pages à des moments imprécis et des sauts de layout lors du scroll
vers le haut.

Supprime également scroll-behavior: smooth sur le conteneur, qui entrait
en conflit avec le scroll anchoring du navigateur lors des corrections de
position, donnant l'impression que le scroll redescendait tout seul.
2026-03-26 16:11:19 +01:00
507fac5b5e Merge pull request 'fix(reader): corriger le chevauchement des pages en mode scroll avec zoom' (#30) from fix/reader-zoom-overlap-mobile into main
All checks were successful
Deploy / deploy (push) Successful in 1m19s
Reviewed-on: #30
2026-03-26 15:58:06 +01:00
2 changed files with 3 additions and 4 deletions

View File

@@ -109,7 +109,7 @@ import ReaderPage from './ReaderPage.vue';
visibilityObserver.value?.disconnect();
observer.value = new IntersectionObserver(observeIntersection, {
root: null,
root: containerRef.value,
threshold: 0.5
});
@@ -124,7 +124,7 @@ import ReaderPage from './ReaderPage.vue';
}
});
},
{ root: null, rootMargin: '1000px 0px', threshold: 0 }
{ root: containerRef.value, rootMargin: '1000px 0px', threshold: 0 }
);
nextTick(() => {
@@ -328,7 +328,6 @@ import ReaderPage from './ReaderPage.vue';
@apply flex-1 flex flex-col items-center overflow-y-auto relative min-h-0;
/* Réduction du padding sur mobile */
@apply py-2 sm:py-8;
scroll-behavior: smooth;
}
.page-wrapper {

View File

@@ -16,7 +16,7 @@
headerStore.shouldShowHeader ? 'mt-16' : 'mt-0',
isReaderMode ? '' : 'md:ml-60'
]" style="transition: margin-top 300ms ease-in-out;">
<RouterView></RouterView>
<RouterView class="flex-1 min-h-0"></RouterView>
</main>
</div>
</template>