Change bg color of a widget that has other widgets in it?

Third party integrations HADashboard
1

I’m essentially trying to visually group the icons. I saw this in the docs:

title: Main Panel
widget_dimensions: [120, 120]
widget_margins: [5, 5]
columns: 8

layout:
    - include: top_panel
    - include: main_middle_panel
    - include: mode_panel
    - include: bottom_panel

So lets say I want the bg color of main_middle_panel to be yellow, main_middle_panel has some switch and light widgets defined in it, some labels, etc. I don’t want this bg color to do anything to those switch and light and label widgets, I want the bg color behind all of those widgets together to be yellow.

I’ve tried widget_style on main_middle_panel but it’s not working, all of those widgets show up in my dashboard, but there’s no yellow behind all of them. (the switch, light, and label bg colors should stay gray as they are)

any help?

2

I’m not sure you can do it for individual panels but you could create your own skin and do whatever you liked then enable it with …

simplyred:
  title: Skin Change
  title2: Simply Red
  widget_type: navigate
  dashboard: Controls
  skin: simplyred

It’s the only thing I can think of :stuck_out_tongue:

3

mmmmm could you target a group like this with a custom skin?

4

I don’t think so as it’s a skin and by it’s nature it applies to all panels.

5

If you add the wiget style to each widget you want with a background color why doesn’t that work?

widget_style: “background: white”
e.g.

side_temperature:
    widget_type: sensor
    widget_style: "background: yellow"
    title: Temperature
    units: "°F"
    precision: 0
    entity: sensor.side_temp_corrected

side_humidity:
    widget_type: sensor
    widget_style: "background: blue"
    title: Humidity
    units: "%"
    precision: 0
    entity: sensor.side_humidity_corrected
1 Like