Carousel Item

draft

Code

HTML

import { NbhdCarouselItem } from '@fbin-web/neighborhood-core';

<nbhd-carousel-item>
  <nbhd-flex surface="secondary">
    <nbhd-text tag="h2" variant="title">Slide 1</nbhd-text>
    <nbhd-text tag="p">This is the first slide.</nbhd-text>
    <nbhd-link href="go-to-this-link-1" aria-label="Learn more about Slide 1">Learn More</nbhd-link>
  </nbhd-flex>
</nbhd-carousel-item>

React

import { NbhdCarouselItem, NbhdFlex, NbhdText, NbhdLink } from '@fbin-web/neighborhood-react';

const App = () => (
  <>
    <NbhdCarouselItem>
      <NbhdFlex surface="secondary">
        <NbhdText
          tag="h2"
          variant="title">
          Slide 1
        </NbhdText>
        <NbhdText tag="p">This is the first slide.</NbhdText>
        <NbhdLink
          href="go-to-this-link-1"
          ariaLabel="Learn more about Slide 1">
          Learn More
        </NbhdLink>
      </NbhdFlex>
    </NbhdCarouselItem>
  </>
);

Slots