spyrales / gouvdown

French government design system for R Markdown
https://spyrales.github.io/gouvdown/
European Union Public License 1.2
48 stars 4 forks source link

Bookdown template #32

Closed MaelTheuliere closed 3 years ago

MaelTheuliere commented 3 years ago

Rajout du template bookdown gitbook. Pour l'instant je propose de faire appel aux fonctions internes de {bookdown} afin de ne pas dupliquer inutilement la moitiée des fonctions de ce package. L'idée étant d'améliorer {bookdown} afin de rendre ces appels inutiles. Cf discussion ici #26. Dans l'attente, cela se traduit par un warning sur le build. Cette PR intègre les éléments de la PR #30 nécessaires à la mise en place du template. Je vous propose de la supprimer si personne n'a encore eu le temps de s'y pencher. Sinon on garde les deux et il faut dans ce cas valider la #30 avant.

statnmap commented 3 years ago

Je viens de tester le template sur un book existant. ça fonctionne plutôt bien et je n'ai pas eu à y passer beaucoup de temps pour faire la transition.

J'ai dû lancer gouvdown:::gouvdown_book_skeleton(path = ".", logo_name = "rf", logo_file = "").
Ce serait peut-être bien d'exporter cette fonction et de mettre ces valeurs par défaut. Ça évite un message d'erreur.
Comme mon "book" existait déjà, j'ai dû

statnmap commented 3 years ago

Côté css, il y a l'air d'avoir un conflit sur les listes à points.
Pour reproduire avec {bookdown} version 0.20 et {rmarkdown} version 2.4 :

Du texte avec une liste à points :

Un autre :



- Compiler le book: `bookdown::render_book("index.Rmd", output_format = "gouvdown::gitbook_gouv", clean = TRUE, output_dir = "_book")`
- Ouvrir le book `browseURL("_book/index.html")`
- La police de la liste à points est écrasée par {bookdown}:

![image](https://user-images.githubusercontent.com/21193866/95848994-1e7cb980-0d4f-11eb-9f85-617c0ab4e9b0.png)
- Ici le css exécuté: 
![image](https://user-images.githubusercontent.com/21193866/95849102-466c1d00-0d4f-11eb-8fc2-cf65a8f13419.png)
statnmap commented 3 years ago

J'ajouterai que visuellement, je trouve personnellement que la police "Spectral" n'est pas très facile à lire sur des longs textes.
D'ailleurs, dans la charte, même si elle est dîte comme étant conçue pour une lisibilité maximale à l'écran, il est aussi écrit de l'utiliser avec parcimonie (https://www.gouvernement.fr/charte/charte-graphique-les-fondamentaux/la-typographie).
Je recommanderai de plutôt utiliser "Marianne" par défaut et de mettre "Spectral" pour les citations uniquement. Vous avez aussi la possibilité de documenter qu'on peut mettre des blocs de textes ou des div spécifiques avec "Spectral".
D'ailleurs, je pense que le Sans-serif est recommandé pour le web.

MaelTheuliere commented 3 years ago

Merci @statnmap, je corrigerai sur le css. Pour la gestion des bookdown existant, je propose de mettre une issue et de traiter celà à part. Je crois que ce besoin pourrait être plus générique que gouvdown non ? Vous en pensez quoi sur spectral @tvroylandt @RLesur ? Je me disais la même chose notamment sur ggplot2. Et à la relecture en effet ce serait plus logique de garder Marianne pour tout sauf pour les citations, éventuellement le caption dans ggplot 2...

statnmap commented 3 years ago

Pour le css, je remarque dans le _output.yml, il y a "marque_etat.css" qui n'a pas l'air d'exister.
En revanche, il y a un fichier "default.css" qui n'est pas utilisé. EDIT: Il est utilisé dans le template directement.

statnmap commented 3 years ago

Je ne peux pas ajouter d'includes dans le output

gouvdown::gitbook_gouv:
  includes:
    in_header: [matomo.html]
  css: ["style.css","marque_etat.css","gouv_book.css"]
  config:
    toc:
      before: |
        <li><a href="./"><img src="www/Republique_Francaise_RVB.png" width = "130"></a><a href="./index.html">C'est du PROPRE</a></li>
      after: |
        <li><a target= "_blank" href="http://thinkr.fr">ThinkR</a></li>

J'obtiens cette erreur.

Error in rmarkdown::html_document(..., extra_dependencies = extra_deps,  : 
  argument formel "includes" correspondant à plusieurs arguments fournis
MaelTheuliere commented 3 years ago

Je ne peux pas ajouter d'includes dans le output

gouvdown::gitbook_gouv:
  includes:
    in_header: [matomo.html]
  css: ["style.css","marque_etat.css","gouv_book.css"]
  config:
    toc:
      before: |
        <li><a href="./"><img src="www/Republique_Francaise_RVB.png" width = "130"></a><a href="./index.html">C'est du PROPRE</a></li>
      after: |
        <li><a target= "_blank" href="http://thinkr.fr">ThinkR</a></li>

J'obtiens cette erreur.

Error in rmarkdown::html_document(..., extra_dependencies = extra_deps,  : 
  argument formel "includes" correspondant à plusieurs arguments fournis

Merci sébastien pour le problème de typo sur _output/yml ! pour includes, en effet je n'ai pas encore intégré de fusion de liste entre le include qu'on peut rajouter dans le template et le include par défaut de html_gouv(). cf ici

MaelTheuliere commented 3 years ago

Je ne peux pas ajouter d'includes dans le output

gouvdown::gitbook_gouv:
  includes:
    in_header: [matomo.html]
  css: ["style.css","marque_etat.css","gouv_book.css"]
  config:
    toc:
      before: |
        <li><a href="./"><img src="www/Republique_Francaise_RVB.png" width = "130"></a><a href="./index.html">C'est du PROPRE</a></li>
      after: |
        <li><a target= "_blank" href="http://thinkr.fr">ThinkR</a></li>

J'obtiens cette erreur.

Error in rmarkdown::html_document(..., extra_dependencies = extra_deps,  : 
  argument formel "includes" correspondant à plusieurs arguments fournis

Tu peux tester ça doit marcher maintenant...

statnmap commented 3 years ago

C'est bon pour le "includes".

MaelTheuliere commented 3 years ago

C'est bon pour le "includes".

* Maintenant je remarque autre chose avec le css. Certains stylesheet sont entrés en chemin absolu (default.css et stylesheet.css). Du coup, ce n'est pas portable.
  Je pousse jusqu'au bout pour être sûr que ça passe dans le CI... Courage !
  ![image](https://user-images.githubusercontent.com/21193866/96490007-85fba300-1240-11eb-9759-69e3929287d6.png)

* Pour le css, de la barre de menu de gauche, vous pouvez mettre la couleur de police bleue pour les menu en surbrillance:
.book .book-summary ul.summary li a:hover, .book .book-summary ul.summary li.active > a {
    color: #0B6BA8;
    background: 0 0;
    text-decoration: none;
}
* Pour "Marianne", vous pouvez mettre une police alternative en cas de problème: `font-family: "Marianne", Arial;` D'ailleurs, je ne suis pas sûr qu'elle soit prise en compte.

@statnmap, Marianne est bien pris en compte chez moi sur chromium mais pas sur firefox ?! Par contre sur html_gouv(), ça marche sur les deux. Je rajoute la police alternative. image

pour le css, tu dois avoir un problème de mise à jour. Normalement tu dois avoir ça, car maque_etat.css a été supprimé. image Après ça n'enlève pas le soucis du lien en dur. Il ne semble pas y avoir de soucis sur le format rmd classique html_gouv(). Dans les bonnes pratiques, le css il vaut mieux le mettre systématiquement dans une htmldependency ? Après c'est pas très grave ici car default.css est pris en compte en fichier importé à la racine également.

pour le menu de gauche, j'ai l'impression que ta proposition est déjà intégrée par défaut, en tout cas le comportement acutuel est bien de mettre le lien en 0B6BA8 quand il est actif ou en surbrillance.

codecov[bot] commented 3 years ago

Codecov Report

Merging #32 into master will decrease coverage by 6.83%. The diff coverage is 35.00%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master      #32      +/-   ##
==========================================
- Coverage   67.63%   60.80%   -6.84%     
==========================================
  Files           7        9       +2     
  Lines         275      324      +49     
==========================================
+ Hits          186      197      +11     
- Misses         89      127      +38     
Impacted Files Coverage Δ
R/ggthemes.R 82.30% <ø> (ø)
R/gitbook_gouv.R 0.00% <0.00%> (ø)
R/skeleton.R 0.00% <0.00%> (ø)
R/utils.R 50.00% <0.00%> (-50.00%) :arrow_down:
R/html_gouv.R 88.37% <87.50%> (-1.63%) :arrow_down:

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update ae1f17e...16925a7. Read the comment docs.