Michael Winter
711b5b93c2
- Clean all JSON data files: convert MongoDB format to clean JSON - works.json, images.json, publications.json, pubs.json, talks.json - releases.json, album_art.json, scores.json, my_image_gallery.json - events.json (with legacy program → program transformation) - resume.json (simplified structure) - Simplify all API routes (remove cleanData functions) - Fix PDF links to open in new tab (scores, writings, albums) - Upgrade to Nuxt 4.3.1 and fix carousel (nuxt-swiper) - Replace nuxt-icon with @nuxt/icon - Fix IconButton component for new tab links - Update cv.vue for resume data structure changes - Add icon collections (@iconify-json packages)
39 lines
1.1 KiB
Vue
39 lines
1.1 KiB
Vue
<template>
|
|
<Swiper
|
|
:autoHeight="true"
|
|
:loop="true"
|
|
:spaceBetween="30"
|
|
:centeredSlides="true"
|
|
:autoplay="{
|
|
delay: 4000,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: true
|
|
}"
|
|
:pagination="{
|
|
clickable: true,
|
|
}"
|
|
:navigation="true"
|
|
:style="{
|
|
'--swiper-navigation-color': 'rgb(71 85 105)',
|
|
'--swiper-pagination-color': 'rgb(71 85 105)',
|
|
'--swiper-pagination-bottom': 'auto',
|
|
'--swiper-pagination-top': '1rem',
|
|
'--swiper-navigation-top-offset': '5rem'
|
|
}"
|
|
:modules="[SwiperAutoplay, SwiperPagination, SwiperNavigation]"
|
|
class="h-full flex items-center justify-center"
|
|
>
|
|
|
|
<SwiperSlide v-for="image in gallery" class="!flex !items-center !justify-center !h-auto !py-10 !bg-zinc-100">
|
|
<img :src="'/' + bucket + '/' + image.image"
|
|
style="max-width: calc(100% - 80px); max-height: 70vh; object-fit: contain;"/>
|
|
</SwiperSlide>
|
|
</Swiper>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: ['gallery', 'bucket']
|
|
}
|
|
</script>
|