medialab / website

The lab's static website and its admin.
GNU Affero General Public License v3.0
12 stars 4 forks source link

Styliser le code dans les posts #495

Open boogheta opened 4 years ago

boogheta commented 4 years ago

Dans le billet sur le point de paraitre sur "crawler/scraper son propre site", on a besoin de montrer un exemple de code. Je me dis que c'est un usage qu'on pourra avoir de nouveau de temps en temps.

En l'état on n'a pas prévu de balise type <code>, du coup pour ce cas, on avait utilisé le <> du cms, qui rend très bien dans le backoffice mais pas du tout dans le rendu puisque ca met le contenu brut direct dans le html.

Du coup en attendant, j'ai opté pour une balise <pre> stylisée dans le <> :
<pre style="font-size: 15px; font-weight: bold; background-color: lightgrey; padding: 15px; margin: 0px 35px 35px 0px;">minet fetch --throttle 0.5 url old-pages-URLs.csv > old-pages-test-results.csv</pre>

À peaufiner, mais je pense qu'on peut partir dans l'idée que <pre> ne sera jamais utilisé pour autre chose sur le site, et du coup mettre dans le css global un style de ce genre pour les balises pre, et se rappeller d'utiliser ça à l'avenir quand on veut ajouter du code.

À moins de meilleures idées... :)

Yomguithereal commented 4 years ago

Je pense faire un bloc custom pour ça dans l'éditeur (qui sera probablement stocké en <pre> oui) et passer un coup de coloration syntaxique au moment du templating.

robindemourat commented 4 years ago

Ce serait top (j'ai intégré les styles utilisés ci-dessus dans le css pour tous les éléments <pre> pour l'instant). En attendant d'avoir la feature complète dans le CMS on pourrait aussi utiliser des blocs issus de services de partage de code type codepen ou glitch, on aurait stylisation et coloration syntaxique+features type code copiable gratuitement !