Empty space for not visible cards


for some cards i configured conditions, when they should be visible / invisible.

If a card i invisible, there is an empty space at the dashboard. Is there a way, that an invisible card disappears completely? My expectation would be, that there is no gap and the next card is shown like there is no other one between:

component: oh-label-cell
  header: Offene Fenster
  icon: f7:app
  item: Home_Fenster
  action: group
  actionGroupPopupItem: Home_Fenster
  visible: =items.Home_Fenster.state === 'ON'

Don’t think it’s possible
I was also contemplating something similar. So the alternate option i had was to create a f7-block with using the background slot of the cell. So basically it will not create an empty cell, but overlay the cell with anything you want. In my case, i want highlight if something is wrong with the item represented by the cell.

component: oh-label-cell
    - component: f7-card
        bgColor: pink
        visible: false
          position: absolute
          left: 0px
          top: 0px
          width: 100%
          height: 100%
          padding-top: 0px
          margin-top: 0px
          margin-left: 0px
          background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Achtung.svg/220px-Achtung.svg.png)
          background-repeat: no-repeat
          background-size: contain
          background-position: center


I have the very same problem.
Unfortunately, the visible is not translated to CSS’ display: none.

This is a pity because I only want to show certain widgets if their state is of any importance at that moment and I don’t want to have lot of ugly gaps in between the widgets due to that. :pensive:

1 Like

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.