Configurer et utiliser les packages Pigments et Color Picker
Objectifs
Les objectifs de cette vidéo sont de présenter les packages Pigments et Color Picker, de démontrer leur configuration et utilisation, et de faciliter la gestion des couleurs dans Atom.
Résumé
En tant que développeur front, apprenez à gérer de nombreuses couleurs dans Atom grâce aux packages Pigments et Color Picker.
Description
En tant que développeur front, nous sommes souvent confrontés à la gestion complexe de nombreuses couleurs dans notre code. Pour répondre à ce défi, ATOM propose le package Pigments, développé par Ape33. Pigments offre une option de configuration appelée Marker Type, qui permet de personnaliser l'affichage des couleurs. Actuellement, les options Native Dot et Native Square Dot peuvent causer des instabilités, mais l'option Gutter est stable et largement utilisée dans de nombreux IDE. Une fois configuré, Pigments affiche les couleurs détectées dans le fichier CSS sur le côté.
Habituellement, pour modifier des couleurs, nous utilisons un color picker en ligne, ce qui implique de changer de fenêtre et de rechercher ce outil. Atom fournit une solution intégrée avec le package Color Picker, développé par Thomas Lindstrom. Color Picker propose deux principales options de configuration : Automatically Replace Color, qui modifie la couleur directement si le curseur est au milieu de la couleur, et Preferred Color Format, qui définit le format par défaut des couleurs (hexadécimal, dans ce cas). Pour utiliser ce package, il suffit de faire un clic droit sur une couleur et de sélectionner Color Picker.