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

    Adding a FAB over a component

    Framework
    2
    3
    138
    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.
    • T
      tdumitr last edited by

      What I am looking to do is to have a FAB floating over a component, rather than a whole page.

      I looked at QFab and at QPageSticky and both set a button floating over a QPage. I want to add a FAB floating over a QList. The list may not cover the entire page. As an example, the list could be the left side of a QSplitter. The FAB should move left and right as the splitter expands and contracts the list, and it should always stay within the list’s area. I have a CodePen at https://codepen.io/downloadovici/pen/povbQeW, where I tried a QFab, but it does not do what I want. The QFab is in the bottom-right corner of the QPage, rather than on the bottom-right corner of the QList.

      Is there a way to have the QFab floating over the list?

      metalsadman 1 Reply Last reply Reply Quote 0
      • metalsadman
        metalsadman @tdumitr last edited by metalsadman

        @tdumitr from content https://quasar.dev/layout/page-sticky#Usage

        WARNING

        • In order for QPageSticky to work, it must be placed within a QLayout component.

        • QPageSticky must be the last child element within it’s parent, so it can display on top of other

        using your codepen: https://codepen.io/metalsadman/pen/QWwEPKB

        1 Reply Last reply Reply Quote 0
        • T
          tdumitr last edited by

          Awesome. Thank you. It does make sense, now that you pointed it out.

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