Small Fact Card: Two Cards 

<div data-module="factCardSmall" class="fact-cards-small">
    <div class="grid-x fact-cards-small__title spacer-xs">
        <h4>Transfer times to city centre</h4>
    </div>
    <div class="fact-cards-small__list grid-x grid-margin-x">
        <div class="fact-card-small medium-auto cell">
            <div class="fact-card-small__inner">
                <div class="fact-card-small__icon" style="background-image:url(/media/icons/purple/bus.svg);"></div>
                <div class="fact-card-small__caption">40 minutes bus drive</div>
            </div>
        </div>
        <div class="fact-card-small medium-auto cell">
            <div class="fact-card-small__inner">
                <div class="fact-card-small__icon" style="background-image:url(/media/icons/purple/car.svg);"></div>
                <div class="fact-card-small__caption">29 minutes tax drive</div>
            </div>
        </div>
    </div>
</div>
 
<div data-module="factCardSmall" class="fact-cards-small{{#if dynamic}} fact-cards-small--dynamic{{/if}}">
    {{#if title}}
    <div class="grid-x fact-cards-small__title spacer-xs">
        <h4>{{title}}</h4>
    </div>
    {{/if}}
    <div class="fact-cards-small__list grid-x grid-margin-x">
        {{#each cards}}
            <div class="fact-card-small medium-auto cell">
                <div class="fact-card-small__inner">
                    {{#if iconUrl}} <div class="fact-card-small__icon" style="background-image:url({{iconUrl}});"></div>{{/if}}
                    {{#if description}}<div class="fact-card-small__caption">{{description}}</div>{{/if}}
                </div>
            </div>
        {{/each}}
    </div>
</div>
 
{
  "title": "Transfer times to city centre",
  "cards": [
    {
      "iconUrl": "/media/icons/purple/bus.svg",
      "description": "40 minutes bus drive"
    },
    {
      "iconUrl": "/media/icons/purple/car.svg",
      "description": "29 minutes tax drive"
    }
  ]
}

There are no notes for this item.