Is it possible to flashing mushroom chips card?
with the release of ha 2022.11 i have a line between cards if i use the custom:stack-in-card:
How can i get rid of it?
There is a PR on stack-in-card to fix that behavior but there is no update since 2 years.
The vertical-stack-in-card has been fixed, you can try this one if you want.
Thanks, replaced custom:stack-in-card with custom:vertical-stack-in-card and no further changes and it now good.
another question this morning i changes the code of my chip card for the border te code below to see no border / shadow:
card_mod:
style: |
ha-card {
--ha-card-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
But after updating to v2.3.1 they came back but can’t find how to remove it:
nice card can you share this code or this card ?
yes, needs only the fix for the border:
type: custom:vertical-stack-in-card
cards:
- show_current: true
show_forecast: true
type: weather-forecast
entity: weather.br_unknown_station
- type: custom:mushroom-chips-card
chips:
- type: template
content: >-
{{ state_attr('weather.br_unknown_station', 'forecast')
[0].precipitation}} mm
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
}
- type: template
content: >-
{{ state_attr('weather.br_unknown_station', 'forecast')
[1].precipitation}} mm
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
}
- type: template
content: >-
{{ state_attr('weather.br_unknown_station', 'forecast')
[2].precipitation}} mm
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
}
- type: template
content: >-
{{ state_attr('weather.br_unknown_station', 'forecast')
[3].precipitation}} mm
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
}
- type: template
content: >-
{{ state_attr('weather.br_unknown_station', 'forecast')
[4].precipitation}} mm
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 35px;
--chip-padding:12px;
}
alignment: center
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.aqara_tuin_temperature
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 30px;
--chip-padding:7px;
}
- type: entity
entity: sensor.aqara_tuin_humidity
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 30px;
--chip-padding:7px;
}
- type: entity
entity: sensor.br_wind_direction_2
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 30px;
--chip-padding:7px;
}
- type: entity
entity: sensor.br_wind_speed_2
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 30px;
--chip-padding:7px;
}
- type: template
content: '{{ state_attr(''weather.br_unknown_station'', ''visibility'') }} km'
icon: mdi:eye
card_mod:
style: |
ha-card {
--chip-border-width: 0;
--chip-background: none;
--chip-height: 30px;
--chip-padding:7px;
}
alignment: center
Edit: fix for border added
–chip-border-width: 0
As I can see, you will write about this a few more times this week
Mushroom Shadow and Mushroom Square Shadow.
Thanks, that fixed it. Changed is now 3 times the last week so was a bit confused what to use now.
Everythig is fixed now with release 2022.11 for me, except the map card in a grid card but posted that in the 2022.11 topic.
Cool use for the new tile card is being able to toggle lights with the icon and bring up more info by tapping the card. @piitaya Is it possible to add support for light colour in the icon?
Tile Light Card
type: custom:vertical-stack-in-card
cards:
- type: tile
entity: light.local_lamp
show_entity_picture: false
name: Monitor Light
card_mod:
style: |
ha-card {
background: none;
box-shadow: none;
{% if is_state(config.entity, 'on') %}
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
{% endif %}
}
ha-tile-icon {
{% if is_state(config.entity, 'on') %}
--icon-color: rgb({{r}}, {{g}}, {{b}}) !important;
--shape-color: rgba({{r}}, {{g}}, {{b}},0.2) !important;
{% endif %}
}
- type: custom:mushroom-light-card
entity: light.local_lamp
use_light_color: true
show_brightness_control: true
show_color_control: true
show_color_temp_control: true
collapsible_controls: false
icon_type: none
primary_info: none
secondary_info: none
card_mod:
style: |
ha-card {
margin-top: -15px;
background: none;
box-shadow: none;
{% if is_state(config.entity, 'on') %}
--primary-text-color: rgb({{ state_attr(config.entity,'rgb_color') [0] }},
{{ state_attr(config.entity,'rgb_color') [1] }},
{{ state_attr(config.entity,'rgb_color') [2] }});
{% endif %}
}
}
card_mod:
style: |
ha-card {
{% if is_state('light.local_lamp', 'on') %}
background: rgba({{ state_attr('light.local_lamp','rgb_color') [0] }},
{{ state_attr('light.local_lamp','rgb_color') [1] }},
{{ state_attr('light.local_lamp','rgb_color') [2] }},0.1);
{% endif %}
}
Collapsable Tile Light Card
type: custom:vertical-stack-in-card
cards:
- type: tile
entity: light.local_monitor_light
show_entity_picture: false
name: Monitor Light
card_mod:
style: |
ha-card {
background: none;
box-shadow: none;
{% if is_state(config.entity, 'on') %}
{% set r = state_attr(config.entity, 'rgb_color')[0] %}
{% set g = state_attr(config.entity, 'rgb_color')[1] %}
{% set b = state_attr(config.entity, 'rgb_color')[2] %}
{% if is_state(config.entity, 'on') %}
--primary-text-color: rgb({{r}}, {{g}}, {{b}});
--secondary-text-color: rgba({{r}}, {{g}}, {{b}},0.5);
{% endif %}
{% endif %}
}
ha-tile-icon {
{% if is_state(config.entity, 'on') %}
--icon-color: rgb({{r}}, {{g}}, {{b}}) !important;
--shape-color: rgba({{r}}, {{g}}, {{b}},0.2) !important;
{% endif %}
}
- type: conditional
conditions:
- entity: light.local_monitor_light
state: 'on'
card:
type: custom:mushroom-light-card
entity: light.local_monitor_light
use_light_color: true
show_brightness_control: true
show_color_control: true
show_color_temp_control: true
collapsible_controls: true
icon_type: none
primary_info: none
secondary_info: none
card_mod:
style: |
ha-card {
margin-top: -15px;
background: none;
box-shadow: none;
{% if is_state(config.entity, 'on') %}
--primary-text-color: rgb({{ state_attr(config.entity,'rgb_color') [0] }},
{{ state_attr(config.entity,'rgb_color') [1] }},
{{ state_attr(config.entity,'rgb_color') [2] }});
{% endif %}
}
}
card_mod:
style: |
ha-card {
{% if is_state('light.local_monitor_light', 'on') %}
background: rgba({{ state_attr('light.local_monitor_light','rgb_color') [0] }},
{{ state_attr('light.local_monitor_light','rgb_color') [1] }},
{{ state_attr('light.local_monitor_light','rgb_color') [2] }},0.1);
{% endif %}
}
hello where should this be placed so that it works?
Does this occur even with ha-card-border-width: '0px'
set in the theme? I’ve not upgraded to 2022.11 yet, and I don’t hope to have to change all my stack-in cards to a vertical-stack-in cards
themes map, and mushroom.yaml within it, don’t worry about the color code, my template is on, leave the default. dark and light
Hey all!
Is there some way to change the entity name depending on the temperature from a sensor?
For ex, if the temperature in my bathroom is below 18 degrees i wan’t the name of the sensor to be red.
Thanks!
Too fix border issue after upgrade to 2022.11 I went to /config/themes/mushroom and duplicate mushroom.yaml file. I called new file mushroom-custom.yaml. I Edited file, deleted all and pasted:
Mushroom Custom:
modes:
light: {}
dark: {}
ha-card-border-width: '0px'
After that I restart HA and in profile settings I selected new themes Mushroom Custom.
It is working for me but I found issue with browser_mod.popup
. The pop up window doesn’t have border now. My current setting is not working:
data:
style: >
--popup-border-radius: 12px;
--popup-border-width:
var(--ha-card-border-width, 1px);
Did not try that
I added ha-card-border-width: '0px'
to my theme file (I’m not using the Mushroom) themes, and that got rid of the new 2022.11 borders, including the ones between cards in my stacks - so I did not have to replace my stack-in cards with the vertical-stack-in cards.
Thank you for posting this!
And thanks also to @Valdorama for making me look further up in the forum posts
I updated HA yesterday and all my cards had borders around them after that.
I run a custom theme, and added this entry
ha-card-border-width: ‘0px’
After title, before modes.
Restart HA
All is well again.
MacOS theme
ha-card-border-width: '0px'
modes:
light: [...]
Hi all,
I’ve just updated to 2022.11.1 and all of a sudden all my mushroom cards are showing an error saying “Custom element doesn’t exist: mini-graph-card.”. It shows the same error for the other card types. Any idea how to fix that? Strangely they work on the Nabu Casa app!
Thanks