Function Example

stories/examples/Card/Backgrounds.js:5–28

(props)

import { colors } from '../options';

function Example(props) {
  return (
    <>
      {colors.map((color) => (
        <Card
          inverse={color !== 'light'}
          color={color}
          key={color}
          className="my-2"
          style={{ width: '18rem' }}
        >
          <CardHeader>Header</CardHeader>
          <CardBody>
            <CardTitle tag="h5">Special Title Treatment</CardTitle>
            <CardText>
              With supporting text below as a natural lead-in to additional
              content.
            </CardText>
          </CardBody>
        </Card>
      ))}
    </>
  );
}

export default Example;