Page FAQ : Refacto et bascule sur des templates
Objectif : Sur le modèle des pages dans comprendre le SA, il faut refactorer la page FAQ pour :
- utiliser TemplatePage et TemplateFilArianeEtContenu
- le menu sommaire contient la liste les questions de la FAQ
- quand on clique sur une entrée du menu, la page scrolle sur la zone adapté (il faut donc rajouter des id sur chacune des questions pour pouvoir utiliser le hash de l'url)
- supprimer le fichier page-faq.css au profit d'un fichier .ts en s'inspirant de comprendre-le-system-alimentaire-utils.ts . Si pertinent, créer un fichier pages/aide/aide-utils.ts pour porter des éléments commun a l'ensemble des pages d'aides (par ex STYLE_AIDE pour porter le css qui est aujourd'hui dans STYLES_COMPRENDRE_LE_SA mais qui est surement commun à toutes les pages)
Rendre dynamique la création du contenu de la FAQ
- la FAQ est construite à partir d'un tableau d'objets définis comme private readonly dans le composante. Ces objets contiennent chancun un id, un libelle, et une definition, 3 champs de type string
- la page construit le menu sommaire de la manière suivante : un item avec libelle= this.titre; Et autant de sous items qu'il y a d'éléments dans le dictionnaire.
- la page construit ensuite son coeur de page en itérerant sur les items du dictionnaire. Chaque item donne lieu à un bloc html avec en h2 le libelle de l'item (avec comme id, l'id de l'item), et en paragraphe en dessous la definition
- quand on clique sur une entrée du menu, la page scrolle sur la zone adapté (il faut donc rajouter des id sur chacun des h2 des items pouvoir utiliser le hash de l'url)
- pour le mécanisme de scroll, voir ce qui est fait dans PageDiagnostic.ts, et utiliser la fonction scrollerVersElement
Edited by Lionel