Dynamic setting of element classes based on Buefy breakpoints

Question

So I've been using Buefy as the UI library for this new project, and I have a Vuetify background.

What I want to achieve using Buefy is:

<div
  :class="{
    'ml-2': (condition to apply the class to mobile breakpoint)
  }"
>
...

In Vuetify I will write the following code:

<div
  :class="{
    'ml-2': $vuetify.breakpoint.mobile,
  }"
>
...

Is there an equivalent solution in Buefy?

Answer 1

I checked Buefy's documentation and it doesn't seem to have a breakpoint feature.

You can do this manually yourself by creating a plugin, or just add the following to your component:

sssccc