Button icons size can not be altered
-
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:
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? -
See this for a solution and whether that’s how it should be done…:
https://github.com/quasarframework/quasar/issues/2033 -
@MusicForMellons did u find the answer?
-
@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.
-
If I remember properly I think it was related to the version I was using. Should work!
-
This post is deleted! -
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
