Ce Forum passera en lecture seule en janvier 2020
Image
Merci de vous rendre sur https://community.jeedom.com maintenant pour vos prochains postes ;)

Widget cercle température

Réservé à l'utilisation et la création de widgets dans JEEDOM
Avatar de l’utilisateur
Salvialf
Helper
Messages : 1334
Inscription : 24 févr. 2018, 09:37
Contact :

Re: Widget cercle température

Message par Salvialf » 17 mai 2019, 13:32

MiWa59 a écrit :
17 mai 2019, 11:54
Bonjour, est il possible de modifier la couleur du fond intérieur du widget ? Je parcours le code mais je ne trouve pas mon bonheur...
Salut,

Ton bonheur tu trouveras dans le fichier "circle.css" dans le répertoire: /plugins/widget/core/template/dashboard/cmd.info.numeric.Temperature_Circle/
VM Jeedom 3.2.16 sous Proxmox 5.4 sur NUC5i5RYH (Debian 9.9)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 17 mai 2019, 14:39

Ok merci ! Je vais bidouiller ça ;-)

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 17 mai 2019, 14:41

Salut, ça se passe dans le fichier css lié au Widget.
"plugins/widget/core/template/dashboard/cmd.info.numeric.Temperature_Circle/circle.css"

1) Pour la couleur de fond, c'est ligne 1154.

Code : Tout sélectionner

.c100.dark:after {
  background-color: #586363;
}
Ce que tu peux faire du coup, c'est passer par la "Personnalisation avancée".
Dans la fenêtre de droite "CSS", tu peux ajouter ce code (remplace red par la couleur que tu veux).
Pense à cocher la case "Activer".

Code : Tout sélectionner

.c100.dark:after {
  background-color: red!important;
}
Retourne sur ton dashboard, et si nécessaire, force le rafraîchissement avec CTRL+F5.

2) Tu auras peut-être besoin de changer la couleur du texte selon ton nouveau fond.

LIgne 1149

Code : Tout sélectionner

.c100.dark > span {
  color: #CBE2E2;
}
Idem, tu passes par la personnalisation avancée, et tu ajoutes (remplace #fff par la couleur de ton choix).

Code : Tout sélectionner

.c100.dark > span {
  color: #fff!important;
}
3) Et pour finir, la partie du cercle qui n'est pas colorée en vert/bleu/orange est modifiable aussi, ligne 1140.

Code : Tout sélectionner

.c100.dark {
  background-color: #777777;
}
Toujours dans la personnalisation avancée, remplace la couleur #777777 par celle de ton choix.

Code : Tout sélectionner

.c100.dark {
  background-color: #777777!important;
}
Merci à toute l'équipe pour le taf

Mon matériel

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 17 mai 2019, 15:25

Merci beaucoup Romanais pour cette réponse plus que complète !
1er test et je n'ai pas de changement mais je vais trouver !

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 17 mai 2019, 15:34

Tu as modifié où/comment ?
Tu as bien forcé le rafraîchissement du navigateur ? (vidé le cache ou CTRL+F5 sur pc pour forcer l'application des nouveaux styles).
Merci à toute l'équipe pour le taf

Mon matériel

benj29
Actif
Messages : 3983
Inscription : 26 mars 2017, 09:57
Contact :

Re: Widget cercle température

Message par benj29 » 18 mai 2019, 15:09

Bonjour,

J'ai fait la dernière mise à jour mais sur le dernier Jeedom (et même les versions précédentes) suivant le thème appliqué le résultat du widget est pour le moins surprenant...

Image

Une idée ?

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 18 mai 2019, 16:10

Non dsl.
J'utilise le thème darksobre et sur le dashboard uniquement.

Tu as ce rendu où ? Design ? Avec quel thème ? Tu as des choses paramétrées dans la personnalisation avancée ?
Quel navigateur ?
Merci à toute l'équipe pour le taf

Mon matériel

benj29
Actif
Messages : 3983
Inscription : 26 mars 2017, 09:57
Contact :

Re: Widget cercle température

Message par benj29 » 18 mai 2019, 21:35

Justement c'est presque tous les thèmes qui sont touchés.
J'utilise darksobre mais on m'a indiqué qu'il va disparaitre bientôt dans Jeedom.
Et il est quand même lourd (on voit bien que quand on change de thème, Jeedom est bien plus rapide).

Sous Chrome, Firefox, même combat.

EDIT : oui j'ai des choses dans config avancée (la correction résumé).

Code : Tout sélectionner

<FilesMatch ".(css)$">
Header set Cache-Control "max-age=0"
</FilesMatch>

.active {
text-decoration: none;
background-color: #3e444c;
}

/* pour avoir les bandes blanches alternées des graphiques */

.highcharts-plot-band {
	opacity: 0.1;
}

/* résumé en bonne couleur */

span[class^="objectSummaryParent"]:not([data-object_id = ""]) {
color: white !important;   
}

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 18 mai 2019, 23:28

romanais a écrit :
17 mai 2019, 15:34
Tu as modifié où/comment ?
Tu as bien forcé le rafraîchissement du navigateur ? (vidé le cache ou CTRL+F5 sur pc pour forcer l'application des nouveaux styles).
Bonsoir, j'ai essayé les deux techniques, en perso avancée j'ai rajouté les lignes que tu donnes sans effet mais je ne suis pas sûr de mon coup.
Quand je vais dans perso avancée, en CSS à droite, j'ai 397 lignes, j'ai copié/collé ton code, ça me parait bizarre de mettre ça la...

Deuxième technique en dans le circle.css, ligne 1154 j'ai bien

Code : Tout sélectionner

.c100.dark:after {
  background-color: #586363;
}
que je modifie par

Code : Tout sélectionner

.c100.dark:after {
  background-color: #2a2a2a;
  }
F5, Ctrl+F5 mais rien, ça reste désespérément blanc... et j'ai l'impression que c'est ça qui coince, la couleur #586363 est grise donc je pense que je ne cible pas le bon code...

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 19 mai 2019, 08:49

MiWa59 a écrit :
18 mai 2019, 23:28
romanais a écrit :
17 mai 2019, 15:34
Tu as modifié où/comment ?
Tu as bien forcé le rafraîchissement du navigateur ? (vidé le cache ou CTRL+F5 sur pc pour forcer l'application des nouveaux styles).
Bonsoir, j'ai essayé les deux techniques, en perso avancée j'ai rajouté les lignes que tu donnes sans effet mais je ne suis pas sûr de mon coup.
Quand je vais dans perso avancée, en CSS à droite, j'ai 397 lignes, j'ai copié/collé ton code, ça me parait bizarre de mettre ça la...

Deuxième technique en dans le circle.css, ligne 1154 j'ai bien

Code : Tout sélectionner

.c100.dark:after {
  background-color: #586363;
}
que je modifie par

Code : Tout sélectionner

.c100.dark:after {
  background-color: #2a2a2a;
  }
F5, Ctrl+F5 mais rien, ça reste désespérément blanc... et j'ai l'impression que c'est ça qui coince, la couleur #586363 est grise donc je pense que je ne cible pas le bon code...
La personnalisation css est faite pour ça, pour surcharger les divers autres styles existants.
Elle est bien activée (Case cochée) ?
Et c'est blanc depuis que tu as fait les modif's ?

Je viens de tester à nouveau et pas de soucis.
2.png
2.png (105.89 Kio) Consulté 439 fois
1.png
1.png (32.46 Kio) Consulté 439 fois
Idem sur le thème par défaut.
defaut.png
defaut.png (10.2 Kio) Consulté 439 fois
Merci à toute l'équipe pour le taf

Mon matériel

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 19 mai 2019, 09:31

benj29 a écrit :
18 mai 2019, 21:35
Justement c'est presque tous les thèmes qui sont touchés.
J'utilise darksobre mais on m'a indiqué qu'il va disparaitre bientôt dans Jeedom.
Et il est quand même lourd (on voit bien que quand on change de thème, Jeedom est bien plus rapide).

Sous Chrome, Firefox, même combat.

EDIT : oui j'ai des choses dans config avancée (la correction résumé).

Code : Tout sélectionner

<FilesMatch ".(css)$">
Header set Cache-Control "max-age=0"
</FilesMatch>

.active {
text-decoration: none;
background-color: #3e444c;
}

/* pour avoir les bandes blanches alternées des graphiques */

.highcharts-plot-band {
	opacity: 0.1;
}

/* résumé en bonne couleur */

span[class^="objectSummaryParent"]:not([data-object_id = ""]) {
color: white !important;   
}
Ah je ne vois pas de différence de navigation entre les thèmes (je ne reste que sur le Dashboard par contre).
D'ici que la V4 finale sorte et que tu bascules dessus, tu as encore quelques mois devant toi ;-)


A quoi te sert vraiment ce bout de code ?

Code : Tout sélectionner

<FilesMatch ".(css)$">
Header set Cache-Control "max-age=0"
</FilesMatch>
Parce que je viens de le tester, et j'ai changé la couleur du fond, j'ai de toute façon dû faire CTRL+F pour que le fond du cercle change de couleurs, donc ça ne doit pas trop agir sur le cache des feuilles de style.

C'est sur un design que tu as le souci ?

Tu peux faire une capture de ta personnalisation avec le bout de code ajouté ?
Merci à toute l'équipe pour le taf

Mon matériel

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 10:09

Bonjour Romanais et merci pour tes réponses, alors c'est blanc depuis l'installation, mes tentatives de modification n'ont rien changé.

Concernant la personnalisation avancée c'est bien activé. Par contre je ne saisis pas trop, je n'ai aucun choix pour sélectionner tel ou tel élément à personnaliser, j'ai une feuille CSS avec 397 lignes, par rapport à ta capture d'écran je ne retrouve nul part "gestion de la coupure des mots" donc je pense ne pas être sur la bonne feuille ! Comment en changer ?
Merci.

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 19 mai 2019, 10:24

Ça c'est moi qui l'ai mis, c'est le principe de cette feuille, on y met ce que l'on veut pour personnaliser certains éléments du site :-)
Ça me semble beaucoup 397, surtout si tu n'es pas à l'origine de leur mise en place.
Il y a peut-être un truc qui interfère.

C'est déjà pas normal que dès la base ce soit blanc.
Ce que tu peux faire :
Désactive cette feuille (en décochant la case).
Sauvegarde
Retourne sur ton Dashboard.
CTRL+F5
Et vois ce que ça donne.
Merci à toute l'équipe pour le taf

Mon matériel

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 11:22

J'ai désactivé la feuille et fait F5 et ctrl+F5, aucun changement, toujours blanc... Je l'ai réactivée, F5 et ctrl+F5, pareil toujours blanc...

J'y ai passé déjà quelques heures, j'ai modifié pas mal de code couleur (en les remettant à l'original après avoir testé) et je ne constate jamais de changement, je dois avoir un "truc" (plugin, widget, mod, virus, envoûtement...) qui prend le dessus et qui empêche de modifier les couleurs...

Avatar de l’utilisateur
Salvialf
Helper
Messages : 1334
Inscription : 24 févr. 2018, 09:37
Contact :

Re: Widget cercle température

Message par Salvialf » 19 mai 2019, 11:34

Bonjour,

Juste pour être sûr et si ta version de jeedom est inférieure à la 3.3.24: est-ce que la ça case "Activer la personnalisation du code" est bien décochée dans l'onglet "code" des paramètres de la commande?

Sinon quand tu fais une modification dans le code d'un widget, il faut redimensionner la tuile sur le dashboard pour que les changements soient appliqués
VM Jeedom 3.2.16 sous Proxmox 5.4 sur NUC5i5RYH (Debian 9.9)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 11:53

Bonjour Salviaff, je suis en 3.3.21 et je ne situe pas trop l'onglet "code" des paramètres de la commande...

Alors j'ai enfin réussi à faire ce que je voulais en utilisant une autre méthode, j'ai créé un objet bidon sur lequel j'ai affiché un thermomètre puis j'ai utilisé la fonction inspecter de Chrome, j'ai rapidement localisé le code couleur et la modification fonctionne !

Néanmoins je vous remercie pour vos infos, elles me servent à comprendre la mécanique de jeedom.

romanais
Actif
Messages : 1999
Inscription : 21 août 2014, 21:36
Localisation : Drôme

Re: Widget cercle température

Message par romanais » 19 mai 2019, 13:51

Du coup ça donne quoi pour le fond de ton cercle d'origine ?
Il n'est plus blanc ? Tu as utilisé quel code et où ?
C'était vraiment curieux ton souci
Merci à toute l'équipe pour le taf

Mon matériel

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 18:52

Tu me croiras ou pas, mais je reviens après quelques heures et le fond de mes widgets sont repassés en blanc... C'est vraiment pénible...
Je tente de retrouver la ligne de commande pour les modifier.
Dernière édition par MiWa59 le 19 mai 2019, 19:32, édité 2 fois.

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 19:25

J'ai retrouvé ce que je modifie,
circle.css:287

et le code est

Code : Tout sélectionner

.c100:after {
    position: absolute;
    top: 0.08em;
    left: 0.08em;
    display: block;
    content: " ";
    border-radius: 50%;
    background-color: #2a2a2a;
    width: 0.84em;
    height: 0.84em;
Je l'ai modifié tout à l'heure et apparemment le code "background-color" a changé automatiquement...
(Le #2a2a2a c'est moi qui l'ai mis.)

Edit : F5 et ça repasse en blanc, ça commence à sérieusement me gonfler...

MiWa59
Timide
Messages : 88
Inscription : 25 mars 2019, 12:02

Re: Widget cercle température

Message par MiWa59 » 19 mai 2019, 20:05

J'ai fait plusieurs tests, je peux changer les valeurs de couleurs, après un F5 toutes les valeurs reviennent à la valeur initiale...

Répondre

Revenir vers « [Plugin officiel] Widgets »

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités