Composants
Les 30 composants de Pathou, rangés par famille. Chaque fiche décrit l’usage, l’anatomie, les états et l’API, avec le vrai composant en aperçu.
0 sur 30 validés · les autres fiches sont des premiers jets à relire
Interface générique
ButtonLes boutons de Pathou ne sont pas un composant React. Ce sont des
<button> natifs mis en forme par des classes de styles.css. Cette fiche les réunit tous, des variantes de texte (primary, secondary, ghost, lien) aux boutons icône et aux boutons flottants de la carte.stableÀ validerEditBannerBandeau des alternatives appliquées à la trace : leur liste, l’écart total de distance et de dénivelé, le téléchargement du GPX modifié et le retour à l’original.stableÀ validerLeaveConfirmConfirmation avant de quitter la trace affichée, pour qu’un clic de travers sur « Nouvelle trace » ne fasse pas perdre l’analyse ni les alternatives appliquées.stableÀ validerModalFenêtre centrée au-dessus de la page, construite sur l’élément natif dialog ; base de toutes les fenêtres de Pathou (sources, partage, confirmation).stableÀ validerPhotoCardCarte des photos au sol (Panoramax) du point ou du passage choisi, pour voir le terrain réel ; n’apparaît que s’il y a des photos à montrer.stableÀ validerSegmentedChoix exclusif entre deux à cinq options courtes, toutes visibles en même temps (pratique, niveau, mode de couleur du profil).stableÀ validerServiceStatusÉtat des services, testés depuis le navigateur de la personne à l’ouverture et sur « Retester » ; regroupés par pays, avec l’effet d’une panne sur l’analyse.stableÀ validerShareDialogFenêtre de partage de la trace par un lien qui contient la trace elle-même ; rien n’est enregistré chez Pathou.stableÀ validerTourVisite guidée de la première trace, posée sur la trace elle-même du départ à l’arrivée ; chaque étape commente un élément réel de l’analyse.stableÀ validerCarte
CameraControlBoussole unique de la caméra 3D — la couronne tourne la carte, le centre l’incline, un clic remet le nord, la pastille bascule entre vue de dessus et vue inclinée.stableÀ validerDetourBlockCarte d’une alternative à un point d’attention difficile — praticable, moins dure ou en cours de recherche — avec son écart de distance et de dénivelé, et le bouton pour l’appliquer à la trace.stableÀ validerDetourGlyphPictogramme d’une alternative — la trace, le passage difficile et le contournement en pointillés qui la quitte avant et la rejoint après.stableÀ validerMap3DLa carte 3D (MapLibre) — relief, trace colorée par difficulté, pente ou surface, calques, curseur lié au profil, alternatives et survol animé de la trace.stableÀ validerMapContentMenuBouton flottant « Contenu de la carte » et son menu d’interrupteurs — trace, sens, bornes, cotation VTT, points d’eau, photos, obstacles… — groupés par thème.stableÀ validerMapLayersMenuBouton flottant « Fond » avec la vignette du fond de carte en cours, et son menu — choix du fond par de vraies tuiles de la zone, et exagération du relief 3D.stableÀ valider
Verdict et analyse
AlertExtrasCompléments de la liste des points d’attention — l’état vide qui montre quand même la montée la plus raide, et l’échelle des niveaux qui donne la longueur trop dure pour chacun.stableÀ validerAlertListListe des points d’attention dans l’ordre du parcours — passages durs, balcons, obstacles, accès — chacun en carte avec sa coupe, ses chiffres et son alternative ; les remarques « à vérifier » sont regroupées à la fin.stableÀ validerBalconyFigureCoupe d’un sentier en balcon, vue dans le sens de la marche — le replat du sentier, le terrain qui monte d’un côté et plonge de l’autre à la pente mesurée.stableÀ validerClimbListLes montées de la trace, chacune dessinée comme un profil de col coloré par la pente, avec sa catégorie, son altitude, sa longueur et sa pente.stableÀ validerDayPlanDépart, arrivée et lumière du jour — bouton flottant de l’heure d’arrivée et son panneau, où un ruban montre la journée et la sortie posée dessus, à l’heure du pays de la trace.stableÀ validerLevelInfoBouton « i » à côté du choix du niveau, qui ouvre l’explication des quatre niveaux pour la pratique choisie.stableÀ validerProfileProfil d’altitude de la trace (uPlot), coloré par la difficulté, la pente ou le type de voie ; le survol suit la carte et une sélection cadre une portion.stableÀ validerRouteDockDock flottant en bas de la carte — distance, dénivelé et durée estimée, puis le profil repliable où le point culminant et la pente maximale sont posés là où ils se trouvent.stableÀ validerSidebarPanneau de droite de la trace — le verdict pour la pratique et le niveau choisis, sa confiance, puis les sections repliables des points d’attention, des montées, de la cotation et des sources.stableÀ validerTechLadderCotation technique des sentiers de la trace — une colonne par degré, de S0 à S5 (cotation OpenStreetMap pleine, estimée hachurée) — et la limite de la pratique et du niveau choisis.stableÀ validerTrackViewL’écran d’une trace analysée — barre du haut (pratique, niveau), carte 3D, dock du parcours et panneau du verdict ; recréé pour chaque nouveau fichier.stableÀ valider
Accueil
HomeCountriesSection de l’accueil sur les pays couverts, groupés par statut du plus sûr au moins sûr, puis le reste du monde ; un pays ouvre la fenêtre « Où Pathou fonctionne » sur lui.stableÀ validerHomeDemoDémonstration de l’accueil — un même parcours dont le profil se recolore et le verdict change avec la pratique et le niveau choisis, cotés par le vrai moteur.stableÀ validerHomeFeaturesExemples de ce que Pathou ajoute à une trace — une alternative, un balcon, un passage difficile — posés autour de la question de l’accueil, avec les composants mêmes de la vue trace.stableÀ valider