feat(Carousel): implement component (#2288)

This commit is contained in:
Benjamin Canac
2024-10-08 17:12:43 +02:00
committed by GitHub
parent 69a6e11c52
commit 68ee3f11ca
43 changed files with 1553 additions and 27 deletions

View File

@@ -0,0 +1,25 @@
<script setup lang="ts">
const items = [
'https://picsum.photos/528/528?random=1',
'https://picsum.photos/528/528?random=2',
'https://picsum.photos/528/528?random=3',
'https://picsum.photos/528/528?random=4',
'https://picsum.photos/528/528?random=5',
'https://picsum.photos/528/528?random=6'
]
</script>
<template>
<UCarousel
v-slot="{ item }"
class-names
arrows
:items="items"
:ui="{
item: 'basis-[70%] transition-opacity [&:not(.is-snapped)]:opacity-10'
}"
class="mx-auto max-w-sm"
>
<img :src="item" width="264" height="264" class="rounded-lg">
</UCarousel>
</template>