How can I change the color of the wattage display and/or the name (heating) depending on the power level? Heating at < 7 watts = green, over 7 watts orange and over 70 watts red?
type: entity-filter
entities:
- entity: sensor.sh_k_hz_leistung
icon: mdi:water-boiler
name: Heizung
secondary_info: last-changed
tap_action:
action: navigate
navigation_path: /lovelace/15
- entity: sensor.p_w_k_k_leistung
icon: mdi:fridge
name: Kühlschrank
secondary_info: last-changed
tap_action:
action: navigate
navigation_path: /lovelace/2
conditions:
- condition: numeric_state
above: 1
title: aktuell
Consumers are only listed if they are active.
Similar like this:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.sh_k_hz_leistung
name: ' Heizung '
secondary_info: last-updated
card_mod:
style: |
ha-card {
{% set state = states('sensor.sh_k_hz_leistung') | int %}
{% if state >= 80 %}
--text-color: red;
{% elif state >= 40 %}
--text-color: orange;
{% elif state >= 6,2 %}
--text-color: green;
{% elif state >= 1 %}
--text-color: yellowgreen;
{% endif %}
}
}
use_entity_picture: true
alignment: center
You are going to have to be a little more specific with your end goal. Are you trying to use the entity filter card in lieu of the Mushroom card?
Faecon
May 11, 2024, 1:57pm
635
is it possible to change the background colour this card/icon ?
- type: "custom:button-card"
template: "card_scenes_welcome"
variables:
entity_4:
entity_id: "sensor.indoor_temperature"
nav_path: "media"
icon: "mdi:music"
name: "Media"
color: blue
this is what I have tried…
card_mod:
style: |
mushroom-template-chip:nth-child(2)$: |
ha-card {
--chip-background: #ede9e3;
}
:host {
--ha-card-background: #8a9977;
}
How would using card mod for a mushroom chip card work with button card?
Button card supports changing backgrounds internally:
type: custom:button-card
styles:
card:
- background-color: red
1 Like
Faecon
May 11, 2024, 2:58pm
637
And can I change the chip background ?
Frosty
May 11, 2024, 3:18pm
638
yes it’s all in @dimitri.landerloos guide
type: custom:mushroom-chips-card
card_mod:
style: |
ha-card {
--chip-background: blue;
}
Faecon
May 11, 2024, 7:41pm
640
I have a chips card where I want to see only the icon
- type: custom:mushroom-chips-card
chips:
- type: template
entity: climate.eetplaats # climate.ruimte1
icon: mdi:air-conditioner
icon_color: >
{% if is_state('climate.eetplaats', 'heat') %}
176,17,17
{% elif is_state('climate.eetplaats', 'cool') %}
98,161,219
{% else %}
84,84,84
{% endif %
card_mod:
style:
mushroom-shape-icon$: |
.shape {
border: none
}
card_mod:
style:
mushroom-shape-icon$: |
.shape {
border-style: none
}
card_mod:
style:
mushroom-shape-icon$: |
.shape {
border: 0px
}
all that is not working. Can somebody help me ?
for each chip. under the individual chip type (or at the bottom of that chip type). if you have a conditional chip make sure your code is under the chip that gets shown by the conditional chip. not under the conditional chip itself.
- type: conditional
conditions:
- entity: light.office_desk_lamp
state: 'on'
chip:
type: template
entity: light.office_desk_lamp
icon: mdi:lightbulb
card_mod:
style: |
ha-card {
--chip-background: blue;
}
And then use transparent as the color.
type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: light.office_desk_lamp
state: 'on'
chip:
type: template
entity: light.office_desk_lamp
icon: mdi:lightbulb
card_mod:
style: |
ha-card {
--chip-background: transparent;
border: none !important;
box-shadow: none !important;
}
1 Like
sid1907
May 13, 2024, 4:08am
643
Thanks @LiQuid_cOOled and @Frosty for your help on this earlier.
Is there a way to tweak the below code to get this to not show hours, unless the amount of time the sensor is ‘on’ exceeds 60 minutes?
content: >-
{{(now() |as_timestamp -
states.binary_sensor.presence_sensor_fp2_0faa_presence_sensor_1.last_changed
|as_timestamp) | timestamp_custom("%H:%M:%S", false)}}
jata
May 13, 2024, 5:20am
644
I am out of practice with mushroom cards so apologies if this is a stupid question but…
Is there any way to add additional info/content (template) for secondary info in a select card?
I want to customise the secondary info in this setup so that it uses the state of another entity.
Is this possible?
Hello,
Sorry when it’s not so clear what I want.
In addition, the consumption values should be displayed in different colors depending on the consumption. From value x - y in green, from value m - n in orange and from a - b in red. No idea which card can be used to implement this.
berkans
May 14, 2024, 12:15am
646
{% set time_difference = (now() | as_timestamp - states.binary_sensor.sonoff_motionsensor.last_changed | as_timestamp) %}
{% set hours = time_difference // 3600 %}
{% set minutes = (time_difference % 3600) // 60 %}
{% set seconds = time_difference % 60 %}
{% if time_difference >= 3600 %}
{{ '%02d:%02d:%02d' | format(hours, minutes, seconds) }}
{% else %}
{{ '%02d:%02d' | format(minutes, seconds) }}
{% endif %}
1 Like
sid1907
May 14, 2024, 3:14am
647
Thanks a bunch, works beautifully!
I’m trying to get a person’s friendly name after the greeting, I’m not sure how to code it in - I’ve put it in [ ] illustrate what I’m trying to achieve
type: custom:mushroom-chips-card
chips:
- type: template
content: |
Good
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
Morning!
{% elif 12 <= current_hour < 18 %}
Afternoon!
{% else %}
Evening!
{% endif %}
[state friendly name]
icon: |
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
mdi:sun-angle
{% elif 12 <= current_hour < 18 %}
mdi:beach
{% else %}
mdi:weather-sunset
{% endif %}
icon_color: |
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
red
{% elif 12 <= current_hour < 18 %}
amber
{% else %}
blue
{% endif %}
sid1907
May 14, 2024, 9:19am
649
Thank you! Works. Although, not sure why card-mod isn’t working just for this template!?
type: custom:mushroom-chips-card
chips:
- type: template
content: |
Good
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
Morning, {{user}}!
{% elif 12 <= current_hour < 18 %}
Afternoon, {{user}}!
{% else %}
Evening, {{user}}!
{% endif %}
icon: |
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
mdi:sun-angle
{% elif 12 <= current_hour < 18 %}
mdi:beach
{% else %}
mdi:weather-sunset
{% endif %}
icon_color: |
{% set current_hour = strptime(states('sensor.time'), "%H:%M").hour %}
{% if current_hour < 12 %}
red
{% elif 12 <= current_hour < 18 %}
amber
{% else %}
blue
{% endif %}
card_mod:
style: |
ha-card {
box-shadow: none !important;
justify-content: center;
--chip-height: 35px;
--chip-border-radius: 10px;
--chip-icon-size: 20px;
--chip-font-size: 12px;
--text-color: {{ 'Black' if is_state(config.entity, 'on') else '#D8AE7E' }};
font-style: bold;
font-variant: small-caps;
padding-right: 0px;
padding-left: 0px;
font-family: "Roboto";
font-weight: bolder;
width: 0px !important;
min-width: 88px !important;
}
you are using config.entity, but you dont have an entity defined in your chip.
1 Like
sid1907
May 14, 2024, 1:05pm
651
sid1907:
sensor.time
Thanks, added this as the entity and it worked!
sid1907
May 14, 2024, 6:53pm
652
EDIT: figured out how to add conditional color coding to the chip background and text!
@berkans
I was trying to use your code into changing the icon color, but needed some guidance in adding multiple if conditions with greater than and less than
The intention is for the icon to turn:
red between 0 - 15 mins of sensor being ‘on’
yellow between 16 - 30 mins of sensor being ‘on’
green beyond 31 minutes
icon_color: |-
{% set time_difference = (now() | as_timestamp -
states.binary_sensor.presence_sensor_fp2_0faa_presence_sensor_1.last_changed
| as_timestamp) %} {% set hours = time_difference // 3600 %} {% set
minutes = (time_difference % 3600) // 60 %}
{% if time_difference >= 600 %}
red
{% elif time_difference >= 700 %}
yellow
{% else %}
green
{% endif %}
Faecon
May 15, 2024, 8:27am
653
Put them in conditional cards ?
