OH3 Overview Page Spacing and alignment

  • Platform information:
    • Hardware: _amd64
    • OS: Windows 10/10.0
    • Java Runtime Environment: 11.0.9.1 (Zulu11.43+55-CA)
    • openHAB version: openHAB 3.1.0.M5

Hi All

I have a weird alignment/layout issue with cards (cells) displayed via the Overview Page:

Overview1

As you can see from the above, if the Overview Page is selected via the openHAB logo on the front page. there is a large gap before the actual page is displayed.

If the Overview Page is selected from the Left Panel (the same page), there is no gap.

This affects the way the page is displayed - especially on smaller screens.

The same issue is exhibited for all the Cards/Cells called in this way.

The Page is configured as follows:

component: oh-cell
config:
  title: Power Usage
  trendItem: ShellyEM_MAINS_Watt
slots:
  default:
    - component: f7-page
      config:
        style:
          z-index: 0
          --f7-navbar-height: 0px
          --f7-navbar-font-size: 0px
          --f7-navbar-bg-color: white
          --f7-navbar-border-color: white
          --f7-navbar-link-color: black
          --f7-navbar-text-color: black
      slots:
<SNIP>

Full YAML as follows: Power Usage.txt (5.9 KB)

Any suggestions on how to correct this?

EDIT: Replaced GIF

Thanks
Mark

I would file an issue, since it seems to be caused by the unerlying framework and not directly by your page configuration.

1 Like

Thank you.

Submitted as: