Bandeau

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon... et de qui veut.

Icônes et zone de saisie

Yann
le 8 mars 2019
à 09:52
Rappel du sujet :

Bonjour,
Avec les dernières MAJ, je rencontre quelques soucis :

 L’icône down de recommander la page se chevauche
 le texte des zones de saisie et bouton (identification, inscription lettre d’information par exemple) sont en bleu escal
 dans la noisette Lettre d’information, le bouton "m’inscrire..." n’est plus centré
 dans la barre d’outils articles les icônes imprimer, pdf sont trop espacées par rapport aux autres icônes mail,facebook, etc.

Yann

Icônes et zones de saisie

Bon pour l’icône Down de recommander c’est résolu. Pour le reste je n’ai pas trouvé.

Yann

icones et zones de saisie

Hello

Pour l’icone "down" comment as-tu fait ? Et c’est bizarre qu’il y ait un souci, je ne reproduis pas. Je soupçonne un problème de cache css.

Pour les zones de saisie, c’est volontaire mais on peut changer cette couleur avec

.cadre-couleur .formulaire_spip input{
	color: #xxxxxx;
}

dans perso.css
Je vais voir si je peux pas l’ajouter dans la configuration.

Pour le bouton non centré, je n’ai touché à rien de ce côté-là mais je vais corriger pour qu’il le soit.

Enfin, pour l’espace entre les icônes, c’est volontaire pour une meilleure utilisation sur mobile (recommandation google transmise par Jaseur Boréal).

Ce qui serait sympa, c’est que pendant la mise en place de ton site, tu désactives la compression des css pour que j’y voie plus clair. Ce sera plus facile pour t’aider.

icones et zones de saisie

En fait pour l’icône down c’est de ma faute. dans mon perso css je pointais vers un fichier png au lieu du svg. Mais c’est réglé.

Pour les zones de saisie c’est tout bon.

Pour le bouton non centré merci d’avance.

Pour les espaces des icônes je comprends et c’est ok. Pas de souci.

Par contre je veux bien désactiver la compression des css, mais comment fait-on ?

Yann

https://contrib.spip.net/Vider-rubrique

Et hop, la couleur du texte des zones de saisie est maintenant paramétrable dans la config d’escal.

icones et zones de saisie

Super. Merci.

icones et zones de saisie

Mais pourquoi des css pour pointer vers une image ?
Il suffit de copier l’image d’escal dans /squelettes/images et de changer sa couleur. Je pense que tu dois nettoyer un peu ton fichier perso.css qui me semble encombré de choses inutiles. Je dirais que tout ça est à enlever car soit inutile, soit paramétrable maintenant dans Escal (à tester au cas par cas comme dirait ma fenêtre) :

#recommander h2:after{
	content: url(../images/down.svg);
	height: 16px;
	padding-left: 5px;	
}
#outils-article img, #outils-article .article-pdf, #diminuer img, #augmenter img {
    height: 16px;
}
.identification-light a, .formulaire_recherche input.text,
.identification-light a:hover, .formulaire_recherche input.text:hover{
	color: #623b70 !important;
}
img.icone-pied{
	height: 16px;
}
.cadre-couleur .formulaire_spip input{
    color: #623b70;
}
icones et zones de saisie

Bon si on veut quand même changer l’espace entre les icônes, il faut personnaliser ce code dans perso.css (en diminuant les 2 valeurs de 8px)

.outil, #diminuer, #augmenter {
    margin: 0 8px 5px 8px;
}

Pour désactiver la compression des css, il faut aller dans "Configuration" -> "fonctions avancées" -> bloc tout en bas de la page

icones et zones de saisie

Merci Jean-Christophe.

En effet mon fichier perso css a besoin d’être nettoyé. Beaucoup de choses sont désormais paramétrables dans Escal et n’ont plus lieu d’être dans ce fichier.

Yann

icones et zones de saisie

Bon il me reste 2 choses à peaufiner : les cadres couleur du message du forum et écrire à un auteur où les cadres sont bleus.

icones et zones de saisie

Si tu me donnes un exemple précis, je dois pouvoir t’aider.

icones et zones de saisie

Bonjour Jean-Christophe,

Voici les exemples des 3 dernières personnalisations que je souhaiterais faire pour harmoniser avec la couleur d’ensemble du site.

Yann

zones de saisie

Ah ouais là on est dans le détail du détail ... tu parles bien du filet très fin bleu qui apparaît au survol de ces zones ?

zones de saisie

Oui ! 🙂

que veux-tu, j’ai le souci du détail...je sais c’est parfois pénible pour mon entourage ! lol

En même temps ça valorise les possibilités déjà nombreuses d’Escal et son adaptabilité aux différentes demandes.

Yann

zones de saisie

ok mais c’est pas du Escal, c’est du spip ou lié au navigateur car chez moi c’est plutôt rouge que bleu et pas dans la case du message et je n’ai pas de cadre bleu au survol de la case à cocher.
Essaye quand même de mettre ce code dans perso.css pour voir si ça te va mieux.

.formulaire_spip .text:focus{
	border: 2px solid #623b70;
	border-radius: 5px;
}
zones de saisie

J’ai essayé. ça ne change rien. ça doit être du Spip car j’ai essayé avec plusieurs navigateurs et j’obtiens la même chose.

Bon ce n’est pas dramatique.

Yann

zones de saisie

ah ? Je suis étonné que cela ne change rien !
Normalement au clic dans une case de saisie (hors texte de message), ça devrait provoquer l’affichage d’une bordure violette.

zones de saisie

Oui je confirme. Mais je me demande si ça ne vient pas des navigateurs quand même. J’ai vu qu’ils utilisent à peu près le même bleu.

zones de saisie

Sauf que je ne vois pas le code proposé dans ton perso.css ...

zones de saisie

Ooops ! Comme cela ne changeait rien je l’avais retiré... Je viens de le remettre.

Réagir au sujet
Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.
Attention ! Si votre message contient un lien, il devra être validé par le webmestre. Inutile de le poster à nouveau ;-)

Ajouter un document

Plan du site Contact Mentions légales Données personnelles et cookies Espace privé squelette RSS

2009-2025 © Escal - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 5.2.14