what2watch/scss/plugins/card
Joe Ardent 826c21b4df vendor in picnic scss lib 2023-09-21 17:43:18 -07:00
..
_class.scss vendor in picnic scss lib 2023-09-21 17:43:18 -07:00
_plugin.scss vendor in picnic scss lib 2023-09-21 17:43:18 -07:00
info.json vendor in picnic scss lib 2023-09-21 17:43:18 -07:00
readme.md vendor in picnic scss lib 2023-09-21 17:43:18 -07:00
test.html vendor in picnic scss lib 2023-09-21 17:43:18 -07:00

readme.md

Card

A card is a self-contained, replicable type. It works great with other of its kind. It can consist of only one element or many of them:

<article class="card">
  <header>
    <h3>A really simple h3</h3>
  </header>
</article>
<article class="card">
  <header>
    <button>Love</button>
    <button class="dangerous">Hate</button>
  </header>
</article>
<article class="card">
  <header>
    <h3>Forest</h3>
  </header>
  <footer>
    <button>Like</button>
  </footer>
</article>
<div class="flex two">
  <div>
    <article class="card">
      <img src="/img/forest.jpg">
      <footer>
        <h3>Misty Forest</h3>
        <button>Like</button>
      </footer>
    </article>
  </div>
  <div>
    <article class="card">
      <img src="/img/forest.jpg">
      <footer>
        <h3>Misty Forest</h3>
        <button>Like</button>
      </footer>
    </article>
  </div>
</div>