swipe-card in layout-card does not update its size

[matt8707]

My Home Assistant version: 2021.5.5

Layout-card version (FROM BROWSER CONSOLE): 2.2.3

What I am doing:
Using swipe-card in custom:grid-layout.

What I expected to happen: The swipe card should update its size to fit the grid

What happened instead: The swipe card only updates its size if the window is resized, looks like this.swiper.update(); is called. The thing is, in regular lovelace it updates its size, but using custom:masonry-layout it does not so I'm unsure if it's related to swipe-card or layout-card.

related bramkragten/swipe-card#32

Minimal steps to reproduce:

views:
  - type: custom:grid-layout
    path: 0
    layout:
      grid-template-columns: 1fr 1fr
      grid-template-rows: 1fr
      grid-template-areas: |
        "one two"
    cards:
      - type: grid #grid needed as container?
        view_layout:
          grid-area: one
        columns: 1
        cards:
          - type: custom:swipe-card
            view_layout:
              grid-area: one
            cards:
              - type: picture
                image: 'https://demo.home-assistant.io/stub_config/t-shirt-promo.png'
              - type: entities
                entities:
                  - light.x
      - type: picture
        view_layout:
          grid-area: two
        image: 'https://demo.home-assistant.io/stub_config/t-shirt-promo.png'

Error messages from the browser console: None

---

By putting an X in the boxes ([X]) below, I indicate that I:

• Understand that this is a channel for reporting bugs, not a support forum (https://community.home-assistant.io/).
• Have made sure I am using the latest version of the plugin.
• Have followed the troubleshooting steps of the "Common Problems" section of https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins.
• Understand that leaving one or more boxes unticked or failure to follow the template above may increase the time required to handle my bug-report, or cause it to be closed without further action.

[jrbloemhof]

This is an issue with the library underpinning swipe-card (see bramkragten/swipe-card#32), not something that can be fixed by layout-card.

[matt8707]

It’s not though. swipe-card updates its size in vanilla lovelace but not in layout-card. I bet the issue lies with swipe-card and not layout-card and I also understand that a custom card cannot support all other custom cards.

[jrbloemhof]

The reason I say it's not something that can be fixed by layout-card is because the library underpinning swipe-card is documented to only respond when the window resizes.

breakpointsBase: If set to window (by default) then breakpoint keys mean window width.

So there's nothing layout-card could reasonably do to adjust this behavior.

On the other hand, swipe-card lets you adjust Swiper parameters - setting "breakpointsBase" to "container" may fix your issue.

[matt8707]

I've mostly fixed it by removing the margin from parent container but, you're right. I'm closing the issue for layout-card