My template nodes are ignoring my relations

Dashboard
1

Hi erveryone,

I'm trying to change my gauge css properties depending in wha'ts the value of my msg.status. So I added a switch and I have a template for each option like on the image.

image

But my css is allways changing for the bottom template properties, even when the program don't pass there.

My up template code:

<style>
    
    [node-id="2074463f2a4e057d"]{
    
        border: 4px solid red !important;
        color: black !important;
        border-radius: 20px;
    
    }
    
</style>

My bottom template:

<style>
    
    [node-id="2074463f2a4e057d"]{
    
        border: 4px solid black !important;
        /*border: none !important;*/
    
    }
    
</style>

Thanks in advance!

2

If these are head templates then they will both be present in the output & the bottom one will always win.

A better solution is to use class names....

image

image

Check the built in help info on the dashboard nodes and search the forum for msg.className for clues

2 Likes
3

Hi @Steve-Mcl thanks for the reply. It's working now! :smiling:

I don't know if it's better to create a new topic for this new question, but how can I change the color of the gauge metrics text?

image

4

Probably :wink:

Here is a demo for you to play with...

(Use CTRL-I to import)

[{"id":"ea334285a1c63cbd","type":"ui_template","z":"7ecba32db86f0617","group":"ef2301c8f15e8f4a","name":"Head template styles","order":2,"width":0,"height":0,"format":"<style>\n     .red-border .nr-dashboard-gauge svg {\n        border: 4px solid red !important;\n        color: black !important;\n        border-radius: 20px;\n    }\n\n    .simple-border .nr-dashboard-gauge svg {\n        border: 4px solid black !important;\n        /*border: none !important;*/\n    }\n    \n    .red-gauge-text .nr-dashboard-gauge text {\n        fill: red !important;\n    }\n    \n    .green-gauge-text .nr-dashboard-gauge text {\n        fill: green !important;\n    }\n</style>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"global","className":"","x":1020,"y":440,"wires":[[]]},{"id":"17863e1bd2c477b3","type":"ui_gauge","z":"7ecba32db86f0617","name":"","group":"ef2301c8f15e8f4a","order":3,"width":0,"height":0,"gtype":"gage","title":"gauge","label":"units","format":"{{value}}","min":0,"max":10,"colors":["#00b500","#e6e600","#ca3838"],"seg1":"","seg2":"","className":"","x":1290,"y":580,"wires":[]},{"id":"a2c5cb774e54d342","type":"change","z":"7ecba32db86f0617","name":"red-border","rules":[{"t":"set","p":"className","pt":"msg","to":"red-border","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":990,"y":500,"wires":[["17863e1bd2c477b3"]]},{"id":"c549ae52ecc81c9d","type":"inject","z":"7ecba32db86f0617","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"5","payloadType":"num","x":830,"y":500,"wires":[["a2c5cb774e54d342"]]},{"id":"c15144351af12644","type":"change","z":"7ecba32db86f0617","name":"red-border green-gauge-text","rules":[{"t":"set","p":"className","pt":"msg","to":"red-border green-gauge-text","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":1040,"y":580,"wires":[["17863e1bd2c477b3"]]},{"id":"34f2b82dcae7934c","type":"change","z":"7ecba32db86f0617","name":"simple-border green-gauge-text","rules":[{"t":"set","p":"className","pt":"msg","to":"simple-border green-gauge-text","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":1050,"y":660,"wires":[["17863e1bd2c477b3"]]},{"id":"685af3951f3f15c8","type":"change","z":"7ecba32db86f0617","name":"simple-border","rules":[{"t":"set","p":"className","pt":"msg","to":"simple-border","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":1000,"y":620,"wires":[["17863e1bd2c477b3"]]},{"id":"24263e80a6458842","type":"change","z":"7ecba32db86f0617","name":"red-border red-gauge-text","rules":[{"t":"set","p":"className","pt":"msg","to":"red-border red-gauge-text","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":1030,"y":540,"wires":[["17863e1bd2c477b3"]]},{"id":"fd6240e5fd474449","type":"inject","z":"7ecba32db86f0617","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"7","payloadType":"num","x":830,"y":540,"wires":[["24263e80a6458842"]]},{"id":"89bb34d8f4e3d33f","type":"inject","z":"7ecba32db86f0617","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"2","payloadType":"num","x":830,"y":580,"wires":[["c15144351af12644"]]},{"id":"53dfdf157e86478f","type":"inject","z":"7ecba32db86f0617","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"9","payloadType":"num","x":830,"y":660,"wires":[["34f2b82dcae7934c"]]},{"id":"49c5143d5813f089","type":"inject","z":"7ecba32db86f0617","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"1","payloadType":"num","x":830,"y":620,"wires":[["685af3951f3f15c8"]]},{"id":"ef2301c8f15e8f4a","type":"ui_group","name":"Carica Certificato Taratura","tab":"21286fd2ee7bdc0c","order":5,"disp":true,"width":"10","collapse":false,"className":""},{"id":"21286fd2ee7bdc0c","type":"ui_tab","name":"Inserimento Date Controllo","icon":"assignment","order":5,"disabled":false,"hidden":false}]

chrome_e87PpkUGhJ

1 Like
5

This was exactly what I needed. Thanks a lot for the help!

6

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.