And if you read a bit more further, youāll see his Github page:
Can someone help with this please ?
How can I change the attribute on a tap action ?
See if this gets you started in the right direction.
type: custom:stack-in-card
mode: vertical
cards:
- type: custom:mushroom-template-card
primary: Utility
enity: switch.washing_machine_plug
icon: mdi:washing-machine
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: 70px;
--ha-card-border-width: 0px;
height: 66px;
margin-left: -23px !important;
margin-top: -3px !important;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
entity: switch.washing_machine_plug
tap_action:
action: more-info
icon: mdi:washing-machine
card_mod:
style: |
ha-card {
background: transparent;
border-style: none;
- type: custom:mushroom-chips-card
chips:
- type: template
entity: sensor.basement_sensor
icon: mdi:stove
icon_color: orange
tap_action:
action: more-info
content_info: none
card_mod:
style: |
ha-card {
--chip-icon-size:.5em;
--chip-spacing: -0.5em;
margin-top: 10px;
}
- type: template
entity: sensor.basement_sensor_battery
icon: mdi:apple
icon_color: red
tap_action:
action: toggle
card_mod:
style: |
ha-card {
--chip-icon-size: .5em;
--chip-spacing: -0.5em;
margin-top: 10px;
}
Are you looking to represent the fan spinning?
I use a button system where the color reflects the speed and direction. The fanās spin speed is also based of the setting. I did this by creating separate SVGs (my early HA days), but an easier solution would be to use animate/keyframes.
cellphone pic
No I am not into moving icons. It is ok for some time but it gets annoying for me
No what I want is code to use the button system.
So to change the speed of the airco, i need to change the attribute of the climate entitiy
No you donāt understand 
I already have the visuals made for the fan speed . I only need to know how I can use the tap action to change the fan speed. I see I have to change the attribute, but I donāt know how to do it
I made it with a conditional card to make it a little cleaner
Sorry was over thinking it. Just create a script that changes the fan speed and use that in the tap action
tap_action:
action: call-service
service: script.fan_speed_2
service_data:
entity_id: script.fan_speed_2
hmm, thanks. I never made a script. I will do some research and maybe Iāll come back 
Itās a built in function and the UI will walk you through it. Very similar to creating a dashboard card.
Located under hereā¦
1 Like
I do appreciate the response, didnāt even realise the template card can display sliders, I guess I have some more reading to do, thanks!
I didnāt add a slider to a template card.
I combined a mushroom template card with the stock mushroom humidifier card to achieve the desired results. This method allows you to get the specific data you want in the template card (target humidity) and I simply hid the features in the standard card that were repetitive.
Do I have to make a script for each button i have to control the fan speed ?
If you are going to go with individual 1 thru 5 speed buttons, yes. You could also go with a two button system and have just two scripts, one to increase the speed and one to decrease the speed.
1 Like
Hi guys,
I have had this problem several times, but somehow I solved it. I canāt solve now. I am talking about borders in card.
I tried to rewrite mushroom
I tried to rewrite card-mod
It seems like something is missing, maybe someone has a similar problem and knows how to solve it?
Ensure all yourt Card Mods look like thisā¦
card_mod:
style: |
style: | by itself no longer works
Yea all card_mode itās like u said
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-state-person-home), 0.4);
margin-top: 5px;
margin-bottom: 10px;
}
Just a bit more info pleaseā¦
-
Post a cardās entire code.
-
Are you using custom themes?
type: custom:stack-in-card
cards:
- type: custom:layout-card
layout_type: masonry
layout: {}
cards:
- type: custom:mushroom-chips-card
chips:
- type: menu
- type: alarm-control-panel
entity: alarm_control_panel.evo192_partition_area_1
content_info: none
name: Alarm
- type: conditional
conditions:
- entity: group.all_lights
state: 'on'
chip:
type: template
icon: mdi:lightbulb
content: >-
{{ expand(states.group.all_lights) | selectattr( 'state', 'eq',
'on') | list | count }}
tap_action:
action: more-info
entity: group.all_lights
icon_color: grey
- type: conditional
conditions:
- entity: group.external_doors
state: 'on'
chip:
type: template
icon_color: grey
icon: mdi:door-open
content: >-
{{ expand(states.group.external_doors) | selectattr( 'state',
'eq', 'on') | list | count }}
tap_action:
action: more-info
entity: group.external_doors
card_mod:
style: |
:host {
--ha-card-background: var(--card-background-color);
}
- square: false
columns: 2
type: grid
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: person.admin
state: home
chip:
type: entity
entity: person.admin
content_info: none
use_entity_picture: true
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-state-person-home), 0.4);
margin-top: 5px;
margin-bottom: 10px;
}
alignment: start
card_mod:
style: |
ha-card {
margin-left: 8px;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- entity: person.admin
state_not: home
chip:
type: entity
entity: person.admin
content_info: none
use_entity_picture: true
card_mod:
style: |
ha-card {
{% if is_state('person.admin', 'not_home') %}
--chip-background: rgba(var(--rgb-state-person-not-home), 0.4);
{% elif is_state('person.admin', 'unknown') %}
--chip-background: rgba(var(--rgb-state-person-unknown), 0.4);
{% else %}
--chip-background: rgba(var(--rgb-state-person-zone), 0.4);
{% endif %}
margin-top: 5px;
margin-bottom: 10px;
}
alignment: end
card_mod:
style: |
ha-card {
margin-right: 8px;
}
- type: custom:mushroom-title-card
title: |-
{% set time = now().hour %}
{% if (time >= 18) %}
Labas vakaras, {{user}}!
{% elif (time >= 12) %}
Laba diena, {{user}}!
{% elif (time >= 5) %}
Labas rytelis, {{user}}!
{% else %}
Labuka, {{user}}
{% endif %}
subtitle: ''
- type: custom:simple-weather-card
entity: weather.openweathermap
name: in Warnemunde
card_mod:
style: |
ha-card {
box-shadow: none;
background: none;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
primary: ''
secondary: House
icon: mdi:home
layout: vertical
icon_color: blue
tap_action:
action: navigate
navigation_path: house
card_mod:
style: |
ha-card {
background: var(--card-background-color);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Lights
icon: mdi:lightbulb
icon_color: amber
layout: vertical
tap_action:
action: navigate
navigation_path: lights
card_mod:
style: |
ha-card {
background: var(--card-background-color);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Secure
icon: mdi:shield
icon_color: green
layout: vertical
tap_action:
action: navigate
navigation_path: security
card_mod:
style: |
ha-card {
background: var(--card-background-color);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Media
icon: mdi:speaker
layout: vertical
icon_color: red
tap_action:
action: navigate
navigation_path: media
card_mod:
style: |
ha-card {
background: var(--card-background-color);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
}
- type: custom:mushroom-template-card
primary: ''
secondary: Net
icon: mdi:lan
layout: vertical
icon_color: cyan
tap_action:
action: navigate
navigation_path: media
card_mod:
style: |
ha-card {
background: var(--card-background-color);
width: 66px;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
}
card_mod:
style: |
ha-card {
padding: 2px;
background: rgba(var(--rgb-primary-text-color), 0.01);
}
Before I using minimalist theme. Now I delete minimalist and install mushroom.