Ajouter des tables of content

kazhnuz commented

2023-02-07 09:32:42 +01:00

Owner

Ce serait plus simple de pouvoir naviguer si on a des tables of content. Pour ça, il faudrait trouver un moyen que les MarkdownPage soient capable de le gérer.

-> https://github.com/markedjs/marked/issues/545
-> https://vuejs.org/guide/components/events.html#declaring-emitted-events

Solution : emit le toc une fois qu'il est généré pour l'ajouter au parent. La page d'accueil, des fiches, et le à propos n'auront pas de toc

Autre possibilité : stocker la toc dans un store, et faire du TOC un élément vraiment de "haut niveau" de la page (qui ne serait affiché uniquement quand la taille de la liste de titre est plus grande que 1).

Ce serait plus simple de pouvoir naviguer si on a des tables of content. Pour ça, il faudrait trouver un moyen que les MarkdownPage soient capable de le gérer. -> https://github.com/markedjs/marked/issues/545 -> https://vuejs.org/guide/components/events.html#declaring-emitted-events Solution : `emit` le toc une fois qu'il est généré pour l'ajouter au parent. La page d'accueil, des fiches, et le à propos n'auront pas de toc Autre possibilité : stocker la toc dans un store, et faire du TOC un élément vraiment de "haut niveau" de la page (qui ne serait affiché uniquement quand la taille de la liste de titre est plus grande que 1).

kazhnuz added this to the (deleted) milestone 2023-02-07 09:32:42 +01:00

kazhnuz added the

labels 2023-02-07 09:32:42 +01:00

kazhnuz added this to the Site vueJS project 2023-02-07 09:32:43 +01:00

kazhnuz commented

2023-02-07 09:35:05 +01:00

Author

Owner

Le table of content sera dans une bulle, suivant la taille de la page, sur la droite.

kazhnuz commented

2023-02-07 09:49:42 +01:00

Author

Owner

Ajout de padding du coup des deux côté pour l'espace réservé au contenu

kazhnuz commented

2023-02-07 09:58:19 +01:00

Author

Owner

La table des matière va aussi permettre de rendre plus aisé d'avoir des longues pages

kazhnuz commented

2023-02-07 10:01:22 +01:00

Author

Owner

Si possible, tenter un scrollspy : https://github.com/bennyxguo/vue3-scroll-spy

Visiblement utiliser juste des anchor ne marchera pas et il faudrai utiliser des refs. Hors, ça va être compliqué vu qu'on utilise un v-html...

Voir :

Ou tenter avec : https://router.vuejs.org/guide/advanced/scroll-behavior.html

Si possible, tenter un scrollspy : https://github.com/bennyxguo/vue3-scroll-spy Visiblement utiliser juste des anchor ne marchera pas et il faudrai utiliser des refs. Hors, ça va être compliqué vu qu'on utilise un v-html... Voir : - https://forsmile.jp/en/vue-en/1118/ - https://markus.oberlehner.net/blog/refs-and-the-vue-3-composition-api/ - https://vuejs.org/guide/essentials/template-refs.html Ou tenter avec : https://router.vuejs.org/guide/advanced/scroll-behavior.html

kazhnuz commented

2023-02-07 11:00:20 +01:00

Author

Owner

Le risque aussi c'est que la page soit pas totalement chargée au moment ou le scroll est fait.

Peut-être potentiellement réglé comme ça : https://router.vuejs.org/guide/advanced/scroll-behavior.html#delaying-the-scroll

Le risque aussi c'est que la page soit pas totalement chargée au moment ou le scroll est fait. Peut-être potentiellement réglé comme ça : https://router.vuejs.org/guide/advanced/scroll-behavior.html#delaying-the-scroll

kazhnuz commented

2023-02-07 11:22:57 +01:00

Author

Owner

Plan d'action
-> Tenter un router-link avec {hash:id_dun_element} présent dans le markdown, dans un éléments "plus haut".
-> Si marche pas, tenter le délais.
-> Si marche pas, + d'investigation.
-> Si marche : Tenter génération du toc.

Cet exemple peut potentiellement aider : https://github.com/vuejs/vue-router/blob/dev/examples/hash-scroll-behavior/app.js

**Plan d'action** -> Tenter un router-link avec {hash:id_dun_element} présent dans le markdown, dans un éléments "plus haut". -> Si marche pas, tenter le délais. -> Si marche pas, + d'investigation. -> Si marche : Tenter génération du toc. Cet exemple peut potentiellement aider : https://github.com/vuejs/vue-router/blob/dev/examples/hash-scroll-behavior/app.js

kazhnuz referenced this issue from a pull request that will close it,

2023-02-07 23:26:52 +01:00

Portage du site sous vuejs #232

kazhnuz closed this issue

2023-02-08 12:45:46 +01:00

Ajouter des tables of content #233