layout header and then page header?

conx

Hei!
I need two headers - in main layout header with toolbar and then after main header page header with toolbar.
Or how make page toolbar sticky?

Sweetyy

Hi @conx ,

Did you already check this ?

In your main <q-layout> you can set for example :view="'lHh Lpr lff'" to put your header sticky.

conx

Yes, main header is sticky, but page header not ordered after main header. I need page toolbar to sticky…

Sweetyy

What about that :

<q-layout view="hHr LpR lFf">
  <!-- Header -->
  <q-layout-header>
    <!-- First row of header is a QToolbar -->
    <q-toolbar>
      <!-- showLeft is a model attached to left side drawer below -->
      <q-btn
        flat round dense
        @click="showLeft = !showLeft"
        icon="menu"
      />

      <q-toolbar-title>
        Layout Header
        <span slot="subtitle">Optional subtitle</span>
      </q-toolbar-title>

      <!-- showRight is a model attached to right side drawer below -->
      <q-btn
        flat round dense
        @click="showRight = !showRight"
        icon="menu"
      />
    </q-toolbar>

    <!-- Second row of header is a QTabs -->
    <q-tabs>
      <q-route-tab slot="title" icon="view_quilt" to="/test-layout/about" replace hide="icon" label="About" />
      <q-route-tab slot="title" icon="view_day" to="/test-layout/toolbar" replace hide="icon" label="Toolbar" />
      <q-route-tab slot="title" icon="view_day" to="/test-layout/tabs" replace label="Tabs" />
      <q-route-tab slot="title" icon="input" to="/test-layout/drawer" replace label="Drawer" />
    </q-tabs>
  </q-layout-header>

  <!-- sub-routes get injected here: -->
  <q-page-container>
    <router-view />
  </q-page-container>
</q-layout>

Coming from http://quasar-framework.org/components/layout.html#Basic-Usage

conx

hmm no, i have different pages with unique headers/toolbars and i want them sticky after main header… (sorry my engl)