colgora/Mangarr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: colgora:fix/reader-zoom-overlap-mobile
Branches Tags
colgora:main colgora:feat/monitoring-run-command colgora:feature/upgrade-symfony-8 colgora:fix/mobile-scroll-layout colgora:fix/reader-zoom-overlap-mobile colgora:feat/discover-page colgora:style/simplifier-table-homepage
...
compare: colgora:d7e6bf56d007c0842cec261772c4e4856788300a
Branches Tags
colgora:main colgora:feat/monitoring-run-command colgora:feature/upgrade-symfony-8 colgora:fix/mobile-scroll-layout colgora:fix/reader-zoom-overlap-mobile colgora:feat/discover-page colgora:style/simplifier-table-homepage

9 Commits
fix/reader ... d7e6bf56d0

Author SHA1 Message Date
colgora
d7e6bf56d0 Merge pull request 'fix(layout): corriger la barre blanche en bas sur mobile réel' (#33) from fix/mobile-dvh-viewport into main
All checks were successful
Deploy / deploy (push) Successful in 1m12s
Details 
Reviewed-on: #33
 2026-03-26 16:35:29 +01:00
colgora
17d44f68e5 Merge branch 'main' into fix/mobile-dvh-viewport 2026-03-26 16:35:22 +01:00
ext.jeremy.guillot@maxicoffee.domains
90d6feee2d fix(layout): corriger la barre blanche en bas sur mobile réel 
Sur un vrai appareil mobile, 100vh inclut le chrome du navigateur
(barre de navigation), ce qui cachait le contenu en bas.
- Remplace h-screen (100vh) par h-[100dvh] (dynamic viewport height)
- Ajoute viewport-fit=cover pour préparer le support safe-area iOS
 2026-03-26 16:35:00 +01:00
colgora
0880a77546 Merge pull request 'fix(layout): corriger le scroll coupé sur mobile' (#32) from fix/mobile-scroll-layout into main
All checks were successful
Deploy / deploy (push) Successful in 1m12s
Details 
Reviewed-on: #32
 2026-03-26 16:27:18 +01:00
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
colgora
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
Details 
Reviewed-on: #31
 2026-03-26 16:11:50 +01:00
colgora
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
colgora
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
Details 
Reviewed-on: #30
 2026-03-26 15:58:06 +01:00
3 changed files with 5 additions and 6 deletions
Expand all files Collapse all files

5
assets/vue/app/domain/reader/presentation/components/InfiniteReader.vue
View File

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

4
assets/vue/app/shared/components/layout/Layout.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<div class="h-screen overflow-hidden bg-gray-50 dark:bg-gray-900 flex"> <div class="h-[100dvh] overflow-hidden bg-gray-50 dark:bg-gray-900 flex">
<Header <Header
:show-menu-button="isReaderMode" :show-menu-button="isReaderMode"
@menu-click="toggleSidebar" @menu-click="toggleSidebar"
@@ -16,7 +16,7 @@
headerStore.shouldShowHeader ? 'mt-16' : 'mt-0', headerStore.shouldShowHeader ? 'mt-16' : 'mt-0',
isReaderMode ? '' : 'md:ml-60' isReaderMode ? '' : 'md:ml-60'
]" style="transition: margin-top 300ms ease-in-out;"> ]" style="transition: margin-top 300ms ease-in-out;">
<RouterView></RouterView> <RouterView class="flex-1 min-h-0"></RouterView>
</main> </main>
</div> </div>
</template> </template>

2
templates/vue/index.html.twig
View File

@@ -2,7 +2,7 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, viewport-fit=cover">
<title>Vue App</title> <title>Vue App</title>
{{ encore_entry_link_tags('vue-app') }} {{ encore_entry_link_tags('vue-app') }}
</head> </head>