diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index ddea931..805bcaf 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -1013,6 +1013,8 @@ function App() { setAddPersonPanelVisible(false) tree.setSelectedPerson(freshPerson) + // Sur téléphone, la fiche couvre le bas : la personne touchée remonte dans le tiers du haut (#188) + if (freshPerson && window.matchMedia?.('(max-width: 768px)').matches) galaxyZoomApiRef.current?.focusPerson?.(freshPerson.id) trackTreeInteraction('text') trackDemoInteraction('person') }, [chooseSelectedPerson, leaveSelectedPerson, tree.setSelectedPerson, trackTreeInteraction, trackDemoInteraction]) // eslint-disable-line react-hooks/exhaustive-deps diff --git a/frontend/src/components/Galaxy.jsx b/frontend/src/components/Galaxy.jsx index cb3ec02..cdaa976 100644 --- a/frontend/src/components/Galaxy.jsx +++ b/frontend/src/components/Galaxy.jsx @@ -679,8 +679,9 @@ const Galaxy = ({ onPersonSelect, onMediaSelect, selectedPersonId, searchHighlig if (focusNode && fitScale < FOCUS_MIN_READABLE_SCALE) { scale = FOCUS_SCALE offsetX = (cssW < 768 ? (PHONE_SLIDER_BAND + cssW) / 2 : cssW / 2) - (focusNode.x + focusNode.width / 2) * scale - // Sur un écran étroit, la barre des familles couvre le haut : la personne de départ un peu plus bas - offsetY = cssH * (cssW < 768 ? 0.56 : 0.42) - (focusNode.y + focusNode.height / 2) * scale + // Sur un écran étroit, la barre des familles couvre le haut : la personne de départ un peu plus bas. Plus de + // fiche ouverte à l'arrivée sur téléphone (#188) : 0,4 et non plus 0,56, sinon le haut de l'écran reste vide + offsetY = cssH * (cssW < 768 ? 0.4 : 0.42) - (focusNode.y + focusNode.height / 2) * scale } const init = { x: offsetX, y: offsetY, scale } diff --git a/frontend/src/hooks/useTreeAccess.js b/frontend/src/hooks/useTreeAccess.js index 28fb03d..8547182 100644 --- a/frontend/src/hooks/useTreeAccess.js +++ b/frontend/src/hooks/useTreeAccess.js @@ -82,9 +82,11 @@ export function useTreeAccess() { const rootPerson = preferredRootPersonId ? graphPersons.find((person) => String(person.id) === String(preferredRootPersonId)) || null : null - // Par le lien de partage, la famille arrive sur l'arbre et sa carte d'accueil, pas sur une fiche ouverte + // Par le lien de partage, la famille arrive sur l'arbre et sa carte d'accueil, pas sur une fiche ouverte. + // Sur téléphone non plus : la fiche y couvre le bas de l'écran, et la personne de départ avec (#188). const openedByShareLink = (options.accessMode ?? '') === 'share' - setSelectedPerson(openedByShareLink ? null : rootPerson) + const phone = typeof window !== 'undefined' && window.matchMedia?.('(max-width: 768px)').matches + setSelectedPerson(openedByShareLink || phone ? null : rootPerson) setSelectedMedia(null) setTreeContext((current) => ({