Hi, is anyone able to help please? Iām hoping to have the icon change colour based on the temperature range of a sensorā¦Iāve got this so far but it only changes the icon to green? Basically Iād like to change the colour if the temp is over say 15 degrees, then 20 then 25 for example?
icon_color: |
{% if states(entity) | float > 15 %}
green
{% elif states(entity) | float > 20 %}
yellow
{% elif states(entity) | float > 25 %}
orange
{% elif states(entity) | float > 30 %}
red
{% else %}
black
{% endif %}
entity: sensor.bedroom_temperature_sensor_temperature
Bpasop
June 13, 2023, 9:18pm
7096
Just start with the high numbers. And it should work
icon_color: |
{% if states(entity) | float > 30 %}
red
{% elif states(entity) | float > 25 %}
orange
{% elif states(entity) | float > 20 %}
yellow
{% elif states(entity) | float > 15 %}
green
{% else %}
black
{% endif %}
3 Likes
theRKS
June 14, 2023, 12:36am
7097
āI like your approach! Are the colors for the background and cards specified in certain theme files? If so, could you please share them with me?ā
For ex card-mod: background-color: rgba(var(ārgb-card-background-color)
Vandana
June 14, 2023, 3:09am
7098
@rhysb is there a way to decrease the spacing between the chips ? The Bottom row has 5 chips, can I decrease the spacing between them ? Kindly guide
Thanks so much, that worked!
buche11
June 14, 2023, 1:36pm
7101
@danwooler
nullae
June 14, 2023, 4:58pm
7102
Firstly, this is very nice, thank you.
I am having trouble with a couple of elements however:
The latter isnāt really an issue to me. But I wonder if something has changed since you shared this code for the battery card to not render correctly (or perhaps my removing of ādistance to xā card has altered behaviour in some way?)
Thank you again. One last question. It looks great on my PC, but when I view it on the tablet the two bottom icons you helped me adjust are stacked vertically (Iām assuming because it runs out of āhorizontalā space). Any idea of something I can do to fix that?
dyego.hass
June 14, 2023, 7:11pm
7104
Could you please share your code?
Wondering if someone can help me, Iām new to this YAML stuff
Iām hoping to make a mushroom person card, like @Mosher with a Memoji-style image and the red/green home and away badges.
However, I want to use a binary presence sensor entity to control the Home/Away state, not a person entity. I was able to change the entity to the binary sensor, and change the icon type to āentity-pictureā with the code editor, but I canāt figure out how to set the actual Memoji picture I want to use.
Hereās what I have so far:
type: custom:mushroom-person-card
entity: binary_sensor.nick_presence
layout: vertical
name: Nick
fill_container: false
icon_type: entity-picture
Any help would be appreciated, or if there is a better way to do it with a different card, please let me know!
Faecon
June 15, 2023, 3:38pm
7106
I have a velux window
- type: custom:mushroom-chips-card
chips:
- type: template
entity: cover.raamlinks
icon: |-
{{ iif(is_state(entity, 'open'), 'mdi:window-open-variant', 'mdi:window-closed-variant') }}
icon_color: disable
If I open it, I want it always on position 78. I found some code, but donāt know how to use itā¦
- service: cover.set_cover_position
data:
entity_id: X
position: 78
and as long as it isnāt on position 0 or 78 I want the icon blinkingā¦
type: entity-button
entity: light.bed_light
style: |
@keyframes blink {
50% {
background: red;
}
}
ha-card {
animation: blink 2s linear infinite;
}
How can I manage this ?
danwooller
June 15, 2023, 4:11pm
7107
Does this work?
{{ 'animation: blink 2s linear infinite;' if not is_state(config.entity, '0') and not is_state(config.entity, '78') }}
Anyone know whatās going on here? I think it was after the 2023.6 update my mushroom dashboard started loading with everything overlapping.
If I click to a different page, then back, it goes back to normal.
Faecon
June 15, 2023, 5:58pm
7109
like this ?
- type: template
entity: cover.raamrechts
icon: |-
{{ iif(is_state(entity, 'open'), 'mdi:window-open-variant', 'mdi:window-closed-variant') }}
icon_color: disable
style: |
@keyframes blink {
50% {
background: red;
}
}
ha-card {{ 'animation: blink 2s linear infinite;' if not is_state(config.entity, '0') and not is_state(config.entity, '78') }}
this does not workā¦
danwooller
June 15, 2023, 6:49pm
7110
I think maybe you need to look and whether your values are strings or integers. I donāt have that device so only tested with switches that use strings.
This is not technically a mushroom card problem, so youāre maybe better off asking in a template thread.
Faecon
June 15, 2023, 6:50pm
7111
ok, thanks for helping me
Menthe
June 17, 2023, 9:28pm
7112
Since one of the last homeassistant updates my browser mod with mushroom popup windowlook like this (notice the small lines around the mushroom cards):
What can i do to fix this?
type: custom:mushroom-chips-card
chips:
- type: template
icon: >
{% if is_state('light.alle_lichter', 'on') or
is_state('switch.lichtsteckdosen', 'on') %}
mdi:lightbulb-multiple
{% elif is_state('light.alle_lichter', 'off') or
is_state('switch.lichtsteckdosen', 'off') %}
mdi:lightbulb-multiple-off
{% endif %}
icon_color: >
{% if is_state('light.alle_lichter', 'on') or
is_state('switch.lichtsteckdosen', 'on') %}
#FDD835
{% elif is_state('light.alle_lichter', 'off') or
is_state('switch.lichtsteckdosen', 'off') %}
blue-grey
{% endif %}
entity: light.alle_lichter
content: >-
{{ expand('light.alle_lichter','switch.lichtsteckdosen') |
selectattr('state', 'eq', 'on') | list | count}}
card_mod: null
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Eingeschaltete Lichter
content:
type: custom:auto-entities
filter:
include:
- group: switch.lichtsteckdosen
state: 'on'
options:
type: custom:mushroom-entity-card
layout: horziontal
icon_color: yellow
tap_action:
action: toggle
card_mod:
style: |
ha-card {
padding: 4px 12px !important;
}
- group: light.alle_lichter
state: 'on'
options:
type: custom:mushroom-light-card
show_brightness_control: true
layout: horizontal
tap_action:
action: toggle
use_light_color: true
card_mod:
style: |
ha-card {
padding: 4px 12px !important;
}
exclude:
- domain: light
attributes:
types: browser_mod
card:
type: entities
cards: []
show_header_toggle: false
sort:
method: friendly_name
target: {}
- type: template
icon: |
{% if is_state('group.all_doors', 'off') %}
mdi:door
{% else %}
mdi:door-open
{% endif %}
icon_color: |
{% if is_state('group.all_doors', 'off') %}
green
{% else %}
red
{% endif %}
entity: group.all_doors
content: >-
{{ expand(states.group.all_doors) | selectattr( 'state', 'eq','on') | list
| count }}
card_mod: null
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Geƶffnete TĆ¼ren/Fenster
content:
type: custom:auto-entities
filter:
include:
- group: group.all_doors
state: 'on'
options:
type: custom:mushroom-entity-card
layout: horizontal
tap_action:
action: more-info
card_mod:
style: |
ha-card {
padding: 4px 12px !important;
}
exclude:
- domain: light
attributes:
types: browser_mod
card:
type: entities
cards: []
show_header_toggle: false
sort:
method: friendly_name
target: {}
- type: entity
entity: person.menthe
alignment: end
Faecon
June 19, 2023, 6:06am
7114
- type: custom:mushroom-chips-card
chips:
- type: template
entity: input_boolean.veluxscreen_links
icon: >
{% if is_state('input_boolean.veluxscreen_links', 'on')%}
mdi:blinds-open
{% elif is_state('cover.screenlinks', 'open')%}
mdi:blinds-open
{% else %}
mdi:roller-shade-closed
{% endif %}
icon_color: |-
{{ iif(is_state(entity, 'on'), 'white', 'grey') }}
card_mod:
style: |
mushroom-template-chip:nth-child(2)$: |
ha-icon {
{% if state_attr('cover.screenlinks','current_position')|int(default=-1) > 0 and state_attr('cover.screenlinks','current_position')|int(default=-1) < 78 %}
animation: blink 2s linear infinite;
{% endif %}
}
@keyframes blink {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
Can you tell me what is wrong here ? I want the icon blinking when the attribute is between 0 and 78 ā¦
