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

    Button icons size can not be altered

    Help
    3
    7
    3345
    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

      The docs seem to indicate that when you use custom size (or use one of the default sizes) for a button the icon size adjusts accordingly. See docs and this picture:0_1525267339890_Screenshot from 2018-05-02 15-18-29.png

      However when I use e.g. this button:
      <q-btn
      v-if="$route.name === ‘home’"
      class=“absolute-top-left”
      flat
      round
      wait-for-ripple
      dense
      size=“160px”
      color=“primary”
      icon=“close”
      @click.native=“goToSignIn”
      />
      The button indeed grows but icon stays same size. Same for other size values. I thought it might relate to using mdi icons, but when I use the default material icons I get same behavior. What’s wrong/ what am I doing wrong?

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

        See this for a solution and whether that’s how it should be done…:
        https://github.com/quasarframework/quasar/issues/2033

        1 Reply Last reply Reply Quote 0
        • L
          Lou Rectoret last edited by

          @MusicForMellons did u find the answer?

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

            @lou-rectoret you can test it on these examples, https://quasar.dev/vue-components/button#Example--Button-size. giving it a px size will also enlarge the icon. like what razvan said in the 2+ year old ticket, the user might had a conflicting css or wasn’t using a correct version.

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

              If I remember properly I think it was related to the version I was using. Should work!

              1 Reply Last reply Reply Quote 0
              • L
                Lou Rectoret last edited by Lou Rectoret

                This post is deleted!
                1 Reply Last reply Reply Quote 0
                • L
                  Lou Rectoret last edited by

                  Shit… I’ve just realized, there’s an inconsistency:
                  For average q-btn is size, but for q-btn with fab property is padding…

                  @metalsadman I think this could mislead other as it happened to me. I recommend you to consider this improvement

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