recently I was working on an app using Vuetify and had trouble to change the Vuetify default colors. So I finally ended with this:
https://github.com/vuetifyjs/vuetify/issues/299
Which as its says, I added the following code:
<style lang="stylus">
@require '../node_modules/vuetify/src/stylus/settings/_colors.styl'
$theme := {
primary: #009688
accent: #FFC107
secondary: #00796B
info: #B2DFDB
warning: $red.base
error: $red.base
success: $green.base
}
@require '../node_modules/vuetify/src/stylus/main.styl'
</style>
In App.vue
So when I tested changing colors in the app, it worked as expected, so far so good. Then I noticed that it changed the size of the icons, as pictured below:
So, my question is:
Is there a way to solve this problem by not using CSS? If so, how? Or if there's no way, then, how should I solve it using CSS?