mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
f37b043138
Co-authored-by: Michał Hanusek <m.hanusek@myfreak.pl> Co-authored-by: Inesh Bose <dev@inesh.xyz> Co-authored-by: Benjamin Canac <canacb1@gmail.com>
39 lines
888 B
Vue
39 lines
888 B
Vue
<script setup lang="ts">
|
|
const items = [
|
|
'https://picsum.photos/600/800?random=1',
|
|
'https://picsum.photos/600/800?random=2',
|
|
'https://picsum.photos/600/800?random=3',
|
|
'https://picsum.photos/600/800?random=4',
|
|
'https://picsum.photos/600/800?random=5',
|
|
'https://picsum.photos/600/800?random=6'
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<UCarousel
|
|
:items="items"
|
|
:ui="{
|
|
item: 'basis-full',
|
|
container: 'rounded-lg'
|
|
}"
|
|
arrows
|
|
class="w-64 mx-auto"
|
|
>
|
|
<template #default="{ item }">
|
|
<img :src="item" class="w-full">
|
|
</template>
|
|
|
|
<template #prev="{ onClick, disabled }">
|
|
<button :disabled="disabled" @click="onClick">
|
|
Prev
|
|
</button>
|
|
</template>
|
|
|
|
<template #next="{ onClick, disabled }">
|
|
<button :disabled="disabled" class="" @click="onClick">
|
|
Next
|
|
</button>
|
|
</template>
|
|
</UCarousel>
|
|
</template>
|