Anyone using the new sections (experimental) layout with mushroom cards?
Seems mostly OK but with a chips card, I get this extra padding/space under the chips card elements. Works OK in a vertical (layout-card) view type but seems to just show up in the sections layout. When I hover over the chips card, the border is drawn around the space too so looks like it’s the styling within the chips card not working quite right with sections.I’ve tried playing with card-mod borders and padding but not managed to get rid of the space so far. Any thoughts?
Guys, there is one issue that I have not yet been able to resolve with Jay @LiQuid_cOOled, I was just wondering if maybe someone has encountered something similar and has already solved this emerging artifact during animation in a mobile companion.
We are talking about shape pulsating animation, if shape pulsating animation is turned on (it doesn’t matter with or without icon animation), a blinking radius square appears around the icon from time to time.
Has anyone encountered something similar?
It’s happens only in mobile companion, in desktop all works fine.
I’m happy with this stack in a card but some recent change to HA has resulted in a line across the mushroom entity card.
Here is the yaml for the card. I think I need to change something relating to the card_mod style for the mushroom entity card but I am not sure how to fix this.
Thanks for any assistance!
type: custom:stack-in-card
cards:
- type: custom:mushroom-entity-card
entity: switch.linktap_tap_front
name: Front
fill_container: true
- type: custom:mushroom-chips-card
chips:
- type: template
entity: sensor.linktap_tap_front_battery
icon: mdi:battery-charging
icon_color: >-
{% if states ('sensor.linktap_tap_front_battery') | int(0) < 30 %}
red {% elif states ('sensor.linktap_tap_front_battery') | int(0) < 50
%} orange {% else %} green {% endif %}
content: '{{ states (''sensor.linktap_tap_front_battery'') }}%'
tap_action:
action: more-info
card_mod:
style: |
ha-card {
border: none;
box-shadow: none;
}
- type: template
entity: sensor.linktap_tap_front_signal
icon: mdi:wifi
icon_color: >-
{% if states ('sensor.linktap_tap_front_signal') | int < 30 %} red
{% elif states ('sensor.linktap_tap_front_signal') | int < 50 %}
orange {% else %} green {% endif %}
content: '{{ states ("sensor.linktap_tap_front_signal") }}%'
tap_action:
action: more-info
card_mod:
style: |
ha-card {
border: none;
box-shadow: none;
}
alignment: justify
card_mod:
style: |
ha-card {
position: absolute;
top: 5px;
right: 15px;
width: 60px;
--chip-spacing: -12px;
--chip-background: none;
}
Namely because of the size of the icon. Default icon size is animated without this square artifact. Does anyone have any ideas on how this issue can be resolved?
Hello, I need your help, on the standard fan card that comes on top, the fan rotation speed on the icon works depending on the speed of the physical fan. And in the code below, the fan icon rotates at a constant, maximum speed, regardless of the actual fan speed. How can I make the icon in the lower code also change the rotation speed depending on the speed of the real fan?
I know this is a very minor cosmetic issue but after removing the line, I notice the main entity card is a little wider than normal and not quite centred. Does anyone know what is causing this and how can it be fixed?
One option is to make the stack-in-card tighter/smaller so the entity card is not stretched.
The other is to align the entity card content to the middle so that it looks centred.
