Is there a way, using the light card to have a set low value on the dimming slider? Another words instead of dragging the slider all the way to the left and having the light shut off, have it stop at a set value of 5%, 10%, etc.
1 Like
Does the custom:mushroom-template-card support templates for urls? Trying this but donāt get it to work
tap_action:
action: url
url_path: >
https://uk.flightaware.com/live/{{ states('sensor.opensky_tracked_plane')
}}
Hi guys, i want add to yellow box mushroom template for control lighting, only icon no title, how to do it? thx for help.
2 Likes
Hello yaml freaks 
type: custom:mushroom-entity-card
entity: sensor.abfallbio
layout: horizontal
icon_color: green
card_mod: null
style: |
mushroom-shape-icon {
animation: blink 1s linear infinite;
}
@keyframes blink {
50% {opacity: 0;}
}
The code above Iāve stolen out of this thread and my icon is blinking. But my skills are not sufficient to let it blink only if the sensor has a certian value like 1 day (remaining).
I want to ask if someone can support me here. Thank you!!
Here is an update of my room card.
Light:
Dark:
Example rooms.
Bedroom:
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
primary: Master
secondary: '{{ states(''sensor.master_bedroom_sensor_temperature'') | round(0) }} Ā°C'
icon: mdi:bed-double
entity: group.master_bedroom_lights
tap_action:
action: navigate
navigation_path: master_bedroom
hold_action:
action: toggle
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''disabled'' }}'
fill_container: true
layout: horizontal
multiline_secondary: false
card_mod:
style: |
:host([dark-mode]) {
background: rgba(var(--rgb-primary-background-color), 0.2);
}
:host {
background: rgba(var(--rgb-primary-text-color), 0.025);
--mush-icon-size: 76px;
height: 66px;
margin-left: -18px !important;
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: binary_sensor.master_bedroom_smoke
state: 'on'
chip:
type: template
icon_color: red
icon: mdi:fire-alert
card_mod:
style: |
ha-card {
animation: blink 1s linear infinite;
}
@keyframes blink {
50% {opacity: 0;}
}
- type: conditional
conditions:
- entity: binary_sensor.master_bedroom_motion_occupancy
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:motion-sensor
- type: conditional
conditions:
- entity: climate.bedroom_air_conditioner
state_not: 'off'
chip:
type: template
icon_color: disabled
entity: climate.bedroom_air_conditioner
icon: |-
{% if is_state(entity, 'heat_cool') %}
mdi:sync
{% elif is_state(entity, 'heat') %}
mdi:fire
{% elif is_state(entity, 'cool') %}
mdi:snowflake
{% elif is_state(entity, 'dry') %}
mdi:water-percent
{% elif is_state(entity, 'fan_only') %}
mdi:fan
{% else %}
mdi:air-conditioner
{% endif %}
card_mod:
style: |
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
ha-card {
{% if is_state('climate.bedroom_air_conditioner', 'fan_only') %}
animation: rotation 2s linear infinite;
{% endif %}
}
- type: conditional
conditions:
- entity: binary_sensor.master_bedroom_deck_door_contact
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:door-open
- type: conditional
conditions:
- entity: group.master_bedroom_windows
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:window-open
alignment: end
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0;
}
card_mod:
style: |
ha-card {
height: 102px;
{% if is_state('group.master_bedroom_lights', 'on') %}
background: rgba(255, 152, 0, 0.1);
{% endif %}
}
Bathroom:
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
primary: Bathroom
secondary: '{{ states(''sensor.bathroom_sensor_temperature'') | round(0) }} Ā°C'
icon: mdi:shower
entity: group.bathroom_lights
tap_action:
action: navigate
navigation_path: bathroom
hold_action:
action: toggle
icon_color: '{{ ''orange'' if is_state(entity, ''on'') else ''disabled'' }}'
fill_container: true
layout: horizontal
multiline_secondary: false
card_mod:
style: |
:host([dark-mode]) {
background: rgba(var(--rgb-primary-background-color), 0.2);
}
:host {
background: rgba(var(--rgb-primary-text-color), 0.025);
--mush-icon-size: 76px;
height: 66px;
margin-left: -18px !important;
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: binary_sensor.bathroom_leak_water_leak
state: 'on'
chip:
type: template
icon_color: light-blue
icon: mdi:water-alert
card_mod:
style: |
ha-card {
animation: blink 1s linear infinite;
}
@keyframes blink {
50% {opacity: 0;}
}
- type: conditional
conditions:
- entity: binary_sensor.bathroom_motion_occupancy
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:motion-sensor
- type: conditional
conditions:
- entity: fan.bathroom_fan
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:fan
card_mod:
style: |
@keyframes rotation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
ha-card {
animation: rotation linear infinite;
animation-duration: 2s;
}
- type: conditional
conditions:
- entity: group.bathroom_windows
state: 'on'
chip:
type: template
icon_color: disabled
icon: mdi:window-open
alignment: end
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
--chip-background: none;
--chip-spacing: 0;
}
card_mod:
style: |
ha-card {
height: 102px;
{% if is_state('group.bathroom_lights', 'on') %}
background: rgba(255, 152, 0, 0.1);
{% endif %}
}
41 Likes
Should be similar to:
mushroom-shape-icon {
{%- if states('sensor.abfallbio' == '1' %}
animation: blink 1s linear infinite;
{%- endif %}
}
@keyframes blink {
50% {opacity: 0;}
}
Do you mind sharing your yaml for your welcome page?
Not sure if you were looking for this welcome message /card ?
Here you have mine:
type: custom:mushroom-template-card
primary: |-
{% set time = now().hour %}
{% if (time >= 19) %}
Good Evening, {{user}}!
{% elif (time >= 12) %}
Good Afternoon, {{user}}!
{% elif (time >= 5) %}
Good Morning, {{user}}!
{% else %}
Hello, {{user}}!
{% endif %}
secondary: >-
Current Temp: {{states(āsensor.home_weather_realfeel_temperatureā)}}Ā°C /
{{states(āweather.home_weatherā)}}
multiline_secondary: false
Is there a way to remove the icon shadow from an entities card? I was able to remove it before but from a nested in stack card.
What Iām trying below that worked for the in stack card isnāt working for the entities cards.
type: horizontal-stack
cards:
- type: custom:mushroom-entity-card
entity: switch.printer
hold_action:
action: toggle
name: Printer
double_tap_action:
action: none
card_mod:
style: |
mushroom-shape-icon {
--shape-color: none !important; }
ha-card {
--ha-card-background: transparent;
--card-primary-font-size: 14px
}
1 Like
ups sorry for that ā¦I misunderstood
1 Like
Looking for help ideas. Iām converting my current dashboard to use mushroom. In one particular case, I am using template cards. For the secondary information, I am pulling a sensor template that counts how many lights are on like this:
master_bedroom_count:
value_template: >-
{% set ns = namespace(res=0) %}
{% for light in state_attr('group.master_bedroom', 'entity_id') if is_state(light, 'on') %}
{% set ns.res = ns.res + 1 %}
{% endfor %}
{% if (ns.res | int) == 0 %}
 
{% elif (ns.res | int) == 1 %}
{{ ns.res }} light on
{% else %}
{{ ns.res }} lights on
{% endif %}
In my previous dashboard, using the custom:button-card the   would render as a blank. This is my intention so text does not bounce around. However, the mushroom template card displays the text  . Is there something else I should be doing to have a blank string display in the mushroom template card? Using   also does not work in mushroom but does in button-card.
Any way to achieve this result with mushroom cards?
Very nice! I love it!
Whatās your ha-card-border-radius at?
Just the standard for the mushroom theme.
I know itās hard to see but do you have this issue when an animated chip is on? Look closely at the top left corner of the basement card when I turn off the fan. The border radius is not correct when the fan is on but itās fine when itās off. I canāt figure it out.
1 Like
Looks fine. What browser are you using?
1 Like
You can do it directly in a Mushroom Template Card like this:
type: custom:mushroom-template-card
primary: The House
secondary: >-
{% set lights_on = expand(states.group.all_lights) | selectattr( 'state',
'eq','on') | list | count %}
{% if lights_on > 1 %}
There are {{ lights_on }} lights on
{% elif lights_on == 1 %}
There is {{ lights_on }} light on
{% else %} {% endif %}
icon: mdi:home
layout: vertical
icon_color: '{{ ''amber'' if is_state(entity, ''on'') else ''disabled'' }} '
entity: group.all_lights
3 Likes
Thanks, I did try something similar to this. The issue still persists however. What I am trying to avoid is the icon and Primary text box moving when the secondary information displays. In my old setup putting in the non-breaking space   accomplished this because it would correctly render that as a blank space in the html. Essentially want to create a blank space holder.
Please help me to create such a beauty āperson cardā! Iam the newbie, just migrate from openHAB ))
4 Likes
You can specify the height and stop the icon moving of the Mushroom Card like this:
type: custom:mushroom-template-card
primary: The House
secondary: >-
{% set lights_on = expand(states.group.all_lights) | selectattr( 'state',
'eq','on') | list | count %} {% if lights_on > 1 %}
There are {{ lights_on }} lights on
{% elif lights_on == 1 %}
There is {{ lights_on }} light on
{% else %} {% endif %}
icon: mdi:home
layout: vertical
icon_color: '{{ ''amber'' if is_state(entity, ''on'') else ''disabled'' }} '
entity: group.all_lights
card_mod:
style: |
ha-card {
height: 117px !important;
justify-content: start !important;
}
2 Likes