.o-slider.o-testimonial
.slick-slider.o-slider__slider(
ref="slider"
data-module="slickjs",
:data-module-options="JSON.stringify(returnSlickOptions())"
)
//@slot Each element placed here will be a slide
slot
.slick-slide.relative.o-slider__slide.w-full(
v-for="item in items"
:key="`slide${item.id}`"
:ref="`slide${item.id}`"
)
.o-testimonial__background.relative.w-full.h-0.bg-contain.bg-no-repeat.w-full(
:style="returnStyleObj(item.bgImgSrc)"
)
.o-testimonial__content.absolute.flex.flex-col.justify-between.top-0.w-full.h-full.p-10.text-white
.o-testimonial__quote.relative.top-0.w-full
p.o-testimonial__quote__text.text-3xxl {{ item.quote }}
a(href="item.link").text-white.font-700.hover-text-white {{ item.linkText }}
//@slot Each element placed here will be a slide
slot
Icon(name="chevron-right24", path="/spritemap.svg")
.o-testimonial__footer
p.o-testimonial__name {{ item.name }}
p.o-testimonial__details {{ item.details }}
p.o-testimonial__company {{ item.companyDetails }}
```jsx
const arr = [
{
id: 0,
quote: 'Lorem ipsum dolor sit amet consectetur adipiscing elit, nulla maximus neque.',
link: '#',
linkText: 'Learn more',
bgImgSrc: 'https://unsplash.it/1000/660',
name: 'John Smith',
details: 'Senior marketing manager',
companyDetails: 'Webcoda, Sydney NSW'
},
{
id: 1,
quote: 'Lorem ipsum dolor sit amet consectetur adipiscing elit, nulla maximus neque.',
link: '#',
linkText: 'Learn more',
bgImgSrc: 'https://unsplash.it/1000/660',
name: 'John Wayne',
details: 'Senior gunslinger',
companyDetails: 'Webcoda, Sydney NSW'
}
]
```