Button spacing

[emeyedeejay]

Love this custom button!

Is it possible to correct the spacing when one button shows for "on" and one for "off"? When the state changes, the spacing is not correct. The "gate is open" button moves down and then the spacing above the red button is too big and below is too small.

[emeyedeejay]

YAML for above:

square: false
columns: 1
type: grid
cards:
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.kitchen_gate_monitor_contact
    title: Kitchen gate closed
    background_color: '#007000'
    font_color: '#ffffff'
    icon: mdi:gate
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "on" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.kitchen_gate_monitor_contact
    title: Kitchen gate open
    background_color: '#d2222d'
    font_color: '#ffffff'
    icon: mdi:gate-alert
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "off" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.lounge_gate_monitor_contact
    title: Lounge gate closed
    background_color: '#007000'
    font_color: '#ffffff'
    icon: mdi:gate
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "on" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.lounge_gate_monitor_contact
    title: Lounge gate open
    background_color: '#d2222d'
    font_color: '#ffffff'
    icon: mdi:gate-alert
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "off" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.drive_gate_monitor_contact
    title: Drive gate closed
    background_color: '#007000'
    font_color: '#ffffff'
    icon: mdi:gate
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "on" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.drive_gate_monitor_contact
    title: Drive gate open
    background_color: '#d2222d'
    font_color: '#ffffff'
    icon: mdi:gate-alert
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "off" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.garage_door_monitor_contact
    title: Garage door closed
    background_color: '#007000'
    font_color: '#ffffff'
    icon: mdi:gate
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "on" ]]]
  - type: custom:button-text-card
    large: true
    entity: binary_sensor.garage_door_monitor_contact
    title: Garage door open
    background_color: '#d2222d'
    font_color: '#ffffff'
    icon: mdi:gate-alert
    icon_size: 48
    hide_condition: |
      [[[ return entity.state === "off" ]]]

[Savjee]

Thanks for your detailed bug report! It took me a while to get around to fixing this. But I did manage to come up with a solution.

Try installing v0.6.2. It should fix the issue.