I am trying to make a cleaner mobile dashboard using mushroom chips card.
I would like to have the color of the switch.blueiris_schedule_away icon change based on the state of the switch. I have tried many things and it just remains white.
Here is my latest try… what am I missing here?
type: custom:mushroom-chips-card
chips:
- type: back
- type: spacer
- type: weather
entity: weather.forecast_home
show_temperature: true
show_conditions: false
- type: spacer
- type: entity
entity: switch.blueiris_schedule_away
tap_action:
action: toggle
card_mod:
style: |
:host {
--icon-color:
{% if is_state('switch.blueiris_schedule_away', 'on') %}
green
{% else %}
gray
{% endif %};
}
- type: entity
entity: switch.blueiris_schedule_day_night
tap_action:
action: toggle
- type: spacer
- type: menu
alignment: justify
(I have read this page: Mushroom Cards Card Mod Styling/Config Guide)
what is curious to me, is that if I just use a button within a horizontal stack card that the icon changes color based on state and I am not even specifying that behavior. (Here with At Home “on” and Away “off”)
type: horizontal-stack
cards:
- show_name: true
show_icon: true
name: Away
entity: switch.fincajill_schedule_away
type: button
tap_action:
action: toggle
show_state: false
- show_name: true
show_icon: true
name: At Home
entity: switch.fincajill_schedule_day_night
type: button
tap_action:
action: toggle
show_state: false
Any help getting this working would be greatly appreciated!
