Good evening all, I am trying to develop a person card from a custom button card. I am having an issue with the spacing of the text around the icon. Here is what the card looks llike:
What I want to do is:
- Get the text closer to the icon, preferably left justified, but that is not a requirement.
- Tighten up the space around the edges of the card.
Here is the current code for the button card.
type: custom:button-card
entity: person.rob
icon: mdi:alpha-r-box-outline
color_type: icon
show_state: true
state:
- value: home
icon: mdi:alpha-r-box
styles:
grid:
- grid-template-areas: '" i n" "i s"'
- grid-template-rows: 1fr 1fr
- grid-template-columns: 1fr 1fr
card:
- background-size: cover
- width: 150px
state:
- color: rgb(0, 255, 0)
- font: 12px Roboto
name:
- color: rgb(0, 255, 0)
- font: 12px Roboto
I would greatly appreciate any help.
Thanks in advance.