#Some Mushroom examples

1 messages · Page 1 of 1 (latest)

hybrid magnet
#

When you take a look at what the custom:mushroom-template-card can do, you'll notice, it gives you more flexibility to customize it but you have to define every little aspect of it.```yaml

  • type: custom:mushroom-template-card
    entity: person.derek
    primary: '{{ state_attr(entity, "friendly_name").upper() }}'
    secondary: '{{ states(entity).capitalize() }}'
    layout: vertical
    icon: mdi:check
    icon_color: |-
    {% if states("person.derek").lower() == "home" %}
    green
    {% else %}
    red
    {% endif %}```In this example, you can easily apply the same concept used on the icon_color to the icon itself.
image.png
#

Note that most examples for Mushroom animation are outdated. A recent breaking change requires using ha-state-icon now```yaml

  • type: custom:mushroom-template-card
    primary: Robot
    icon: mdi:robot-outline
    icon_color: deep-purple
    entity: input_boolean.tester
    card_mod:
    style: |
    ha-state-icon {
    animation: rotation 3s linear infinite;
    }
    @keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
    }```
Mushroom_template_card_animation.gif
#

Some Mushroom examples

gentle leaf
#

This is EXACTLY what I was looking for, thank you thank you thank you

gentle leaf
#

@hybrid magnet question for you. Where you wrote DEREK, can I make the primary a 1 line entry? I'm trying to make tiles reading "Laundry Garage", "Basement Back Door", and "Left Garage".

#

Instead of

Screenshot_20230808_023721_Home_Assistant.jpg
#

Like can it be

Laundry
Garage
Closed

#

Basement
Back Door
Closed

hybrid magnet
#

I know there is an option for multiline_secondary but off the top of my head, I'm not sure how it is used. Even then, it may not produce the result that you're looking for.

#

In the meantime, consider some color or icon options for the open/closed indicators instead of text. Such as mdi:door-open/mdi:door and maybe a yellow icon if open. You can possibly use badge indicators to accomplish the same thing. Take a look at the second example and you can adapt that example into your card.