Multi line label in Dashboard 2.0 Button?

Dashboard
1

Is it possible to have multi line text in a dashboard 2.0 Button widget? I tried \n and <br/> but was not surprised when neither did the job.

1 Like
2

Good old CSS override.
For button add class:
image

And make an ui_template for CSS overrides:

image
image645Ă—639 24.9 KB

And if you fall into such situations and you don't like it:
image

you can add also text-wrap: pretty;

So it tries to wrap more natural way.
image

3 Likes
3

Magic (well CSS actually, but near enough).

Thanks.

4

@joepavitt should this be the default for buttons so that if there is not room on the button for the text then it folds rather than flowing out the ends of the button and even into adjacent widgets.

image

I see that if necessary the button will grow in height if the label name will still not fit in

image

5

This styling is (currently) entirely driven by Vuetify, as we're using the Vuetify Button Widget. Happy to look into overrides on the styling though.

Also open to PRs too - happy to go with @hotNipi's styling here as the default.

6

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.