Hi,
Now we are a few versions further, is there anything to make this easyer in the latest versions?
Thanks…
control visibility via device status
Hi,
Now we are a few versions further, is there anything to make this easyer in the latest versions?
Thanks…
@lschip said in control visibility via device status:
Now we are a few versions further, is there anything to make this easyer in the latest versions?
Yes, indeed. The <li>
DOM node for a device view now has the id
attribute set to the device id. So, the following should work for a device with device id “bridge-light”:
when bla
then set css "display" of "#bridge-light" to "none"
EDIT: There is a caveat, however. If the device is shown on multiple pages the view is only changed on the first page! The reason is that DOM ids are considered to be unique, and thus, #id
only selects the first match. I will make sure the page-id will be added to one of the superior <div>
nodes. This way it will be possible to hide an element on a given page, e.g. set css "display" of "#page2 #bridge-light" to "none"
"It always takes longer than you expect, even when you take into account Hofstadter's Law.", Hofstadter's Law
Thanks, this is realy nice…
From what version does this work?
I am on 9.48 and there it seems not to work
@lschip The feature had been releases with pimatic-mobile-frontend@0.9.13 (April 2018)! Let me give it a try with css-inject as I have only tried this on the browser console
EDIT: Works for me! At least it works for me for items which are only shown on a single page. Please note you need create a CssInjectDevice and add it to one of the pages.
"It always takes longer than you expect, even when you take into account Hofstadter's Law.", Hofstadter's Law
Hi, do you need css-inject 0.1.2 for this?
I have css-inject 0.1.1 and it doesn’t work.
No, there are no new features in 0.1.2 only some minor cosmetical fixes.
Mmmm, it works partly for me…
On the first page I have a device with an id “KlimaarDiv”. It is a VariablesDevice.
The rule set css “display” of “#KlimaarDiv” to “none” works!
I also have a device (on the same page) with an id “Voordeur”. It is a HomeDuinoContactSensor.
The rule set css “display” of “#Voordeur” to “none” does not work.
But the terrible rule set css “display” of “#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)” to “none” does work for the device “Voordeur”.
What do I do wrong?
Do you have the Voordeur device on multiple pages? It could also be, that this custom device doesn’t add the ID to the frontend elements. You need to check with your browsers development tools / inspector.
Voordeur is only on one page.
The inspector shows:
Please show me the DOM inspector with this element selected like here:
You mean this?
Mhh…should work. Could you please paste a screenshot of your rule. Maybe there is a typo in it.
When I change #Voordeur to #KlimaatDiv, which device is on the same page (and both nowhere else), than KlimaatDiv will be hidden…
Please open the console tab in developer tools and type
document.getElementById("Voordeur");
and hit “return”
What is the output?
Please use the Dom inspector and show me the content of the <html> --> <head> --> <style> element as text.
I need to pretify it.
??
Yes! Please copy the huge wall of text into the thread. I need to analyze it. It is not possible with an image.
Have a look at the end of your screenshot. There you can see, that #Voordeur has display:block and not display:none.
Restart your pi to remove all applied styles and test your rule again.
Ok, like this? Sorry, was wrong page… now the right one
[Deprecation] Application Cache is restricted to secure contexts. Please consider migrating your application to HTTPS, and eventually shifting over to Service Workers. See https://goo.gl/rStTGz for more details.
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"none\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"none\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"none\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"block\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"none\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"block\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"none\""]}
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1196 updating CSS....
index-3cd3e09a4c698fba4d8f102fc3b4d40c.js:1197 {"\"#CssInjectDevice > div > label\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(26)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(28)\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(9)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(10)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(11)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(12)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(13)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(14)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(15)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(16)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(17)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(18)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(19)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(20)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(21)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(22)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(23)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(24)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(25)\"|_|_|\"display\"":["\"none\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(27)\"|_|_|\"display\"":["\"none\""],"\"#Voordeur\"|_|_|\"display\"":["\"block\""],"\"#item-lists > div > div > div:nth-child(1) > div > ul > li:nth-child(8)\"|_|_|\"display\"":["\"block\""]}
That are your applied styles:
As you can see, your Voordeur has display block. Try a restart of pimatic to remove all applied styles.
It’s a custom style, set by pimatic css plugin. Maybe from an older rule.
It could also be, that one of the other rules also points to your Voordeur Element and overrides this style because the selector is more specific/complex.
Ok, thanks.
I’ll look at that later and let you know!
Hi,
I changed all the rules like:
{
“id”: “css-test-2”,
“name”: “css-test 2”,
“rule”: “when Lamp Voordeur is turned off then set css “display” of “#Voordeur” to “none””,
“active”: true,
“logging”: true
},
I also have the css plugin installed:
{
“plugin”: “css-inject”,
“active”: true
},
And a device on the page:
{
“id”: “CssInjectDevice”,
“name”: “CssInjectDevice”,
“class”: “CssInjectDevice”
},
Thats right though?
But then the device will not be hidden.
Any more suggestions?
Thanks in advance…