Colors/fr

Il s'agit d'une librairie de manipulation des couleurs dans l'environnement FANDOM. Elle a deux buts principaux :


 * 1) Donner une liste des couleurs les plus importantes sur la page actuelle, afin d'adapter plus aisément l'apparence de l'add-on sur le schéma de couleurs du Wiki hôte
 * 2) Ajouter un nombre important de fonctions de manipulation des couleurs, afin de construire son propre schéma de couleur en plus de celui du Wiki hôte

Note : Cette librairie a été construire notamment pour les développeurs JavaScript. Si vous n'écrivez pas de script, elle ne vous sera d'aucune utilité. Plus d'informations sur les couleurs peuvent être trouvées ici.

Appliquer les couleurs
Le moyen le plus facile d'utiliser les couleurs ci-dessus est d'utiliser un CSS basique mais d'utiliser les pseudo-couleurs au lieu de celles de départ :

Ajoutez toutes ces règles à une chaîne de caractère qu'il faudra passer dans dev.colors.css. dev.colors.css remplacera toutes les pseudo-valeurs et les ajoutera à la tête du document de la feuille de style :

Exemple 1 :

Il est possible d'utiliser un second paramètre optionnel afin d'ajouter vos propres pseudo-valeurs. Leurs noms doivent commencer par un symbole $ :

Exemple 2 :

Clair et sombre
La partie la plus importante pour la construction de schémas de couleur sur FANDOM est de déterminer s'il est plutôt clair ou plutôt sombre. dev.colors offre une méthode afin de déterminer ce point, mais le plus important est qu'il ajoutera deux classes à l'étiquette body :


 * 1)   ou   – selon si l'arrière-plan du menu et des boutons est clair ou sombre
 * 2)   ou   – selon si l'arrière-plan de l'endroit où se situe l'article est clair ou sombre

Manipuler les couleurs
Afin de manipuler les couleurs il faut d'abord créer un objet de couleurs color. dev.colors donne trois fonctions :

Une fois l'objet de couleur créé, il est possible de le manipuler:

Négation des couleurs
dev.colors a deux fonctions pour la négation des couleurs : complement (complémenter) et invert (inverser). Si les deux sont simples mathématiquement, leur effet sur les couleurs est assez difficile à visualiser :


 * invert affecte la teinte, la saturation et la luminosité d'une couleur car agit sur l'espace RVB :

rgb inverted = rgb(max r – r, max g – g, max b – b)
 * complement n'affecte que la teinte. La saturation et la luminosité restent donc inchangées.:

hsl complemented = hsl(max h – h, s, l)

La conséquence la plus évidente est que complement n'affecte que les couleurs autres que le noir, le blanc, et les autres nuances de gris intermédiaires.

Quelques exemples :

Convertir les objets de couleurs en chaînes de caractères
Après avoir mélangé et mis ensemble les couleurs souhaitées, il faudra les convertir en chaînes de caractères afin de pouvoir les utiliser dans le CSS :

Conditions de bord
L'espace de couleurs HSL permet des changements n'ayant aucun effet visuel :


 * Si la saturation de la couleur est de 0, la couleur restera dans les nuances de gris et le changement de teinte restera sans effet
 * Si la luminosité est de 0, la couleur demeurera noire et donc ni le changement de teinte ni celui de la saturation n'aura le moindre effet

La librairie ne filtre et ne supprime pas les valeurs sans effet.

Les méthodes suivantes utilisent l'espace de couleur HSL (Teinte Saturation Lumière):


 * Color.rotate
 * Color.hue
 * Color.saturate
 * Color.saturation
 * Color.lighten
 * Color.lightness
 * Color.complement

Color.toString
__NOWYSIWYG__