Ability to wrap table in .table-responsive

[cosmin]

Sometimes the tables being displayed are too large to fit in a single screen and need to be scrolled horizontally. Luckily boostrap makes this easy by wrapping the table itself in a <div class="table-responsive">, however there is no easy way to accomplish this using vue-tables. Wrapping the entire component in .table-responsive makes the pagination controls and footer also scroll which is undesirable.

Thoughts on adding this by default to the template? Or perhaps adding an option to accomplish this?

[matfish2]

The skin option allows you to add any classes to the table itself, but I gather the class needs to applied to a wrapper. I will consider adding one.
Meanwhile, you might wanna check out the columnsDisplay options which allows for hiding certain columns depending on the screen size.

[cosmin]

skin is where I started, but yes, it needs to be added to a wrapper. I did look at columnsDisplay but that doesn't help my current situation because I can't hide any columns, I need to display them all and allow the user to scroll. For example, imagine a web frontend for viewing a database schema complete with browsing the data in tables. The tables can be arbitrarily wide, and hiding columns would not be an option.

I'd volunteer a patch but I'm relatively new to vue and I'm not sure I could do this in an idiomatic fashion. But I can give it a shot if it would help.

[matfish2]

I have added a wrapper and a new wrapperClasses option.
Pull the latest version (1.4.62) from npm and you should be good to go.

[cosmin]

That worked great. Thanks!