IntraCDL UI

Card 

<!-- Default -->
<section class="c-card">
    <a class="c-card__figure" href="">
        <h2>Unbranded Metal Computer</h2>
        <div class="c-card__image">
            <img src="https://picsum.photos/seed/8jbYQw/640/480" alt="Nature scene">
        </div>
    </a>
    <div class="c-card__caption">
        <p>Trepide utroque vapulus vinco solitudo undique. Spectaculum supra animi culpo fugit. Dens titulus conturbo dedico vinco amoveo molestias subvenio uberrime socius.</p>
    </div>
    <a class="c-card__link-2" href="">Sleek Granite Bacon</a>
</section>


<!-- 2 -->
<section class="c-card">
    <a class="c-card__figure" href="">
        <h2>Electronic Steel Sausages</h2>
        <div class="c-card__image">
            <img src="https://picsum.photos/seed/gvPkCHirR/640/480" alt="Nature scene">
        </div>
        <div class="c-card__link-1">
            Logo Guidelines
        </div>
    </a>
    <a class="c-card__link-2" href="">Download ZIP (EPS, PNG, SVG)</a>
</section>


<section class="c-card">
  <a class="c-card__figure" href="">
    <h2>{{ card.title }}</h2>
    <div class="c-card__image">
      <img src="{{ card.image }}" alt="Nature scene">
    </div>
    {{#unless card.caption}}
    <div class="c-card__link-1">
      {{ card.link1 }}
    </div>
    {{/unless}}
  </a>
  {{#unless card.link1}}
  <div class="c-card__caption">
    <p>{{ card.caption }}</p>
  </div>
  {{/unless}}
  <a class="c-card__link-2" href="">{{ card.link2 }}</a>
</section>
 
/* Default */
{
  "card": {
    "title": "Unbranded Metal Computer",
    "image": "https://picsum.photos/seed/8jbYQw/640/480",
    "link1": "",
    "caption": "Trepide utroque vapulus vinco solitudo undique. Spectaculum supra animi culpo fugit. Dens titulus conturbo dedico vinco amoveo molestias subvenio uberrime socius.",
    "link2": "Sleek Granite Bacon"
  }
}


/* 2 */
{
  "card": {
    "title": "Electronic Steel Sausages",
    "image": "https://picsum.photos/seed/gvPkCHirR/640/480",
    "link1": "Logo Guidelines",
    "caption": "",
    "link2": "Download ZIP (EPS, PNG, SVG)"
  }
}

No notes defined.