Highlight Color does not change if trenditem is defined

Setup, Configuration and Use Widgets
1

For some of my actors I want to change the background-color if they are on. Therefore I used label-cells.
For some reason it is not what I expect. Here is my YAML-code which does not change the “Highlight Color” as expected.

component: oh-label-cell
config:
  title: Weihnachtsbaum
  action: toggle
  actionCommand: ON
  actionCommandAlt: OFF
  actionItem: shellyplugs80646f838323108668_Betrieb
  color: '=(items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ? "gray" :
    "orange"'
  footer: Stromverbrauch aktuell
  icon: '=(items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ?
    "f7:lightbulb" : "f7:lightbulb_fill"'
  item: shellyplugs80646f838323108668_Stromverbrauch
  on: true
  subtitle: '="Shelly 668 ist " +
    ((items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ? "AUS" :
    "EIN")'
  trendItem: shellyplugs80646f838323108668_Stromverbrauch
slots: null

In case I delete the line trendItem: shellyplugs80646f838323108668_Stromverbrauch then all is OK, the background-color changes according to the state of the actor.
This maybe a bug, or do I do something wrong ?
regards Paul

2

I don’t think you are doing something wrong.
At the moment it looks like only one thing is possible.
Either the background is a color or a trend item.

I have observed the same behavior.

1 Like
3

You can accomplish this my manually adding the trend line to the background of the cell using the oh-trend component. A background slot for the cell will override both the trendItem and color properties of the cell, but you can accomplish both of those within the oh-trend.

component: oh-label-cell
config:
  title: Weihnachtsbaum
  action: toggle
  actionCommand: ON
  actionCommandAlt: OFF
  actionItem: shellyplugs80646f838323108668_Betrieb
  footer: Stromverbrauch aktuell
  icon: '=(items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ?
    "f7:lightbulb" : "f7:lightbulb_fill"'
  item: shellyplugs80646f838323108668_Stromverbrauch
  subtitle: '="Shelly 668 ist " +
    ((items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ? "AUS" :
    "EIN")'
slots:
  background:
    - component: oh-trend
      config:
        trendItem: shellyplugs80646f838323108668_Stromverbrauch
        style:
          background: '=(items.shellyplugs80646f838323108668_Betrieb.state)=="OFF" ? "gray" :
    "orange"'

One caveat. The color property for the cell refers to the f7 color palette. When you move that to the background style of the trend line you are now using the html color palette and some of the color names may be a little different (but you also have far more flexibility). If you want to make sure that your colors match refer to the f7 color docs:

1 Like
4

Thank you Justin, this is a solution.
Up to now I didn’t find a limitation saying “either the background is a color or a trend item.”
Therefore it must be a bug…