Namysh
Opinion CSS vs JS breakpoint for switching style
Using Nuxt UI, on a small device I want to show a smaller button version than on a bigger one.
There is no way of changing the size directly with the UButton props so I have two solutions :
- creating two buttons then toggling their visibility with CSS breakpoint
- switching size reactively with a JS breakpoint
Here is a reproduction link with the two solutions working :
https://stackblitz.com/edit/github-zt3rnq-jbvjyx?file=app.vue
The JS version is cooler but isn't it too much to use JS for that ? I mean it involve using the reactivity engine over the CSS engine it may be less performant
1 replies