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
    1. Home
    2. yo
    Y
    • Profile
    • Following 0
    • Followers 0
    • Topics 3
    • Posts 17
    • Best 1
    • Groups 0

    yo

    @yo

    1
    Reputation
    6
    Profile views
    17
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    yo Follow

    Best posts made by yo

    • RE: VsCode configuration to be compatible with prettier and eslint(Solved)

      @wolfiton you have put “standard” instead of “prettier”

      prettier doc

      ps :
      eslintrc.js

      module.exports = {
        ...
        extends: [
          "standard", // replace by prettier
        ]
        ...
      ]
      
      posted in Help
      Y
      yo

    Latest posts made by yo

    • RE: Full-height in maximized dialog doesn't fit the page properly [Solved]

      I have found the problem in 5 minutes (after posting)
      “Tourner 7 fois sa langue dans sa bouche avant de parler” 🙄 😅

      I had just to add a <div class=“column full-height”> directly under my q-card :

      <!--
        Forked from:
        https://quasar.dev/vue-components/dialog#Example--Maximized
      -->
      <div id="q-app">
        <div class="q-pa-md q-gutter-sm">
          <q-btn label="Maximized" color="primary" @click="dialog = true"></q-btn>
      
          <q-dialog
            v-model="dialog"
            persistent
            :maximized="maximizedToggle"
            transition-show="slide-up"
            transition-hide="slide-down"
          >
            <q-card class="bg-primary text-black full-height">
              <div class="column full-height">
                <q-bar>
                  <q-space ></q-space>
      
                  <q-btn dense flat icon="minimize" @click="maximizedToggle = false" :disable="!maximizedToggle">
                    <q-tooltip v-if="maximizedToggle" content-class="bg-white text-primary">Minimize</q-tooltip>
                  </q-btn>
                  <q-btn dense flat icon="crop_square" @click="maximizedToggle = true" :disable="maximizedToggle">
                    <q-tooltip v-if="!maximizedToggle" content-class="bg-white text-primary">Maximize</q-tooltip>
                  </q-btn>
                  <q-btn dense flat icon="close" v-close-popup>
                    <q-tooltip content-class="bg-white text-primary">Close</q-tooltip>
                  </q-btn>
                </q-bar>
      
                <q-card-section class="col bg-white full-height">
                  <div class="column full-height">
                    <h2>Super Title</h2>
                    <q-scroll-area
                      class="col"
                      visible
                    >
                      <p v-for="index in 21" :key="index">
                        Lorem ipsum dolor sit amet consectetur adipisicing elit. Rerum repellendus sit voluptate voluptas eveniet porro. Rerum blanditiis perferendis totam, ea at omnis vel numquam exercitationem aut, natus minima, porro labore.
                      </p>
                    </q-scroll-area>
                  </div>
                </div>
              </q-card-section>
            </q-card>
          </q-dialog>
        </div>
      </div>
      
      posted in Help
      Y
      yo
    • Full-height in maximized dialog doesn't fit the page properly [Solved]

      I want to put a full-height scroll-area inside a maximized dialog (including a q-card), but the the full-height doesn’t consider the size of the top bar and creates another scroll.

      Is this a bug or am I doing something wrong ?

      I made a Codepen to show my problem but I don’t have the pro version, so just replace the HTML of the Example–Maximized’s Codepen.

      <!--
        Forked from:
        https://quasar.dev/vue-components/dialog#Example--Maximized
      -->
      <div id="q-app">
        <div class="q-pa-md q-gutter-sm">
          <q-btn label="Maximized" color="primary" @click="dialog = true"></q-btn>
      
          <q-dialog
            v-model="dialog"
            persistent
            :maximized="maximizedToggle"
            transition-show="slide-up"
            transition-hide="slide-down"
          >
            <q-card class="bg-primary text-black">
              <q-bar>
                <q-space ></q-space>
      
                <q-btn dense flat icon="minimize" @click="maximizedToggle = false" :disable="!maximizedToggle">
                  <q-tooltip v-if="maximizedToggle" content-class="bg-white text-primary">Minimize</q-tooltip>
                </q-btn>
                <q-btn dense flat icon="crop_square" @click="maximizedToggle = true" :disable="maximizedToggle">
                  <q-tooltip v-if="!maximizedToggle" content-class="bg-white text-primary">Maximize</q-tooltip>
                </q-btn>
                <q-btn dense flat icon="close" v-close-popup>
                  <q-tooltip content-class="bg-white text-primary">Close</q-tooltip>
                </q-btn>
              </q-bar>
      
              <q-card-section class="col bg-white full-height">
                <div class="column full-height">
                  <h2>Super Title</h2>
                  <q-scroll-area
                    class="col"
                    visible
                  >
                    <p v-for="index in 21" :key="index">
                      Lorem ipsum dolor sit amet consectetur adipisicing elit. Rerum repellendus sit voluptate voluptas eveniet porro. Rerum blanditiis perferendis totam, ea at omnis vel numquam exercitationem aut, natus minima, porro labore.
                    </p>
                  </q-scroll-area>
                </div>
              </q-card-section>
            </q-card>
          </q-dialog>
        </div>
      </div>
      
      posted in Help
      Y
      yo
    • RE: q-Tree auto-scroll to last node

      @studio511 you’re welcome 😉

      posted in Help
      Y
      yo
    • RE: q-Tree auto-scroll to last node

      If you don’t want to use a scroll area you can do a dom search to get the scroll area inside your page, then you add a ref argument called ‘myScroll’ (if doesn’t exist yet), then do this after adding a new tree element (if the scroll exist) :

      this.$refs.myScroll.setScrollPosition(999999)
      

      Maybe it won’t work cause ref depending on Vue, then use a common Dom id to get the element.

      But I don’t think dom manipulation works for mobile (maybe I’m wrong)

      posted in Help
      Y
      yo
    • RE: QTable mobile style

      @RobbeV what about using a table inside virtual scroll ? It could solve the desktop problem, but change the mobile style.

      posted in Help
      Y
      yo
    • RE: q-Tree auto-scroll to last node

      @studio511 yeah I think using observers is the right way to do it !

      Can you post your code of the dynamic q-tree replaced by dynamic lorem ipsum ?

      Ps : after thinking 30 seconds, observer is an observer so no you can’t do it with it.

      I have found the property scroll-target of the q-virtual-scroll.
      Maybe you could dynamically create and id to the last html element and del the last one when you create a new tree element. Then scroll-target to it.
      Or simply create an empty div/span with end id, but maybe it could create weird display.
      Or you could using the last element of a class you created for it.

      There’s also Scroll position

      When I’ll be on my computer, I’ll try few stuff, that’s if you can share me the code it will be cool !

      posted in Help
      Y
      yo
    • q-scroll-area with <pre> tag

      Hello,

      I have an issue with a q-scroll-area containing <pre>data…</pre>, the behavior that I expect would be to automatically create an horizontal scroll bar when the text overflow in x.

      Should I use the css’s property overflow-x: scroll ?
      Is there an option in the q-scroll-area component that would allow this behavior ?

      I have already tried horizontal option for q-scroll-area, but it remove the vertical scroll bar ; it is still possible to scroll with the mouse, but it is really painful for really long text to go directly on a desired scroll position.

      <q-scroll-area visible>
          <div id="source-code">
              <pre>
                  <p>
                      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Orci ac auctor augue mauris augue neque gravida. Odio facilisis mauris sit amet massa vitae tortor condimentum. Ornare suspendisse sed nisi lacus. Fames ac turpis egestas maecenas pharetra convallis posuere. Adipiscing bibendum est ultricies integer quis. Commodo nulla facilisi nullam vehicula ipsum a arcu. Interdum varius sit amet mattis vulputate enim. Ac tincidunt vitae semper quis lectus nulla at volutpat. Enim blandit volutpat maecenas volutpat. Sed enim ut sem viverra aliquet eget sit. Bibendum neque egestas congue quisque egestas diam in arcu cursus. Velit ut tortor pretium viverra suspendisse.
                  </p>
              </pre>
              <p>
                        Eget est lorem ipsum dolor. Sed ullamcorper morbi tincidunt ornare massa eget egestas. Purus in mollis nunc sed id semper. Id aliquet risus feugiat in ante metus dictum at. Quis ipsum suspendisse ultrices gravida dictum fusce ut placerat. Sed viverra ipsum nunc aliquet. Aliquam faucibus purus in massa tempor. Venenatis urna cursus eget nunc scelerisque viverra mauris in aliquam. Nisi scelerisque eu ultrices vitae auctor. Euismod nisi porta lorem mollis aliquam ut porttitor. Faucibus turpis in eu mi. Lectus quam id leo in vitae turpis.
              </p>
          </div>
      </q-scroll-area>
      
      posted in Help
      Y
      yo
    • RE: Flexbox and q-scroll-area's height

      @tof06 thx, apparently I’m blind ><

      posted in Help
      Y
      yo
    • RE: VsCode configuration to be compatible with prettier and eslint(Solved)

      @wolfiton 😉

      posted in Help
      Y
      yo
    • RE: Get err when to create a new quasar project.

      @JackyLee nice to know, je vais me coucher moins bête 🙂
      1000:1000
      UID:GID
      1000 usually the first user/group
      stackoverflow

      posted in CLI
      Y
      yo