Problem with HA version 2024.6

[Guizmos]

Before the update my cards were displayed normally without any special space. After the update I have spaces. As if hidden cards create spaces

[blowk]

Can you check in HA if 'make square tiles' are toggled off?

[rotem657]

It's the same on my side. @blowk make square tiles is set to be off. before the update, everything worked as it should.

[blowk]

@rotem657 can you post the code of the example above? I will test it if I have the same problem.

[Guizmos]

I found the solution, it came from my theme. by testing with the original theme I did not have this lag problem

[rotem657]

@rotem657 can you post the code of the example above? I will test it if I have the same problem. @blowk

cards:
  - square: false
    type: grid
    cards:
      - type: custom:button-card
        name: Controls
        icon: mdi:gamepad
        layout: icon_name
        tap_action:
          action: fire-dom-event
          local_conditional_card:
            action: set
            ids:
              - tab_1: show
              - tab_2: hide
              - tab_3: hide
        styles:
          card:
            - height: 40px
      - type: custom:button-card
        name: Controls2
        icon: mdi:gamepad
        layout: icon_name
        tap_action:
          action: fire-dom-event
          local_conditional_card:
            action: set
            ids:
              - tab_1: hide
              - tab_2: show
              - tab_3: hide
        styles:
          card:
            - height: 40px
      - type: custom:button-card
        name: Controls3
        icon: mdi:gamepad
        layout: icon_name
        tap_action:
          action: fire-dom-event
          local_conditional_card:
            action: set
            ids:
              - tab_1: hide
              - tab_2: hide
              - tab_3: show
        styles:
          card:
            - height: 40px
    columns: 3
  - type: custom:local-conditional-card
    id: tab_1
    default: show
    card:
      square: false
      type: grid
      cards:
        - type: custom:mushroom-title-card
          title: Hello, {{ user }} !
      columns: 1
  - type: custom:local-conditional-card
    id: tab_2
    default: hide
    card:
      square: false
      type: grid
      cards:
        - type: custom:mushroom-title-card
          title: Hello, {{ user }} !
      columns: 1
  - type: custom:local-conditional-card
    id: tab_3
    default: hide
    card:
      square: false
      type: grid
      cards:
        - type: custom:mushroom-title-card
          title: Hello, {{ user }} !
      columns: 1

It's pretty basic, when you change the tab you can notice the space added on top of the title card.

[blowk]

@rotem657 you're right. I could produce the same error as you do. It's display the empty tabs not correctly.

I haven't found a solution for this.

[Guizmos]

@rotem657 you're right.

I could produce the same error as you do.

It's display the empty tabs not correctly.

I haven't found a solution for this.

Have you tried with the default HA theme?

[blowk]

It's the same with the default HA theme.

[blowk]

I had more time to dive in and found since version 2024.3, it add 8px for the vertical stack card. You can add the following variables to your theme template.

mytheme:
      # Vertical stack card
      vertical-stack-card-gap: "0px"
      stack-card-gap: "0px"

This should fix the jumping problem.

[PiotrMachowski]

Fixed in v2.1.1

[mrgrlscz]

Unfortunately... It's not fixed in 2.1.1

And setting this, just kill every gap of the dashboard -> not a solution in my case:

mytheme:
      # Vertical stack card
      vertical-stack-card-gap: "0px"
      stack-card-gap: "0px