Voyant sur bouton dans design

[PoLo]

Bonjour tout le monde,

Je suis en train de me faire un petit design sur Jeedom .
Je rencontre un petit problème esthétique sur mes boutons dans mes designs .
Utilisant un écran tactile qui émule ma souris (capacitif mono-touch), dès que je touche ou survole un bouton j’ai ce petit voyant qui s’affiche un bas a gauche de l’équipement .
Le souci est que le voyant reste « allumé » même une fois le doigt enlevé . Vu que mon écran émule une souris, le curseur (invisible) reste sur le bouton et le voyant ne s’éteint pas .
C’est pas un gros souci mais c’est pas très WAF d’après ma femme …

Donc ma question : il y a t’il une possibilité de masquer ce voyant ou de lui donner une autre couleur ?

Je suis sous la version 4.1.28 sous un Debian AMD64 (PC sous linux)

Je vous mets les images du voyant incriminé :

[nerull77]

Bonjour,

Si tu cliques apres sur un emplacement sans bouton ca retirerait pas le soucis?

Apes truc plus simple aussi prendre une tablette pour la mettre a la place.

Personnellement je me suis trouver une tablette en 10 pouces payé d’occasion sur le bon coin a 10€ ca marche nickel.

[PoLo]

salut,

Oui, si je clique sur un endroit de l’écran ou il n’y a pas de bouton le voyant se retire .
Le souci est que mon écran est un 22" fullHD, donc repasser sur un 10" … Je suis pas très chaud .
De plus, j’ai déjà l’écran donc pourquoi acheter un autre matériel alors qu’il y a peut être une solution simple (que je ne connais pas encore) .

[Salvialf]

Salut,

Ce voyant apparait en orange sur les commandes actions et en bleu sur les commandes info lors d’un survol de souris (mouseenter). Il disparaît normalement lorsque la souris quitte l’icône (mouseleave).

A voir comment tu as codé tes designs et dans quelle mesure tu pourrais gérer ce mouseleave en javascript ? Sinon effectivement la solution est de cliquer ailleurs sur l’écran.

[PoLo]

C’est juste un simple widget on/off fait par jeedom sans rien de spécial .
Action/binaire - (une image sur on et une autre sur off)

[Phpvarious]

Bonsoir,
petit moyen de contourner, c’est de changer la couleur de ceux-ci par la couleur du background de la tuile dans le css personnalisé (custom.css) :

Pour masquer le point sur les commandes action :

[data-page="plan"] .eqLogic-widget.eqSignalAction:after {
  color: #1d1d1d;
}

Pour masquer le point sur les commandes info (historisées) :

[data-page="plan"] .eqLogic-widget.eqSignalInfo:after {
  color: #1d1d1d
}

[Salvialf]

Je partais sur la même idée avec un line-height à 0

[PoLo]

Grand merci @Phpvarious , j’ai mis un transparent au lieu de #1d1d1d et cela fonction nikel

[data-page="plan"] .eqLogic-widget.eqSignalAction:after {
  color: transparent;
}