Card

Example

<Bs::Card as |card|>
  <svg
    class="bd-placeholder-img card-img-top"
    width="100%"
    height="180"
    xmlns="http://www.w3.org/2000/svg"
    role="img"
    aria-label="Placeholder: Image cap"
    preserveAspectRatio="xMidYMid slice"
    focusable="false"
  ><title>Placeholder</title><rect
      width="100%"
      height="100%"
      fill="#868e96"
    ></rect><text x="50%" y="50%" fill="#dee2e6" dy=".3em">Image cap</text></svg>
  <card.body>
    <h5 class="card-title">Card title</h5>
    <p class="card-text">Some quick example text to build on the card title
      and make up the bulk of the card's content.</p>
    <Bs::Button @color="primary">Go somewhere</Bs::Button>
  </card.body>
</Bs::Card>

<Bs::Card as |card|>
  <card.body>
    <h5 class="card-title">Card title</h5>
    <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
    <p class="card-text">Some quick example text to build on the card title
      and make up the bulk of the card's content.</p>
    <a href="#" class="card-link">Card link</a>
    <a href="#" class="card-link">Another link</a>
  </card.body>
</Bs::Card>

<Bs::Card as |card|>
  <card.header @title="Card title" />
  <card.body>
    <p class="card-text">Some quick example text to build on the card title
      and make up the bulk of the card"s content.</p>
    <Bs::Button @color="primary">Go somewhere</Bs::Button>
  </card.body>
</Bs::Card>