Show Off Your Dashboards!

Are you using PurpleAir devices or something else? I need to find a way to add those.

first one is purple using HubiGraphs, the others are awair sensors.

all good suggestions, thanks--it caused me to figure out how to do transparency. now need to figure out how to do conditional formatting

Hit up @spelcheck he's a CSS ninja.

What conditions are your targeting, and what formatting do you want tot apply? With smartly 2.0 (which it looks like your using) CSS conditional targeting is much easier.

Here's a couple temp and humidity BG color changes as examples

.temp-129{background-color:rgba(211,4,1,.9)!important}
.temp-130{background-color:rgba(211,4,1,.9)!important}

.tile.humidity-0{background-color:rgb(240,199,31)!important}
.tile.humidity-1{background-color:rgb(236,199,30)!important}

You could do the same with air quality. I don't have a sensor thu, so I'm not sure how they output readings.

You could use this app for conditional formatting using images

was thinking that the water sensors should turn red if wet. presence icons change based on state. Easy to do in android hubitat dashboard app, but not HE. I don't see it in smartly--will need to learn some CSS it apears.

1 Like

thanks for the pointer to conditional image server. I think this might do the trick. off to install and play now while the brisket smokes...

ok, better I think

1 Like

Looks good! One other change I see, shrink the text a little on the life 360 location tiles so you can fit two lines of text for location.

yeah, that is supposed to pick up the location name 'work' but, while it shows 'work' on the web interface, here it is showing a street location, which is what the device state reads. somehow it is not picking up the location name (tho it shows it for "previous address"). another L365 oddity

1 Like

Seems weird that two of the gauges go green/yellow/red from left to right and the other three do it right to left. I’m used to seeing the gauge go from green/yellow/red and “rise” from left to right but maybe it’s just the way those items report.

yes, the Awair scores are better as they rise--higher score, better air qual...I agree on the dissonance--it was part of the reason I went for gauges as simply reporting the numbers didn't give the g/y/r context

Just a note; the gauge colors are configurable...

You can get rid of the dashboard tile icons if you want a cleaner look...

2 Likes

You put that under advanced right? But where in the json code does it go?

Bottom of the CSS tab. Below where it says custom css below this line.

2 Likes

Using he_blank icon will allow you to remove icon per tile instead of per template. You have to type it into the CSS JSON (layout) window. It's not a choice in the normal template editor.

EDIT: Corrected with @TechMedX's help. Thank you.

1 Like

I think @stephen_nutt meant to say the JSON (Layout) tab not CSS. Template changes go in the Layout page while tile edits go in the CSS "tab"

1 Like

Ooops, sorry. I edited my original post but I don't know how others have done the strikethru font to show edit corrections.

1 Like