Creation of the initial cards component

exampleSite/data/en/cards.yml

+style: vertical
+items:
+  - heading: Test card
+    content: Esse incididunt ipsum nulla consectetur tempor elit. Mollit adipisicing esse labore consectetur irure ut reprehenderit sit. Quis do cupidatat qui quis nostrud laboris nulla incididunt laborum sit sit qui id cupidatat.
+    links:
+      - url: "#"
+        text: Download now
+        alt: Link to a the PDF document for X
+        style: button
+      - url: "#"
+        text: Or don't
+        alt: Link to a form to do Y
+        style: text
\ No newline at end of file

layouts/shortcodes/cards.html

+
+<!-- Allow for alt sources and languages -->
+{{ $source := .Get "source" | default "cards" }}
+{{ $languageBase := index .Site.Data .Site.Language.Lang }}
+<!-- Get the base of the testimonials by checking existence in localized section -->
+{{ $base := index .Site.Data $source}}
+{{ if and (ne $languageBase nil) (isset $languageBase $source)  }} 
+  {{ $base = index $languageBase $source }}
+{{ end }}
+
+
+{{ $containerClass := .Get "containerClass" | default "col-xs-24 col-sm-8" }}
+{{ $useMatchHeight := .Get "useMatchHeight" | default "false" }}
+{{ $cardStyle := .Get "" | default $base.style | default "vertical" }}
+
+<div class="row">
+  {{ range $base.items }}
+  {{ if .fullCardLink }}
+  <a href="">
+  {{ end }}
+  <div class="card-container{{ with $containerClass }} {{ . }}{{ end }}{{ if $useMatchHeight }} match-height-item-by-row{{ end }}">
+    {{ $glyphSet := false }}
+    {{ if or (isset . "glyph") (isset . "glyphSrc") }}
+    {{ $glyphSet = true }}
+    <div class="glyph-highlight">
+      <div class="glyph-container">
+        {{ if .glyph }}
+        <i class="fa {{ .glyph }}"></i>
+        {{ else }}
+        <img class="img margin-auto" src="{{ .glyphSrc }}" />
+        {{ end }}
+      </div>
+      <div class="glyph-bottom"></div>
+    </div>
+    {{ end }}
+    <div class="card-panel panel panel-default{{ if $glyphSet }} with-glyph{{ end }}{{ if $cardStyle "horizontal" }} horizontal-card{{ end }}{{ with .class }} {{ . }}{{ end }}">
+      {{ if isset . "img" }}
+      <div class="panel-heading" aria-hidden="true">
+        <img class="img {{ .imgClass | default "img-responsive margin-auto" }}" src="{{ .imgSrc }}" alt="{{ .imgAlt }}"/>
+      </div>
+      {{ end }}
+      <div class="panel-body">
+        {{ with .heading }}
+        <h3 class="fw-700{{ with .headingClass }} {{ . }}{{ end }}">{{ . }}</h3>
+        {{ end }}
+        <p>{{ .content }}</p>
+      </div>
+      {{ if and (isset . "links") (len .links) }}
+      <div class="panel-footer text-center">
+        {{ range .links }} 
+        <a class="{{ if eq .style "button" }}btn {{ .linkClass | default "btn-primary" }}{{ else if eq .style "text" }}{{ .linkClass | default "brand-primary" }}{{ end }}" 
+            href="{{ .url }}"{{ with .title }} title="{{ . }}"{{ end }}>
+          {{ .text }}
+        </a>
+        {{ end }}
+      </div>
+      {{ end }}
+    </div>
+  </div>
+  {{ }}
+  </a>
+  {{ end }}
+  {{ end }}
+</div>