type: custom:button-card
icon: mdi:human-male
name: My Name
entity: person.name
state_display: "[[[ return states['sensor.phone_battery_level'].state+'%'; ]]]"
show_state: true
styles:
  grid:
    - grid-template-areas: "'i n s'"
    - grid-template-columns: 70px 2fr 1fr
  name:
    - justify-self: start
  state:
    - justify-self: end
    - margin-right: 12px
    - font-size: 0.8em
  icon:
    - justify-self: start
    - background-color: |
        [[[
          if (entity.state == 'home')
            return "#d3f1b3";
           return "#f1bab3";
        ]]]    
    - color: |
        [[[
          if (entity.state == 'home')
            return "teal";
           return "#E34A37";
        ]]] 
    - border-radius: 50%
    - width: 30px
    - height: 30px
    - padding: 5px
    - margin-left: 12px