Customisation des couleurs du code : exemple

Dans cet exemple, j'ai recopié le contenu du fichier lib/styles/geshi.less dans un fichier conf/userstyle.css et modifié certaines lignes (celles avec un commentaire)

V3

userstyle.css

/**
 * conf/userstyle.css
 *
 * Personnalisation de l'affichage
 * Création le 20/04/2015
 * ...
 */
 
 /* Modification des couleurs du code basée sur le fichier lib/styles/geshi.less pour que ça corresponde à celles de notepad++ */
 
 .code {
    .co0 {
        color: #666666; /* gris foncé*/
        font-style: italic;
    }
 
    .co4 {
        color: #cc0000; /* rouge */
        font-style: italic;
    }
 
    .es5 {
        color: #006699; /* bleu */
        font-weight: bold;
    }
 
    .es6 {
        color: #009933;
        font-weight: bold;
    }
 
    .kw2 {
        color: #000000;
        font-weight: bold;
    }
 
    .kw5 {
        color: #000000;  /* Couleur des paramètres ; defaut : vert:#008000; */
    }
 
    .kw6 {
        color: #000000; /* Couleur de $_ ; defaut : fushia:#f08; */
        font-weight: bold;
    }
 
    .me0 {
        color: #004000;
    }
 
    .nu0 {
        color: #FF8400; /* Couleur de ?? ; defaut : mauve:#cc66cc; */
    }
 
    .re0 {
        color: #000000;  /* Couleur des variables ; defaut : bleu:#0000ff; */
		font-weight: bold;
    }
 
    .re3 {
        color: #ff3333;
        font-weight: bold;
    }
 
    .re4 {
        color: #009999;
    }
 
    .re5 {
        color: #660033;
    }
 
    .sc-2 {
        color: #404040; /* ?? */
    }
 
    .sy3 {
        color: #000040;
    }
 
    .br0, .sy0 {
        color: #000080; /* Couleur des marqueurs (accolades,...) ; defaut : vert clair:#66cc66; */
		font-weight: bold;
    }
 
    .co1, .coMULTI, .sc-1 { 
        color: #008000;  /* Couleur des commentaires ; defaut : gris:#808080; */
        font-style: italic;
    }
 
    .co2, .sy1 {
        color: #339933;
    }
 
    .co3, .sy4 {
        color: #008080;
    }
 
    .es0, .es1, .esHARD {
        color: #000099;
        font-weight: bold;
    }
 
    .es2, .es3, .es4 {
        color: #660099;
        font-weight: bold;
    }
 
    .kw1, .kw8 {
        color: #973AFF; /* Couleur des cmdlets ; defaut : jaune sale:#b1b100; */
    }
 
    .kw10, .kw11, .kw12, .kw9 {
        color: #003399;
        font-weight: bold;
    }
 
    .kw13, .kw14, .kw15, .kw16, .me1, .me2 {
        color: #006600;
    }
 
    .kw3, .kw7, .sy2 {
        color: #0000FF; /* Couleur des mots syntaxiques ? : defaut : bleu fonce : #000066; */
		font-weight: bold;
    }
 
    .kw4, .re2 {
        color: #993333;
    }
 
    .re1, .st0, .st_h {
        color: #808080; /* Couleur des chaines de caractères : defaut : bleu fonce : #ff0000; */
    }
}

V2

userstyle.css

/**
 * conf/userstyle.css
 *
 * Personnalisation de l'affichage
 * Création le 20/04/2015
 * ...
 */
 
 /* Modification des couleurs du code basée sur le fichier lib/styles/geshi.less pour que ça corresponde à celles de notepad++ */
 
 .code {
    .co0 {
        color: #666666; /* gris foncé*/
        font-style: italic;
    }
 
    .co4 {
        color: #cc0000; /* rouge */
        font-style: italic;
    }
 
    .es5 {
        color: #006699; /* bleu */
        font-weight: bold;
    }
 
    .es6 {
        color: #009933;
        font-weight: bold;
    }
 
    .kw2 {
        color: #000000;
        font-weight: bold;
    }
 
    .kw5 {
        color: #008000;
    }
 
    .kw6 {
        color: #000000; /* Couleur de $_ ; defaut : fushia:#f08; */
        font-weight: bold;
    }
 
    .me0 {
        color: #004000;
    }
 
    .nu0 {
        color: #FF8400; /* Couleur de ?? ; defaut : mauve:#cc66cc; */
    }
 
    .re0 {
        color: #000000;  /* Couleur des variables ; defaut : bleu:#0000ff; */
    }
 
    .re3 {
        color: #ff3333;
        font-weight: bold;
    }
 
    .re4 {
        color: #009999;
    }
 
    .re5 {
        color: #660033;
    }
 
    .sc-2 {
        color: #404040; /* ?? */
    }
 
    .sy3 {
        color: #000040;
    }
 
    .br0, .sy0 {
        color: #000080; /* Couleur des signes ; defaut : vert clair:#66cc66; */
    }
 
    .co1, .coMULTI, .sc-1 { 
        color: #008000;  /* Couleur des commentaires ; defaut : gris:#808080; */
        font-style: italic;
    }
 
    .co2, .sy1 {
        color: #339933;
    }
 
    .co3, .sy4 {
        color: #008080;
    }
 
    .es0, .es1, .esHARD {
        color: #000099;
        font-weight: bold;
    }
 
    .es2, .es3, .es4 {
        color: #660099;
        font-weight: bold;
    }
 
    .kw1, .kw8 {
        color: #973AFF; /* Couleur des cmdlets ; defaut : jaune sale:#b1b100; */
    }
 
    .kw10, .kw11, .kw12, .kw9 {
        color: #003399;
        font-weight: bold;
    }
 
    .kw13, .kw14, .kw15, .kw16, .me1, .me2 {
        color: #006600;
    }
 
    .kw3, .kw7, .sy2 {
        color: #0000FF; /* Couleur des mots syntaxiques ? : defaut : bleu fonce : #000066; */
    }
 
    .kw4, .re2 {
        color: #993333;
    }
 
    .re1, .st0, .st_h {
        color: #808080; /* Couleur des chaines de caractères : defaut : bleu fonce : #ff0000; */
    }
}

V1

userstyle.css

/**
 * conf/userstyle.css
 *
 * Personnalisation de l'affichage
 * Création le 20/04/2015
 * ...
 */
 
 /* Modification des couleurs du code basée sur le fichier lib/styles/geshi.less pour que ça corresponde à celles de notepad++ */
 
 .code {
    .co0 {
        color: #666666; /* gris foncé*/
        font-style: italic;
    }
 
    .co4 {
        color: #cc0000; /* rouge */
        font-style: italic;
    }
 
    .es5 {
        color: #006699; /* bleu */
        font-weight: bold;
    }
 
    .es6 {
        color: #009933;
        font-weight: bold;
    }
 
    .kw2 {
        color: #000000;
        font-weight: bold;
    }
 
    .kw5 {
        color: #008000;
    }
 
    .kw6 {
        color: #f08;
        font-weight: bold;
    }
 
    .me0 {
        color: #004000;
    }
 
    .nu0 {
        color: #cc66cc;
    }
 
    .re0 {
        color: #000000;  /* Couleur des variables ; defaut : bleu:#0000ff; */
    }
 
    .re3 {
        color: #ff3333;
        font-weight: bold;
    }
 
    .re4 {
        color: #009999;
    }
 
    .re5 {
        color: #660033;
    }
 
    .sc-2 {
        color: #404040; /* ?? */
    }
 
    .sy3 {
        color: #000040;
    }
 
    .br0, .sy0 {
        color: #000080; /* Couleur des signes ; defaut : vert clair:#66cc66; */
    }
 
    .co1, .coMULTI, .sc-1 { 
        color: #008000;  /* Couleur des commentaires ; defaut : gris:#808080; */
        font-style: italic;
    }
 
    .co2, .sy1 {
        color: #339933;
    }
 
    .co3, .sy4 {
        color: #008080;
    }
 
    .es0, .es1, .esHARD {
        color: #000099;
        font-weight: bold;
    }
 
    .es2, .es3, .es4 {
        color: #660099;
        font-weight: bold;
    }
 
    .kw1, .kw8 {
        color: #973AFF; /* Couleur des cmdlets ; defaut : jaune sale:#b1b100; */
    }
 
    .kw10, .kw11, .kw12, .kw9 {
        color: #003399;
        font-weight: bold;
    }
 
    .kw13, .kw14, .kw15, .kw16, .me1, .me2 {
        color: #006600;
    }
 
    .kw3, .kw7, .sy2 {
        color: #0000FF; /* Couleur des mots syntaxiques ? : defaut : bleu fonce : #000066; */
    }
 
    .kw4, .re2 {
        color: #993333;
    }
 
    .re1, .st0, .st_h {
        color: #808080; /* Couleur des chaines de caractères : defaut : bleu fonce : #ff0000; */
    }
}

Table of Contents

Customisation des couleurs du code : exemple

V3

V2

V1