I want to make a mushroom template card, with which I can make the menu/sidebar visible.
now there is only a chip card with which you can call the menu.
is there a navigation path with which I can do that for example?
Very nice, could you share the code for that?
Hello all,
is it feasible to specify the current position of a shutter as status in the mushroom template card? Open or closed works fine, but if the shutter is only partially closed, it is still listed as open in the status, so I actually need the position.
{{ expand(states.group.rollladen) | selectattr( 'state', 'eq',
'closed') | list | count }}
This is my current code, but I need position smaller than 100
Am grateful for any help.
Greetings
Moss
Hi all,
How can I align the chip card in the grid?
type: custom:layout-card
layout_type: grid
cards:
- type: custom:mushroom-template-card
primary: >
{{ states('sensor.temperatura_esterna_meteonetwork')| replace (".",",")}}
°C
secondary: '{{ states(''sensor.umidita_esterna_meteonetwork'')}} %'
icon: ''
picture: |
{% set mapper =
{ 'clear night': 'day',
'cloudy': 'cloudy',
'fog': 'cloudy',
'hail': 'rainy-7',
'lightning': 'thunder',
'lightning rainy': 'thunder',
'mostly cloudy': 'cloudy',
'partly cloudy': 'cloudy',
'partlycloudy': 'cloudy-day-3',
'pouring': 'rainy-6',
'rainy': 'rainy-5',
'snowy': 'snowy-6',
'snowy rainy': 'rainy-7',
'sunny': 'day',
'windy': 'cloudy',
'windy variant': 'cloudy-day-3'} %}
{% set state =
states('weather.forecast_meteonetwork').lower().replace('-',' ') %}
{{ '/local/meteo/animated/{}.svg'.format(mapper[state]) }}
layout: vertical
icon_color: ''
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
--card-primary-font-size: 10px;
--card-secondary-font-size: 10px;
--icon-size: 30px; }
- type: custom:mushroom-template-card
primary: |
{{ states('sensor.temperatura_interna')| replace (".",",")}} °C
secondary: ''
icon: mdi:home
picture: ''
layout: vertical
icon_color: white
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
--card-primary-font-size: 10px;
--card-secondary-font-size: 10px;
--icon-size: 30px; }
- type: custom:mushroom-template-card
primary: |-
{% if states('sensor.qualita_aria') | int(default=0) <= 50 %}
Buona
{% elif states('sensor.qualita_aria') | int(default=0) <= 100 %}
Moderata
{% elif states('sensor.qualita_aria') | int(default=0) <= 150 %}
Scadente
{% elif states('sensor.qualita_aria') | int(default=0) <= 200 %}
Insalubre
{% elif states('sensor.qualita_aria') | int(default=0) <= 300 %}
Inquinata
{% elif states('sensor.waqi_arenula_roma_lazio_italy') | int(default=0) >=
300 %}
PERICOLOSA
{% endif %}
secondary: |
{{states('sensor.qualita_aria')}} AQI
icon: mdi:tailwind
picture: ''
layout: vertical
icon_color: |-
{% if states('sensor.qualita_aria') | int(default=0) <= 50 %}
green
{% elif states('sensor.qualita_aria') | int(default=0) <= 100 %}
yellow
{% elif states('sensor.qualita_aria') | int(default=0) <= 150 %}
orange
{% elif states('sensor.qualita_aria') | int(default=0) <= 200 %}
red
{% elif states('sensor.qualita_aria') | int(default=0) <= 300 %}
#660099
{% elif states('sensor.waqi_arenula_roma_lazio_italy') | int(default=0) >= 300 %}
#7e0023
{% endif %}
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
--card-primary-font-size: 10px;
--card-secondary-font-size: 10px;
--icon-size: 30px; }
- type: custom:mushroom-template-card
primary: ' {{ states(''sensor.assorbimento_elettrico_casa_watt'')}} W '
secondary: '{{states(''sensor.costo_energia_giornaliero'')}} €'
icon: mdi:flash
picture: ''
layout: vertical
icon_color: |2-
{% if states('sensor.assorbimento_elettrico_casa_watt') | float >= 3000 %}
red
{% elif states('sensor.assorbimento_elettrico_casa_watt') | float >= 2000
%}
orange
{% elif states('sensor.assorbimento_elettrico_casa_watt') | float >= 500
%}
yellow
{% elif states('sensor.assorbimento_elettrico_casa_watt') | float < 500 %}
green
{% endif %}
card_mod:
style: |
ha-card {
background: none;
--ha-card-box-shadow: 0px;
--card-primary-font-size: 10px;
--card-secondary-font-size: 10px;
--icon-size: 30px; }
- type: horizontal-stack
cards:
- type: custom:mushroom-chips-card
style: |
ha-card {
--chip-background: none;
--chip-box-shadow: 0px 0px 10px yellow;
--chip-icon-size: 0.5em;
--chip-height: 50px;
--chip-border-radius: 100px;
}
chips:
- type: template
entity: switch.prese_casa
icon: |-
{% if is_state('switch.prese_casa', 'on')%}
mdi:power-socket-de
{% else %}
mdi:power-socket-de
{% endif %}
icon_color: |-
{% if is_state('switch.prese_casa', 'on')%}
yellow
{% else %}
white
{% endif %}
content: ''
alignment: center
layout:
grid-template-columns: 20% 20% 20% 20% 20%
grid-template-rows: auto
grid-template-areas: |
"main main2 main3 main4 main5"
I’m not sure what do you want to achive. But if you need number of covers with position below 100, you can use this one:
{{ states.cover|selectattr('attributes.current_position','lt',100)|list|length }}
or for number of covers partially opened:
{{ states.cover|selectattr('attributes.current_position','lt',100)|selectattr('attributes.current_position','gt',0)|list|length }}
1 Like
I get displayed when the shutters are closed, but this only works when the shutters are really completely closed.
The status is then closed.
But I would also like to get displayed when they are also partially closed, the status is then from the shutter still open so brings me the status closed nothing.
I have to take the position as status, as soon as the shutter is closed a bit, I want to get this displayed.
I had solved this earlier in my old dasboard by badge, but am now completely switched to Mushroom and get this displayed as a chip, most by condition with status, on, off, open or closed.
Only with the roller shutter I just need something other than closed or open.
Greetings
Moss
So you would like to have a single representation of all of the shutters? I mean something like:
- all closed or partially closed (icon/state → closed)
- at least one fully open (icon/state → open)
In that case, you can use some condition from my previous comment. The best would be if you’ll share what you’ve got right now as code and explain on this example what you’d like to alter.
This is my actually code
- type: conditional
conditions:
- entity: group.rollladen
state: closed
chip:
type: template
icon: mdi:window-shutter
content: >-
{{ expand(states.group.rollladen) | selectattr( 'state', 'eq',
'closed') | list | count }}
tap_action:
action: more-info
entity: group.rollladen
icon_color: grey
State is closed and Icon is displayed only when the shutter is completely closed. I would like to have the icon displayed when the shutter position is below 100.
I can’t get that to work.
Can also be quiet for individual shutters, does not have to be the group.
Thanks for your help
Moss
Ok, now I got what the issue is. The biggest problem here is that conditional works only on the state. So what you can do is e.g. create a sensor which will reflect your idea
template:
- sensor:
- name: "Is any cover closed"
state: >
{{expand(states.group.rollladen)| selectattr('attributes.current_position','lt',100)|list|length|bool }}
This sensor will return True if there will be at least one cover with the position 0-99 (assuming 100 is open). You can adjust this condition for your needs.
And in your card:
- type: conditional
conditions:
- entity: sensor.is_any_cover_closed
state: "True"
chip:
type: template
icon: mdi:window-shutter
content: >-
{{ expand(states.group.rollladen) | selectattr('attributes.current_position','lt',100) | list | count }}
tap_action:
action: more-info
entity: group.rollladen
icon_color: grey
1 Like
Here you have a really nice example how you can achieve it:
1 Like
It is for template chips, but I want use entity chips with card mode style.
Thanks for the help, unfortunately I can’t get it to work. Have now tried it with a shutter, which would also make more sense to me than to monitor the group. But I get no icon displayed when the shutter is at 80% position.
My sensor:
- sensor:
- name: "Rollladen Wohnzimmer Rechts Positionserkennung"
state: >
{{expand(states.cover.rollladen_wohnzimmer_rechts)|selectattr('attributes.current_position','ge',0)|list|length|bool }}
and in my card.
>-
{{ expand(states.cover.rollladen_wohnzimmer_rechts) |
selectattr('attributes.current_position','ge',0) | list | count
}}
greets
Moss
I have updated my previous post, as it contained some issues. You can take a look now, I’ve tested it on my covers. It’s not presenting chip only when all covers are fully open (so the position is 100). In any other case, it’s presenting a chip with the number of closed covers.
1 Like
Works perfectly, thanks for your help
Greetings
Moss
Does anyone know how to change Chip - Text and Icon color with Card Mod?
Hi!, I saw your mushroom customization in another topic and I really liked it, do you mind to share your button cards (Despacho) / mushroom
1 Like
That’s unfortunately not Mushroom, but Minimalist UI, Room Card
1 Like
Can you share your yaml for those room cards? I couldn’t find it in previous post but maybe my mobile search is limited. Thank you
New to the cards, and loving them! Is there a way to force a colour on to the text in a Title card? It seems to be black for light themes, and white for dark themes. I’d like it to always be white (I have a background set in my theme, and white works best with it). If it involves card-mod, some sample code would be most welcome! Thanks for any tips.