lokyoung/vuejs-paginate

Broken when using Bootstrap 4

Closed this issue · 3 comments

Functions ok but the UI is gone

Never mind it's just a matter of filling in more classes in the properties. They were defaulting before, now you're required to fill in class for li's and a's

Hi! I have the same problem, can you show me the changes you've made?

Make sure you include these v-bind props in your tag, this is what I forgot about --
:container-class="'pagination pagination-sm'"
:page-class="'page-item'" :prev-class="'page-item'" :next-class="'page-item'"
:page-link-class="'page-link'" :prev-link-class="'page-link'" :next-link-class="'page-link'"

I overrode a couple of the bootstrap css to make it cleaner looking at least to me --
.pagination
{
margin: 0;
}

.page-link
{
font-size: 12px !important;
}

.page-item.active .page-link
{
background-color: #387BCA;
border-color: #387BCA;
}