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

    drawer backdrop style

    Framework
    2
    9
    1308
    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.
    • matroskin
      matroskin last edited by

      How to set drawer’s backdrop bgcolor?

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

        @matroskin said in drawer backdrop style:

        How to set drawer’s backdrop bgcolor?

        use content-class or content-style props ie. content-class="bg-red-1"

        1 Reply Last reply Reply Quote 0
        • matroskin
          matroskin last edited by

          That’s the drawer bg color, where the items there are. I need to set color of behind the drawer

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

            dunno what tou mean by backdrop but you can see that props here setting the bg of the drawer https://quasar.dev/layout/drawer#Basic pls check the docs, examples, api cards etc.

            1 Reply Last reply Reply Quote 0
            • matroskin
              matroskin last edited by matroskin

              <div class="fullscreen q-drawer__backdrop" ... >
              

              I mean
              it has

              background-color: rgba(0, 0, 0, 0.4);
              

              property by default

              this color: https://prnt.sc/ott0it

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

                Its just css, you can override it.

                1 Reply Last reply Reply Quote 0
                • matroskin
                  matroskin last edited by

                  I cannot use css in this case
                  .q-drawer__backdrop has no different attributes or classes when it is active/inactive
                  When it is active - framework apply background-color: rgba(0, 0, 0, 0.4); dinamically…

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

                    @matroskin yes you can, i’m no expert in css but just googling for a bit got me a solution https://codepen.io/metalsadman/pen/LYPZJXm. no idea why you want to change it though, the current backdrop is pretty standard afaik.

                    1 Reply Last reply Reply Quote 0
                    • matroskin
                      matroskin last edited by

                      thanks, I’ll use your variant )

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