Trying to add code to a mushroom button card

I am trying to add my mobile battery into a mushroom button card, I dont even know if this is possible!

This is my code, It seems good but nothing shows up so I have not got it quite right…

If anyone can see the issue I would be grateful.

square: false
type: grid
cards:
  - type: custom:mushroom-person-card
    entity: person.darren
    icon_type: entity-picture
    layout: vertical
    custom_fields:
      battery:
        - align-self: right
        - position: absolute
        - right: 4%
        - top: 4%
        - color: >-
            [[[ if (states["sensor.kingkong_x_pro_battery_level"].state <= 30)
            return "#e45649"; if
            (states["sensor.kingkong_x_pro_battery_level"].state <= 50) return
            "#ffa229"; else return "#50A14F"; ]]]
      custom_fields:
            battery: >
             [[[ return `<ha-icon icon="mdi:battery" style="width: 20px; height:
             20px;"></ha-icon
             <span>${states['sensor.kingkong_x_pro_battery_level'].state}%</span>` ]]]             
  - type: custom:mushroom-person-card
    entity: person.mary
    layout: vertical
    icon_type: entity-picture
columns: 2
grid_options:
  columns: 12
  rows: 2

1 post - 1 participant

Read full topic