you can do this with the mushroom template chip and card mod I believe. I can take a look
Hi, thanks for your reply. Meanwhile I found out that I can add the label, but only in the top section for the badges. If I want to add a template chip card in another section, there is no label field. But if there is a way with card_mod, this will help me for beginning.
I had a play but this is the closest I can get.
chips are limited to one line, so I cant move anything (if there is I don’t know how)
type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:home-account
icon_color: blue
content: ' {{states(''switch.bar_switch'')}}'
card_mod:
style: |
ha-card {
height: 55px !important;
box-shadow: none;
ha-card-border-width: 0px;
}
ha-card:after {
content: "Switch";
position: absolute ;
top: 10%;
right: 19%;
font-weight: 700;
font-size: 11px;
color: black;
}
or
type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:home-account
icon_color: blue
content: ' {{states(''switch.bar_switch'')}}'
card_mod:
style: |
ha-card {
height: 55px !important;
box-shadow: none;
ha-card-border-width: 0px;
}
ha-card:after {
content: "Switch";
position: absolute ;
top: 10%;
right: 19%;
font-weight: 700;
font-size: 11px;
color: black;
}
ha-card:before {
content: "Light";
position: absolute ;
top: 62%;
right: 25%;
font-weight: 700;
font-size: 11px;
color: black;
}
Cool, big thanks. I will try it tomorrow. I will also create a feature request on GitHub. Maybe the dev can add the label option also to the chips card which are not in the badge row.
Thank you
Hello,
Because of somfy rts blinds without open/close status I would like to use the event of the open or close button. Where can I find this information?
Hello,
I’ve just find my answer: Help needed on automation using event call service - #2 by 123
Thank you
I don’t have any working code, because I couldn’t find a way to do it
It is a plug (switch) and two or more energy consumption sensors.
OK no problem. hopefully this can help you in the right direction.
type: custom:stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
}
primary: Air Fryer
secondary: ''
icon: mdi:power-socket-uk
fill_container: true
- type: custom:mushroom-template-card
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
margin-right: -50px;
}
primary: >-
{{states('sensor.pond_pumps_daily_energy')}}kWh |
{{states('sensor.pond_pumps_power')}}W
secondary: ''
icon: ''
layout: vertical
fill_container: true
multiline_secondary: false
Hey guys quick question, is it possible to use template variables (like var(–color-card-blue) in the mushroom template chip? Here is the code that I’m trying but doesn’t work (it works when putting colors like blue, grey etc…) :
type: custom:mushroom-chips-card
chips:
- type: template
entity: switch.prise_television
tap_action:
action: toggle
icon: |-
{% if states(entity) == "on" %}
mdi:television
{% else %}
mdi:television-off
{% endif %}
icon_color: |-
{% if states(entity) == "unavailable" %}
grey
{% elif states(entity) == "on" %}
var(--color-card-blue)
{% endif %}
hold_action:
action: more-info
The result is that the color doesn’t work.
A solution would be to use card_mod but since the template works with templates, kinda strange to use card_mod in addition.
Thanks!
you can it’s like this
var(--green-color)
Strange it doesn’t work on my side, it’s already on the code in the other post. Do I need to add something like {{ }}?
Btw here is how my color is made :
color-card-blue: rgba(0,191,255,0.2)
EDIT // So I tested putting the rgba directly and it didn’t work. However when adding the hex the color changes. So I tried putting the hex value in the theme variable but doesn’t change anything, even with a HA reboot and all. My guess is that mushroom can’t get variables when using the template.
oh is this in your theme?
Hi All!
I have a device/entity (Govee Lights) that I’d like to turn on, set initial brightness, and RGB settings upon a button push in my dashboard.
Easy thing is to just use an Entity Card, turn on the brightness and color controls and just manually select each time (that’s what I’m doing now). But I’d like it to default to specific settings on toggle. Is there an easy way to do this?
use a script - set all your settings in the script that you want to have happen on toggle. then activate the script on tap.
Hi,
Yup. I saw this issue on GitHub however : [Bug]: rgba not working in template card · Issue #1500 · piitaya/lovelace-mushroom · GitHub
Talks about the template card but maybe the issue is here for the chip template as well.
Do you use these vars? What is your code?
It looks good, although there are some lines in the center and if you press the sensors on the right you don’t get more information, and it also doesn’t seem to have the same appearance as the general mushroom.
type: custom:stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
}
primary: Air Fryer
secondary: null
entity: switch.air_fryer_plug_relay
icon: mdi:power-socket-eu
fill_container: true
- type: custom:mushroom-template-card
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
margin-right: -50px;
}
primary: >-
{{states('sensor.air_fryer_plug_energy')}} kWh |
{{states('sensor.air_fryer_plug_power')}} W
secondary: ''
icon: ''
layout: vertical
fill_container: true
multiline_secondary: false
Another thing I could notice is that when you turn on the switch, it does not color as if it were on.
thanks for all
it was just meant as a starting point for you, to customise the rest to your liking. but How’s this?
type: custom:stack-in-card
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
}
cards:
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
entity: switch.4ch_relay_bridge_light
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
}
primary: Air Fryer
secondary: ''
icon: mdi:power-socket-uk
icon_color: |
{% if states(entity) == "on" %}
green
{% else %}
red
{% endif %}
fill_container: true
- type: custom:mushroom-template-card
entity: sensor.pond_pumps_power
card_mod:
style: |
ha-card {
box-shadow: none;
border: none;
margin-right: -60px;
}
secondary: >-
{{states('sensor.pond_pumps_daily_energy')}}kWh |
{{states('sensor.pond_pumps_power')}}W
primary: ''
icon: ''
layout: vertical
fill_container: true
tap_action:
action: more-info
Now the status (switch color) and the WATT history seem to work, although not the KWH history and the separator stripe in the center continues to appear.
Thank you very much, I have no idea about these cards hahaha I’m a complete noob here.
you can only have one click action on a card so you won’t be able to
you could set a double click for this?
what theme are you using ?
Hey there,
can someone help me here?
I did a template card with ha-card mod and so on.
in a normal dashboard, i get it, no problem.
Once i try to add it into the wallpanel, where some allready exists, I do only see the icon, but not the primary and secondary…
I tried everything, hopefully someone can help me…
- type: custom:mushroom-template-card
primary: Pooltemperatur
secondary: '{{ states("sensor.pooltemperatur") }} °C'
icon: mdi:hot-tub
icon_color: blue
card_mod:
style:
mushroom-state-info$: |
.container {
--card-primary-font-size: 30px !important;
--card-primary-color: red;
--card-secondary-font-size: 30px !important;
--card-secondary-color: blue;
--card-primary-line-height: 40px;
--card-secondary-line-height: 40px;
flex-direction: row !important;
align-items: baseline !important;
gap: 10px;
}
mushroom-shape-icon$: |
.shape {
--shape-color: none !important;
}
.: |
ha-card {
zoom: '';
width: 85%
height: fit-content !important;
background: darkgrey;
border: black;
color: black;
text-shadow: 2px 1px 3px black;
margin-left: 110%;
margin-top: -150%;
}
ha-state-icon {
--icon-symbol-size: 30px;
}