About 6 months ago I got great help from sburke781, thebearmay, bobbyD, and several others on how to do custom images on tiles. I got tied up with family stuff for 6 months and finally now trying to do HE android APP. That help really got me going and was able to do what I wanted relative to custom images per device tile using CSS.
Dashboard and Phone both can turn on and off the devices, but the Phone APP does not show the images. Images are hosted on the HE using file manager. Since Dashboard and Phone are on the same sub net, shouldn't the Phone APP see the images on the tiles? Once this is working would like to see what happens off sight.
Below is some of my CSS code that has my PC Dashboard tiles looking like I want.
Also, below is a photo of how my device tiles look when active and not active that I would like on my HE phone's APP.
Again, need help.
My problem is the PC dashboard tiles coded with CSS do not show up when using the HE Phone APP. From what I read could be where the image files are hosted, but am thinking when on the same sub net should see them?
/* Frontyard zone 1 */
#tile-12 .tile-primary.off i.material-icons:before, #tile-13 .tile-primary.off i.material-icons:before, #tile-14 .tile-primary.off i.material-icons:before, #tile-20 .tile-primary.off i.material-icons:before, #tile-21 .tile-primary.off i.material-icons:before, #tile-22 .tile-primary.off i.material-icons:before{
content: "";
background-image:url(http://192.168.0.151/local/waterfaucetoff.png);
background-size: 100% 100%;
display: inline-block;
height: 90px;
width:60px;
position: absolute;
left: 90px;
top: 40px;
}
#tile-12 .tile-primary.on i.material-icons:before, #tile-13 .tile-primary.on i.material-icons:before, #tile-14 .tile-primary.on i.material-icons:before, #tile-20 .tile-primary.on i.material-icons:before, #tile-21 .tile-primary.on i.material-icons:before, #tile-22 .tile-primary.on i.material-icons:before{
content: "";
background-image:url(http://192.168.0.151/local/waterfauceton.png);
background-size: 100% 100%;
display: inline-block;
height: 90px;
width:60px;
position: absolute;
left: 90px;
top: 40px;
