[SPIP Zone] plugin Crayon - Remplacement de l'icone par défaut par un Glyphicon de Bootstrap

Bonjour,

À toutes fins utiles, j’ai remplacé l’icône par défaut du plugin crayon qui signale qu’un contenu est éditable par un glyphicon de bootstrap (glyphicon-edit ou glyphicon-pencil) en éditant le fichier crayon.css qui se trouve à la racine du répertoire du plugin :

Remplacement de la ligne :

.crayon-icones em.crayon-crayon { background: url(images/crayon20.png) no-repeat; height: 20px; width: 20px; }

Par :

/* Modification pour remplacer l’icône par défaut du crayon par le glyphicon « pencil » (\270f) ou « edit » (\e065) de Bootstrap */

.crayon-icones em.crayon-crayon {

position: relative;

top: 1px;

display: inline-block;

font-family: ‹ Glyphicons Halflings ›;

font-style: normal;

font-weight: normal;

font-size: 130%;

line-height: 1;

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

}

em.crayon-crayon:before {

content: « \270f »;

}

Evidemment, cette modification ne fonctionne que si le plugin « bootstrap 3 » est installé. Je ne suis par contre pas parvenu à surcharger ce style puisque le fichier crayon.css est chargé en dernier dans le head, après la feuille squelettes/css/perso.css.

Je suggère aussi de mettre à jour cette icone par défaut qui m’évoque plus un petit papillon qu’un crayon :-).

-Frédéric

Le 07/12/2016 à 17:36, Frederic Lohier a écrit :

Bonjour,

À toutes fins utiles, j’ai remplacé l’icône par défaut du plugin crayon
qui signale qu’un contenu est éditable par un glyphicon de bootstrap
(glyphicon-edit ou glyphicon-pencil) en éditant le fichier crayon.css
qui se trouve à la racine du répertoire du plugin :

Remplacement de la ligne :

/.crayon-icones em.crayon-crayon { background: url(images/crayon20.png)
no-repeat; height: 20px; width: 20px; }/

Par :

//* Modification pour remplacer l'icône par défaut du crayon par le
glyphicon "pencil" (\270f) ou "edit" (\e065) de Bootstrap *//

/ /

/.crayon-icones em.crayon-crayon {/

/ position: relative;/

/ top: 1px;/

/ display: inline-block;/

/ font-family: 'Glyphicons Halflings';/

/ font-style: normal;/

/ font-weight: normal;/

/ font-size: 130%;/

/ line-height: 1;/

/ -webkit-font-smoothing: antialiased;/

/ -moz-osx-font-smoothing: grayscale;/

/}/

/em.crayon-crayon:before {/

/ content: "\270f";/

/}/

Evidemment, cette modification ne fonctionne que si le plugin
« bootstrap 3 » est installé. Je ne suis par contre pas parvenu à
surcharger ce style puisque le fichier crayon.css est chargé en dernier
dans le head, après la feuille squelettes/css/perso.css.

Je suggère aussi de mettre à jour cette icone par défaut qui m’évoque
plus un petit papillon qu’un crayon :-).

-Frédéric

----
spip-zone@rezo.net - http://listes.rezo.net/mailman/listinfo/spip-zone

Bonjour ,

en dupliquant la feuille crayon.css dans ton squelette elle devrait être surchargée a priori.

plus simplement surcharger le crayon.png est faisable en utilisant la font depuis photoshop ou gimp avec l'outil texte et en exportant ta découpe/tranche au format png.

--
Bonne journée
Arnaud B. (Mist. GraphX)