No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    left-drawer pushes the existing screen to the right instead of moving on top

    Help
    1
    3
    1158
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • M
      MusicForMellons last edited by

      I have a map and had a working quasar v0.13 leftside drawer which would work fine. Now I changed to quasar v0.14.2 using this code from the docs:

      <q-scroll-area slot="left" style="width: 100%; height: 100%">
        <q-list-header>Left Panel</q-list-header>
        <q-side-link item to="/showcase/layout/play-with-layout">
          <q-item-side icon="account circle" />
          <q-item-main label="Play with Layout" sublabel="Learn more about it" />
          <q-item-side right icon="thumb_up" />
        </q-side-link>
        <q-side-link item to="/showcase/layout/drawer-panels">
          <q-item-side icon="view_array" />
          <q-item-main label="Drawer Panels" sublabel="Layout left/right sides" />
        </q-side-link>
        <q-side-link item to="/showcase/layout/fixed-positioning">
          <q-item-side icon="pin_drop" />
          <q-item-main label="Fixed Positioning" sublabel="...on a Layout" />
        </q-side-link>
        <q-side-link item to="/showcase/layout/floating-action-button">
          <q-item-side icon="play_for_work" />
          <q-item-main label="Floating Action Button" sublabel="For Page actions" />
        </q-side-link>
      
        <div v-if="layoutStore.leftScroll" style="padding: 25px 16px 16px;">
          <p class="caption" v-for="n in 50">
            <em>Left Panel has intended scroll</em>
          </p>
        </div>
      </q-scroll-area>
      

      and the drawer moves my existing screen estate instead of moving on top. Any idea what’s wrong?

      1 Reply Last reply Reply Quote 0
      • M
        MusicForMellons last edited by MusicForMellons

        Just now I noticed that drawer moves on top in mobile mode and not when in desktop mode. I also found out that this is actually the case for the documentation example, so apparently this “desired behavior”. In my case it is not though, so is this something you can toggle off somehow, in the way that it always moves on top?

        1 Reply Last reply Reply Quote 0
        • M
          MusicForMellons last edited by

          Ah… it is in the documentation (gloops):
          http://quasar-framework.org/components/layout.html#Vue-Properties

          Used this and everything is working brilliantly:
          <q-layout ref=“layout” :left-breakpoint=0>

          1 Reply Last reply Reply Quote 0
          • First post
            Last post