vue-paginate icon indicating copy to clipboard operation
vue-paginate copied to clipboard

Paginate-Links :classes attribute

Open tmacintosh opened this issue 7 years ago • 6 comments

I'm trying to use font-awesome icons for the next and prev links using the following setup on the pagination-links element: :async="true" :limit="10" :hide-single-page="true" :show-step-links="true" :step-links="{ next: '', prev: ' ' }" :classes="{'li.left-arrow > a' : ['fa', 'fa-chevron-left'], 'li.right-arrow > a' : ['fa', 'fa-chevron-right']}"

The issues I get are:

  • the classes specified are getting applied to the ".ellipses" class if the ellipses link is clicked.

  • if the step-links have the same value, the .left-arrow>a classes gets applied to the .right-arrow>a element.

tmacintosh avatar Sep 02 '17 03:09 tmacintosh

I am having the same problem.

bmounteer avatar Jun 21 '18 21:06 bmounteer

Same problem here anyone can help?

Maadtin avatar Jul 25 '18 09:07 Maadtin

I'm having this issue too, .left-arrow/.right-arrow classes not working properly (applying to each other, applying to ellipses). Seems like there's quite a few problems in the library and it doesn't seem to be maintained, might have to switch or make my own.

lukeramsden avatar Oct 16 '18 10:10 lukeramsden

@lukeramsden I ended up just forking the repository and modifying the code so it showed the icons I wanted.

bmounteer avatar Oct 16 '18 14:10 bmounteer

I found a work around to this issue (though it's super jank). If you label one of the buttons ' ' and the other '' (space in one no text in the other), the labels will end up having the correct classes.

I'm assuming that the connection of classes to each anchor tag depends on the text of the anchor tag. Therefore, differentiating them by having different strings solves the issue (tho this is just a guess)

Try this for the step-links binding: :step-links="{ next: '', prev: ' ' }"

Sartin-mbible avatar Oct 16 '19 16:10 Sartin-mbible

same problem... I'm guessing this plugin is no longer being supported by the developer? (no response since 2017??)

eybarta avatar Dec 06 '20 13:12 eybarta