@fy-/fws-vue 2.2.78 → 2.2.80
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ui/DefaultPaging.vue +15 -15
- package/package.json +1 -1
|
@@ -158,21 +158,21 @@ onMounted(() => {
|
|
|
158
158
|
>
|
|
159
159
|
<div class="paging-container">
|
|
160
160
|
<nav aria-label="Pagination" :aria-describedby="showLegend ? `pagination-info-${id}` : undefined">
|
|
161
|
-
<ul class="flex items-center
|
|
161
|
+
<ul class="flex items-center h-8 text-sm" role="list">
|
|
162
162
|
<li v-if="items.page_no >= 2">
|
|
163
163
|
<button
|
|
164
164
|
type="button"
|
|
165
|
-
class="flex items-center justify-center px-
|
|
165
|
+
class="flex items-center justify-center px-1.5 h-8 pt-0.5 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors rounded-l-md"
|
|
166
166
|
aria-label="Previous page"
|
|
167
167
|
@click="prev()"
|
|
168
168
|
>
|
|
169
169
|
<span class="sr-only">{{ $t("previous_paging") }}</span>
|
|
170
|
-
<ChevronLeftIcon class="w-
|
|
170
|
+
<ChevronLeftIcon class="w-3.5 h-3.5" aria-hidden="true" />
|
|
171
171
|
</button>
|
|
172
172
|
</li>
|
|
173
173
|
<li v-if="items.page_no - 2 > 1">
|
|
174
174
|
<router-link
|
|
175
|
-
class="flex items-center justify-center
|
|
175
|
+
class="flex items-center justify-center w-7 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors"
|
|
176
176
|
:to="page(1)"
|
|
177
177
|
aria-label="Go to page 1"
|
|
178
178
|
>
|
|
@@ -181,9 +181,9 @@ onMounted(() => {
|
|
|
181
181
|
</li>
|
|
182
182
|
<li v-if="items.page_no - 2 > 2" aria-hidden="true">
|
|
183
183
|
<div
|
|
184
|
-
class="flex items-center justify-center
|
|
184
|
+
class="flex items-center justify-center w-4 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300"
|
|
185
185
|
>
|
|
186
|
-
<span class="
|
|
186
|
+
<span class="text-[8px]">...</span>
|
|
187
187
|
</div>
|
|
188
188
|
</li>
|
|
189
189
|
<template v-for="i in 2">
|
|
@@ -192,7 +192,7 @@ onMounted(() => {
|
|
|
192
192
|
:key="`page-${items.page_no - (3 - i)}`"
|
|
193
193
|
>
|
|
194
194
|
<router-link
|
|
195
|
-
class="flex items-center justify-center
|
|
195
|
+
class="flex items-center justify-center w-7 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors"
|
|
196
196
|
:to="page(items.page_no - (3 - i))"
|
|
197
197
|
:aria-label="`Go to page ${items.page_no - (3 - i)}`"
|
|
198
198
|
>
|
|
@@ -203,7 +203,7 @@ onMounted(() => {
|
|
|
203
203
|
<li>
|
|
204
204
|
<div
|
|
205
205
|
aria-current="page"
|
|
206
|
-
class="z-10 flex items-center justify-center
|
|
206
|
+
class="z-10 flex items-center justify-center w-7 h-8 leading-tight text-white border border-primary-500 bg-primary-500 font-medium dark:border-primary-600 dark:bg-primary-600"
|
|
207
207
|
:aria-label="`Current page, page ${items.page_no}`"
|
|
208
208
|
>
|
|
209
209
|
{{ items.page_no }}
|
|
@@ -215,7 +215,7 @@ onMounted(() => {
|
|
|
215
215
|
:key="`page-x-${items.page_no + i}`"
|
|
216
216
|
>
|
|
217
217
|
<router-link
|
|
218
|
-
class="flex items-center justify-center
|
|
218
|
+
class="flex items-center justify-center w-7 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors"
|
|
219
219
|
:to="page(items.page_no + i)"
|
|
220
220
|
:aria-label="`Go to page ${items.page_no + i}`"
|
|
221
221
|
>
|
|
@@ -225,14 +225,14 @@ onMounted(() => {
|
|
|
225
225
|
</template>
|
|
226
226
|
<li v-if="items.page_no + 2 < items.page_max - 1" aria-hidden="true">
|
|
227
227
|
<div
|
|
228
|
-
class="flex items-center justify-center
|
|
228
|
+
class="flex items-center justify-center w-6 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300"
|
|
229
229
|
>
|
|
230
|
-
<span class="
|
|
230
|
+
<span class="text-[8px]">...</span>
|
|
231
231
|
</div>
|
|
232
232
|
</li>
|
|
233
233
|
<li v-if="items.page_no + 2 < items.page_max">
|
|
234
234
|
<router-link
|
|
235
|
-
class="flex items-center justify-center
|
|
235
|
+
class="flex items-center justify-center w-7 h-8 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors"
|
|
236
236
|
:to="page(items.page_max)"
|
|
237
237
|
:aria-label="`Go to page ${items.page_max}`"
|
|
238
238
|
>
|
|
@@ -242,12 +242,12 @@ onMounted(() => {
|
|
|
242
242
|
<li v-if="items.page_no < items.page_max">
|
|
243
243
|
<button
|
|
244
244
|
type="button"
|
|
245
|
-
class="flex items-center justify-center px-
|
|
245
|
+
class="flex items-center justify-center px-1.5 h-8 pt-0.5 leading-tight text-fv-neutral-600 bg-white border border-fv-neutral-300 hover:bg-fv-neutral-100 hover:text-fv-neutral-800 focus:ring-1 focus:ring-primary-400 focus:outline-none focus:z-10 dark:bg-fv-neutral-800 dark:border-fv-neutral-700 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700 dark:hover:text-white dark:focus:ring-primary-500 transition-colors rounded-r-md"
|
|
246
246
|
aria-label="Next page"
|
|
247
247
|
@click="next()"
|
|
248
248
|
>
|
|
249
249
|
<span class="sr-only">{{ $t("next_paging") }}</span>
|
|
250
|
-
<ChevronRightIcon class="w-
|
|
250
|
+
<ChevronRightIcon class="w-3.5 h-3.5" aria-hidden="true" />
|
|
251
251
|
</button>
|
|
252
252
|
</li>
|
|
253
253
|
</ul>
|
|
@@ -255,7 +255,7 @@ onMounted(() => {
|
|
|
255
255
|
<p
|
|
256
256
|
v-if="showLegend"
|
|
257
257
|
:id="`pagination-info-${id}`"
|
|
258
|
-
class="text-xs text-fv-neutral-700 dark:text-fv-neutral-300 pt-1
|
|
258
|
+
class="text-xs text-fv-neutral-700 dark:text-fv-neutral-300 pt-1 text-center"
|
|
259
259
|
>
|
|
260
260
|
{{
|
|
261
261
|
$t("global_paging", {
|