media_player.currently_playing is it binary_sensor
No, goes under media_player:
1 Like
Looks and acts like any other media entity. If two children are active the higher in the list is displayed.
Hello. So I copied a snippet of the code you gave me for the fan. Can you tell me if Iām close with the part I have in asterisks. I simply need a way to call a script when greater than 80%. If I know how to do that Iāll be able to do the rest on my own
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
entity: input_number.fan_slider
icon: |
{% set vol_level = states(entity) | float %}
{% if vol_level == 0 %}
mdi:fan
{% elif vol_level > 80 %}
mdi:volume-high
*** Tap_action:
Action: call-service
Enter script here***
{% elif vol_level < 40 %}
mdi:volume-low
{% else %}
mdi:volume-medium
{% endif %}
icon_color: indigo
1 Like
Great, ill start tinkering!
Thanks again
1 Like
Great, thank you
1 Like
Getting a little off-topic for Mushroom Cards, but have a look at the Fan Template:
Ya I know sorry. I looked at that yesterday and just couldnāt figure out how to incorporate that with a mushroom slider. Iāll keep googling. Thanks.
And I feel like I donāt need all of that. It could be a button it could be anything. I simply need to know how to call a service of any kind when a mushroom slider is at a certain percentage. It could be a light a camera the television turning on anything.
1 Like
@rhysb can you help ?
Iām hoping to remove the gray from the background of my icons:
So they all look like this:
But by adding
--shape-color-disabled: none !important;}
It removes the animationā¦
My full code:
- type: custom:mushroom-template-card
icon: fapro:fish1
layout: vertical
icon_color: cyan
tap_action:
action: navigate
navigation_path: pondpatio
multiline_secondary: false
fill_container: false
entity: ''
card_mod:
style:
mushroom-shape-icon:
$: |
.shape ha-icon
{
--icon-animation: wobbling 0.4s linear infinite alternate;
}
@keyframes wobbling {
0% {
transform: rotate(-10degree);
}
100% {
transform: rotate(20deg);
}
}
1 Like
Like this?
type: custom:mushroom-template-card
icon: fapro:fish1
layout: vertical
icon_color: cyan
tap_action:
action: navigate
navigation_path: pondpatio
card_mod:
style:
mushroom-shape-icon$: |
ha-icon {
--icon-animation: wobbling 0.4s linear infinite alternate;
}
@keyframes wobbling {
0% {
transform: rotate(-10degree);
}
100% {
transform: rotate(20deg);
}
}
.: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
}
2 Likes
Interesting! Going to look into this as I mainly use plex or tivimate on my shield and the sound is though my sonos
perfect! Thanks couldnāt get my head around it knew youād know 
1 Like
I got this to work at first, but now my picture is not faded, I have tried multiple themes, I used the code and just switched the entity, not sure how I broke it. its weird because when its at 100% browser zoom it doesnāt look faded,
100% 
400%
500%
The first two its a hard edge, the last one at 500% zoom is actually faded, I tried to reload the page with no cache with Control F5 and its still doing the same thing.
1 Like
Here is my card code:
type: custom:stack-in-card
cards:
- type: custom:mushroom-media-player-card
entity: media_player.plex_plex_web_opera_windows
icon: mdi:play
use_media_info: true
use_media_artwork: false
show_volume_level: false
media_controls:
- play_pause_stop
- previous
- next
volume_controls:
- volume_buttons
- volume_set
fill_container: false
card_mod:
style: |
mushroom-shape-icon {
{% set media_type = state_attr(config.entity, 'media_content_type') %}
--card-mod-icon:
{% if media_type == 'tvshow' %}
mdi:television-classic
{% elif media_type == 'movie' %}
mdi:movie-open
{% elif media_type == 'music' %}
mdi:music
{% elif media_type == 'playlist' %}
mdi:music
{% else %}
mdi:play
{% endif %};
}
- type: conditional
conditions:
- entity: media_player.plex_plex_web_opera_windows
state_not: 'off'
- entity: media_player.plex_plex_web_opera_windows
state_not: idle
card:
entity: media_player.plex_plex_web_opera_windows
hide:
icon: true
name: true
runtime: true
source: true
power: true
state_label: true
volume: true
info: true
progress: false
controls: true
more_info: false
type: custom:mini-media-player
toggle_power: false
group: true
card_mod:
style:
mmp-progress$: |
paper-progress {
{{ '--paper-progress-container-color: rgba(63, 81, 181, 0.2) !important;' if is_state(config.entity, 'playing') }}
}
.: |
ha-card {
margin: 0px 12px 12px;
--mmp-progress-height: 42px !important;
height: var(--mmp-progress-height);
--mmp-accent-color: rgb(63, 81, 181);
--ha-card-border-radius: 12px;
}
card_mod:
style: |
ha-card {
{% if not is_state('media_player.plex_plex_web_opera_windows', 'off') and not is_state('media_player.plex_plex_web_opera_windows', 'idle') %}
background: url( '{{ state_attr("media_player.plex_plex_web_opera_windows", "entity_picture") }}' ), linear-gradient(to left, transparent, rgb(var(--rgb-card-background-color)) 50%);
{% if state_attr('media_player.plex_plex_web_opera_windows', 'media_content_type') == 'tvshow' %}
background-size: auto 100%, cover;
{% else %}
background-size: 50% auto, cover;
{% endif %}
background-position: right;
background-repeat: no-repeat;
background-blend-mode: saturation;
{% endif %}
}
1 Like
Hi, i start to switch to mushroom cards a few weeks ago (so not much knowledge in templates and css) but do not find a solution for color changing in the alarm control panel card: I want to change the standard color of the icon to green if status in alarmo is ādeactivatedā and to red if status in alarmo is āactivatedā. Tried this with templates but without any effort. Do anyone could give me a helping hand for a solution? 
One other thing if you donāt mind ?
I have my motion sensors displayed on my dashboard and all 7 of them use the same code which is obviously repetitive, how would I template this code to make it smaller for the rest ? Thanks
- type: custom:mushroom-template-card
primary: Stair
secondary: >-
{% set state=states(entity) %} {% if state=='off' %}Safe{% elif
state=='on' %} Trip {% else %} Fault {% endif %}
entity: binary_sensor.stairhoney
layout: vertical
tap_action:
action: more-info
hold_action:
action: more-info
double_tap_action:
action: more-info
icon: |-
{% set state=states(entity) %}
{% if state=='off' %}
mdi:motion-sensor-off
{% elif state=='on' %}
mdi:motion-sensor
{% else %}
mdi:screwdriver
{% endif %}
icon_color: |-
{% set state=states(entity) %}
{% if state=='off' %}
green
{% elif state=='on' %}
red
{% else %}
yellow
{% endif %}
style: |
ha-card {
{% if states('binary_sensor.stairhoney') == 'on' %}
animation: blink 0.7s linear infinite;
}
@keyframes blink {
50% {opacity: 0;}
}
{%- else -%}
box-shadow: 0px 0px;
{%- endif %}
badge_icon: ''
badge_color: ''
multiline_secondary: false
fill_container: false
Hi Posreg, will you share your code from your welcome message, and the calendar?
sure
type: custom:fold-entity-row
head:
type: custom:mushroom-template-card
icon: mdi:human-greeting-variant
label: padding
primary: |
{% set time = now().hour %}
{% if (time >= 19) %}
Dobry WieczĆ³r {{user}}!
{% elif (time >= 13) %}
Witaj {{user}}!
{% elif (time >= 7) %}
DzieÅ Dobry {{user}}!
{% else %}
CzeÅÄ {{user}}!
{% endif %}
secondary: >-
DziÅ jest {{ states('sensor.dayoftheweek') }}, {{ states('sensor.date') }},
{%- if states('calendar.swieta') == 'off' -%}- {%- else -%} {{
state_attr('calendar.swieta', 'message') }} {%- endif -%},
tap_action: null
multiline_secondary: true
padding: 0
entities:
- type: custom:mushroom-template-card
icon: mdi:bullhorn-variant-outline
secondary: >-
Najbliższe: {{state_attr('calendar.darek', 'message')}} dnia {{
as_timestamp(state_attr("calendar.darek","start_time") |
default(now(),true) )| timestamp_custom('%d/%m ') }}
primary: >-
Kalendarz: {%- if states('calendar.darek') == 'on' -%}
{{state_attr('calendar.darek', 'message')}} {%- else -%} - {%- endif -%}
multiline_secondary: true
fill_container: true
sensors
- platform: time_date
display_options:
- 'time'
- 'date'
- 'date_time'
- 'date_time_iso'
- 'time_date'
- 'time_utc'
- 'beat'
- platform: template
sensors:
dayoftheweek:
value_template: >
{{ ['PoniedziaÅek','Wtorek','Åroda','Czwartek','PiÄ
tek','Sobota','Niedziela'][now().weekday()] }}
1 Like
OK one more question that is mushroom related.
Iāve got the slider working for me. Input_number slider with 6 automations based on step value .
The only thing left I want to do is control the speed of the icon. The my-slider coding you already gave me. The icon already changes based on the value of the slider. Can you please show me how to change the animation speed
Thanks for the samples, I tried exactly that and played with numbers (as I am not quite sure exactly what they mean). I can use dev tools and drag the slider and watch it via dev tools and see:
āvalue:0.21
The value jumps to the exact number I dragged to. Shortly thereafter it jumps to some number between where I released and where I started, worse going down than going up. Like I just dragged from ā0.4ā to ā0.12ā and devtools showed the change of --value to ā0.12ā and then within less than one second it jumped back to ā0.25ā.
I would also note that clicking the slider has the same effect, the value jumps up to the place I clicked and then to some value in between.
So I moved on to more testing and just used a standard media card and it has the exact same behavior. So I would say that this setup with that particular device is not possible. It is a Vizio TV. My standard volume control I developed for Vizio TVs did not use the media_player entity and in fact uses a rest command. I found other issues with the Vizio TV and the media_player and now this just adds to the issues.
To further test this, I changed my YAML to point at my stereo media_player and it works perfectly. So the conclusion is that the media_player for a Vizio TV in the Vizio integration is the issue.
I will go back to the Vol+/Vol- click mode and just change the steps to 2 or 3 for her so she clicks ālessā until I can work out a better solution.
1 Like