Coloriser les couleurs d'un fichier CSS dans Emacs
Ce tutoriel s'adresse aux utilisateurs et utilisatrices de GNU Emacs et ses dérivés.
Il est fréquent de définir des couleurs dans
un fichier CSS.
Certaines fois, on peut se demander quel couleur est définie par
rgb(red-value, green-value, blue-value) ou
une valeur hexadécimale.
Rainbow mode (écrit par Julien Danjou)
est un mode mineur pour Emacs qui colorise les couleurs,
ce qui évite de tester avec un fichier HTML ou
de passer par un logiciel d'imagerie pour connaitre la couleur.
Exemple
Sans rainbow mode
.blood { color: red; }
.color-hex { color: #e2572e; }
.color-rgb { color: rgb(30, 0, 76); }
.color-rgb2 { color: rgb(30, 60%, 76); }
Avec rainbow mode
.blood { color: red; }
.color-hex { color: #e2572e; }
.color-rgb { color: rgb(30, 0, 76); }
.color-rgb2 { color: rgb(30, 60%, 76); }
Installer
À partir de GNU Emacs 24.1,
M-x package-install RET rainbow-mode
permet de l'installer à condition que le système de gestion de paquets soit activé.
Il est aussi possible de le télécharger depuis GNU ELPA
et le placer dans un dossier faisant parti de load-path
(généralement ajouté avec
(add-to-list 'load-path "~/.emacs.d/packages/")).
Ensuite, il faut configurer Emacs, en modifiant votre fichier de configuration ".emacs" en Emacs Lisp. Il se trouve normalement dans votre dossier personnel, qui sous un système UNIX-like (comme une distribution GNU/Linux ou un *BSD) est facilement accessible avec "~/.emacs" ou "$HOME/.emacs".
Il faut ajouter (require 'rainbow-mode)
à votre fichier de configuration.
Ensuite pour activer le mode dans un buffer,
il faut utiliser M-x rainbow-mode
(avec M correspondant à la touche Mêta,
généralement Alt).
Gabriel Saldaña
explique comment activer le rainbow mode automatiquement en 2 instructions dans le fichier de configuration.
;; Mode CSS et rainbow
(defun all-css-modes() (css-mode) (rainbow-mode))
;; Charge les 2 modes si le nom de fichier fini par .css
(add-to-list 'auto-mode-alist '("\\.css$" . all-css-modes))