diff --git a/src/ssr-carousel-dots.vue b/src/ssr-carousel-dots.vue index 745d1ef..bc6afc6 100644 --- a/src/ssr-carousel-dots.vue +++ b/src/ssr-carousel-dots.vue @@ -5,7 +5,7 @@ .ssr-carousel-dots button.ssr-carousel-dot-button( v-for='i in pages' :key='i' - :aria-label='`Go to ${pageLabel} ${i}`' + :aria-label='makeLabel(i)' :aria-disabled='isDisabled(i)' @click='$emit("goto", i - 1)') @@ -29,9 +29,15 @@ export default boundedIndex: Number pages: Number pageLabel: String + rtl: Boolean methods: + # Make the label for the dot + makeLabel: (index) -> + pageNumber = if @rtl then @pages - index + 1 else @index + "Go to #{@pageLabel} #{pageNumber}" + # Check if dot index shuold be disabled isDisabled: (index) -> @boundedIndex == index - 1 diff --git a/src/ssr-carousel.vue b/src/ssr-carousel.vue index 0f48e6d..55c181b 100644 --- a/src/ssr-carousel.vue +++ b/src/ssr-carousel.vue @@ -62,7 +62,7 @@ //- Dots navigation ssr-carousel-dots( v-if='showDots' - v-bind='{ boundedIndex, pages, pageLabel }' + v-bind='{ boundedIndex, pages, pageLabel, rtl }' @goto='gotoDot') template(#dot='props'): slot(name='dot' v-bind='props')