custom-cards / button-card

❇️ Lovelace button-card for home assistant
MIT License
1.83k stars 227 forks source link

Button order in masonry #795

Open dusan-ivanco opened 8 months ago

dusan-ivanco commented 8 months ago

Checklist

Describe the bug Difference in button order between "Hass Button Card" and "Custom Button Card"

Version of the card Version: 4.1.1

To Reproduce This is the configuration I used:

  - type: masonry
    path: hass
    title: Hass Button
    cards:
      - type: button
        name: ESP
        icon: mdi:chip
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/5c53de3b_esphome
      - type: button
        name: Zigbee
        icon: mdi:zigbee
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/45df7312_zigbee2mqtt
      - type: button
        name: Z-Wave
        icon: mdi:z-wave
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_zwavejs2mqtt
      - type: button
        name: SSH
        icon: mdi:console
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_ssh
      - type: button
        name: File Editor
        icon: mdi:file-document-edit
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_vscode
      - type: button
        name: Node RED
        icon: mdi:vector-polyline
        icon_height: 48px
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_nodered

  - type: masonry
    path: custom
    title: Custom Button
    cards:
      - type: custom:button-card
        name: ESP
        icon: mdi:chip
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/5c53de3b_esphome
      - type: custom:button-card
        name: Zigbee
        icon: mdi:zigbee
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/45df7312_zigbee2mqtt
      - type: custom:button-card
        name: Z-Wave
        icon: mdi:z-wave
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_zwavejs2mqtt
      - type: custom:button-card
        name: SSH
        icon: mdi:console
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_ssh
      - type: custom:button-card
        name: File Editor
        icon: mdi:file-document-edit
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_vscode
      - type: custom:button-card
        name: Node RED
        icon: mdi:vector-polyline
        template: link
        tap_action:
          action: navigate
          navigation_path: /hassio/ingress/a0d7b954_nodered

Screenshots Hass Button Card

Hass Button Card

Custom Button Card

Custom Button Card

Expected behavior I would like it if the buttons were arranged as is customary, from left to right and from top to bottom. Exactly the same as the "Hass Button Card" has it.