in src/app/ContosoTraders.Ui.Website/src/components/slider/slider.tsx [11:58]
export default function Slider(props) {
var items = [
{
name: "The Fastest, Most Powerful Xbox Ever.",
description: "Elevate your game with the all-new Xbox Wireless Controller - Lunar Shift Special Edition",
page: 1
},
{
name: "The Fastest, Most Powerful Xbox Ever.",
description: "Elevate your game with the all-new Xbox Wireless Controller - Lunar Shift Special Edition",
page: 2
},
]
return (
<div className='slider-section'>
<div className='topSection'>
<div className="LapHeadSection">
<div className="LapHead">{props.firstHeading}</div>
<p className="LapHeadmain">{props.secondHeading}</p>
</div>
<div className='LapButtonSection'>
<button className='outlined-primary-btn'>See All</button>
</div>
</div>
<Carousel
className='product-slider-corousel'
navButtonsAlwaysVisible={true} autoPlay={false} indicators={false} animation='slide'
navButtonsWrapperProps={{
style:{
top: '-70px',
}
}}
navButtonsProps={{
style: {
border: '1px solid #C4C4C4',
background: 'rgba(255, 255, 255, 0.5)',
color: '#000'
}
}}
>
{
items.map((item, i) => <Item key={i} item={item} {...props} />)
}
</Carousel>
</div>
)
}