Mushroom Cards - Build a beautiful dashboard easily 🍄 (Part 1)

Share your Projects!
,
1471

I am trying to implement the badge icon, but it appears to be slightly off the side. I want to make the badge icon a bit larger

image

type: custom:stack-in-card
cards:
  - type: custom:mushroom-template-card
    primary: Bathroom
    secondary: |-
      Temp: {{ states('sensor.bathroom_temperature') }}ºC,               
      Hum: {{ states('sensor.bathroom_humidity') }}%    
    icon: mdi:shower
    tap_action:
      action: navigate
      navigation_path: bathroom
    hold_action:
      action: toggle
    icon_color: green
    badge_icon: |-
      {% set bathhum = states('sensor.bathroom_humidity') | int %}
      {% if bathhum > 65 %} 
      mdi:shower-head
      {% endif %}
    badge_color: |-
      {% set bathhum = states('sensor.bathroom_humidity') | int %}
      {% if bathhum > 80 %} 
       red
      {% elif bathhum > 65 %} 
       orange
      {% endif %}
    fill_container: true
    layout: horizontal
    multiline_secondary: false
    card_mod:
      style: |
        ha-card {
         --badge-icon-size: 1.0em;
           
        }
        :host([dark-mode]) {
          background: rgba(var(--rgb-primary-background-color), 0.2);
        } 
        :host {
          background: rgba(var(--rgb-primary-text-color), 0.025);
          --mush-icon-size: 76px;
          height: 76px;
          margin-left: -18px !important;
          
        }
1 Like