Vue-carousel: Feature Request: allow pagination and navigation elements to be styled

[robbiemu]

right now _from the parent component_, you can style the outer .VueCarousel-navigation and .VueCarousel-pagination, but not the elements:

• .VueCarousel-navigation-button
• .VueCarousel-dot

If necessary we can pass in a style like:<carousel :navigationStyle="styleObject"..., but an even better one would be to ensure the inner elements are exposed to styling from the scope of the parent component. I think a careful use of slots in the outer components might resolve this issue.

[arjanski]

I would also be very interested in styling the navigation buttons, so +1 !

Could you elaborate on the workaround using :navigationStyle? I didn't find the prop in the API. What exactly would you pass if you were to style the color of the navigation buttons for instance? Or did I understand you wrong?

Thank you in advance everyone

[fogil]

These elements are just HTML dom elements with classes attached. If you want to style them do something like this SCSS snippet:

.VueCarousel {
.VueCarousel-navigation-button {
color: skyblue;
}

}

It's just CSS. You can even manually position them anywhere you want. Or resize them, or do anything you want with them.