Skip to content

Commit abe07b5

Browse files
committed
Fixes(gilbitron#176) - Fix Tailwind pagination when RTL
1 parent d570dd7 commit abe07b5

File tree

1 file changed

+5
-5
lines changed

1 file changed

+5
-5
lines changed

src/TailwindPagination.vue

+5-5
Original file line numberDiff line numberDiff line change
@@ -8,20 +8,20 @@
88
>
99
<nav
1010
v-bind="$attrs"
11-
class="isolate inline-flex -space-x-px rounded-md shadow-sm"
11+
class="inline-flex -space-x-px rounded-md shadow-sm isolate ltr:flex-row rtl:flex-row-reverse"
1212
aria-label="Pagination"
1313
v-if="slotProps.computed.total > slotProps.computed.perPage"
1414
>
1515
<button
16-
class="relative inline-flex items-center rounded-l-md border px-2 py-2 text-sm font-medium focus:z-20 disabled:opacity-50"
16+
class="relative inline-flex items-center px-2 py-2 text-sm font-medium border rounded-l-md focus:z-20 disabled:opacity-50"
1717
:class="itemClasses"
1818
:disabled="!slotProps.computed.prevPageUrl"
1919
v-on="slotProps.prevButtonEvents"
2020
>
2121
<slot name="prev-nav">
2222
<span class="sr-only">Previous</span>
2323
<svg
24-
class="h-5 w-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
24+
class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
2525
stroke-width="1.5" stroke="currentColor"
2626
>
2727
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5L8.25 12l7.5-7.5"/>
@@ -30,7 +30,7 @@
3030
</button>
3131

3232
<button
33-
class="relative inline-flex items-center border px-4 py-2 text-sm font-medium focus:z-20"
33+
class="relative inline-flex items-center px-4 py-2 text-sm font-medium border focus:z-20"
3434
:class="[
3535
page == slotProps.computed.currentPage ? activeClasses : itemClasses,
3636
page == slotProps.computed.currentPage ? 'z-30' : '',
@@ -45,7 +45,7 @@
4545
</button>
4646

4747
<button
48-
class="relative inline-flex items-center rounded-r-md border px-2 py-2 text-sm font-medium focus:z-20 disabled:opacity-50"
48+
class="relative inline-flex items-center px-2 py-2 text-sm font-medium border rounded-r-md focus:z-20 disabled:opacity-50"
4949
:class="itemClasses"
5050
:disabled="!slotProps.computed.nextPageUrl"
5151
v-on="slotProps.nextButtonEvents"

0 commit comments

Comments
 (0)