F7-searchbar hiding on mobile

Questions
1

Not sure, if I am doing something wrong here, but:

I just create a F7-project using F7 UI (Vue, Tabbed View) (see below for the init)
The only change I make is to add a searchbar to the navbar (see below)
Now if I click/tab on ‘About’,

  • desktop: the searchbar is hidden (as expected)
  • mobile: the searchbar stays visible (but it shows aria-hidden=false)

Or is this a bug?

Any hint?

thx
Andy

      <f7-page name="home">
        <!-- Top Navbar -->
        <f7-navbar large :sliding="false">
            <f7-searchbar
                    :clear-button="true"
                    :disable-button="false"
                    placeholder="Search"
                ></f7-searchbar>
          <f7-nav-left>
            <f7-link icon-ios="f7:menu" icon-aurora="f7:menu" icon-md="material:menu" panel-open="left"></f7-link>
          </f7-nav-left>
          <f7-nav-title sliding>Tabview</f7-nav-title>
          <f7-nav-right>
            <f7-link icon-ios="f7:menu" icon-aurora="f7:menu" icon-md="material:menu" panel-open="right"></f7-link>
          </f7-nav-right>
          <f7-nav-title-large>Tabview</f7-nav-title-large>
        </f7-navbar>

        <!-- Page content-->
       </f7-page>

Framework7 app created with following options:

    {
      "cwd": "/Users/andy/dev-git/F7/f7vite_tabview",
      "type": [
        "web"
      ],
      "name": "Tabview",
      "framework": "vue",
      "template": "tabs",
      "bundler": "vite",
      "cssPreProcessor": false,
      "theming": {
        "customColor": false,
        "color": "#007aff",
        "darkTheme": false,
        "iconFonts": true,
        "fillBars": false
      },
      "customBuild": false
    }
2

Layout is kinda wrong, if you put Searchbar in Navbar, and if it is not expandable, it should be added in the end of the Navbar and wrapped with Subnavbar (Searchbar Vue Component | Framework7 Vue Documentation):

<f7-navbar large :sliding="false">
  <f7-nav-left>
    <f7-link
      icon-ios="f7:menu"
      icon-aurora="f7:menu"
      icon-md="material:menu"
      panel-open="left"
    ></f7-link>
  </f7-nav-left>
  <f7-nav-title sliding>My App</f7-nav-title>
  <f7-nav-right>
    <f7-link
      icon-ios="f7:menu"
      icon-aurora="f7:menu"
      icon-md="material:menu"
      panel-open="right"
    ></f7-link>
  </f7-nav-right>
  <f7-nav-title-large>My App</f7-nav-title-large>

  <f7-subnavbar :inner="false">
    <f7-searchbar
        :clear-button="true"
        :disable-button="false"
        placeholder="Search"
    ></f7-searchbar>
  </f7-subnavbar>
</f7-navbar>
3

Thanks for the hint, but honestly, I liked it, when the searchbar is at the top (instead of a sub-navbar) and then just hides on the linked page (‘About’).

Since the aria-hidden flag is already added properly in this case, would it be possible to add this as a new feature?