Skip to main content

Carousel

This is a pass through component from React-Bootstrap.

See React-Bootstrap for documentation.

Basic Usage​

<Carousel>
  <Carousel.Item>
    <img
      className="d-block w-100"
      src="https://picsum.photos/1600/800/"
      alt="First slide"
    />
    <Carousel.Caption>
      <h3>First slide label</h3>
      <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
    </Carousel.Caption>
  </Carousel.Item>
  <Carousel.Item>
    <img
      className="d-block w-100"
      src="https://picsum.photos/1600/800/"
      alt="Third slide"
    />

    <Carousel.Caption>
      <h3>Second slide label</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    </Carousel.Caption>
  </Carousel.Item>
  <Carousel.Item>
    <img
      className="d-block w-100"
      src="https://picsum.photos/1600/800/"
      alt="Third slide"
    />

    <Carousel.Caption>
      <h3>Third slide label</h3>
      <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
    </Carousel.Caption>
  </Carousel.Item>
</Carousel>

Dependencies​

RepositoryUsage Count
frontend-app-dashboard1

Detailed usage locations:​

frontend-app-dashboard

  • src/components/CarouselContainer.jsx