export default function Slider()

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>
    )
}