À propos du projet
github-markdown-css est un petit package CSS dont l'objectif déclaré est de reproduire le style visuel que GitHub applique au Markdown rendu, en utilisant la quantité minimale de CSS nécessaire. La feuille de style est générée plutôt que modifiée à la main; le README oriente les contributions vers le dépôt séparé generate-github-markdown-css.
L'utilisation est simple : importer github-markdown.css, ajouter une classe markdown-body au conteneur de votre Markdown rendu, et définir une largeur. Le README indique que GitHub utilise une largeur de 980px avec un padding de 45px, et 15px sur mobile, et fournit un exemple avec box-sizing, min-width, max-width, margin auto, et une media query pour les petits écrans. Une couleur de fond pour le mode sombre est également montrée via prefers-color-scheme.
Le package fournit sept thèmes : un thème par défaut qui bascule automatiquement entre clair et sombre via prefers-color-scheme, un thème clair uniquement, un sombre uniquement, un sombre atténué, un sombre à contraste élevé, un sombre pour daltoniens (protanopie et deutéranopie), et des variantes claires pour daltoniens.
Pour du HTML correspondant à ces styles, le README suggère l'API /markdown de GitHub, qui produit le HTML que GitHub génère lui-même. Il note que les autres analyseurs Markdown fonctionneront aussi avec ces styles, et recommande starry-night pour la coloration syntaxique imitant GitHub.
Les options d'installation incluent le téléchargement manuel du fichier, l'utilisation de CDNJS, ou npm install github-markdown-css. Une page de démonstration est liée.
Une note de dépannage explique que les problèmes de style, comme des polices de tableau noires en mode sombre, peuvent provenir du navigateur passant en mode quirks; inclure un doctype en haut de la page évite ce problème. Pour le développement, npm run make met à jour le CSS.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.