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

    Changing the default breakpoints

    Framework
    2
    3
    1236
    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
      tonyskulk last edited by tonyskulk

      Re: Layout breakpoints (media queries)

      I have seen this old thread about changing the breakpoints. According to the current quasar version. How is it done?

      In my app in my main layout there is a header designed like this:

      <q-header class="gt-xs">
      

      And a footer like this:

      <q-footer class="xs">
      

      This works fine, but I tried to set the breaking point to a custom px size. So I added this into my /css/app.sass:

      $breakpoint-xs : 768px
      

      Unfortunately nothing changes and the default breakpoints seem to be untouched. Do I have to do anything more?

      1 Reply Last reply Reply Quote 0
      • s.molinari
        s.molinari last edited by

        https://quasar.dev/style/sass-scss-variables#Customizing

        You need to put your breakpoint overrides in src/css/quasar.variables.sass.

        Scott

        1 Reply Last reply Reply Quote 1
        • T
          tonyskulk last edited by

          Thanks, it worked.

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