feat: add Swift Content Card

src/wmnds/components/content-card/_content-card.scss

@@ -46,6 +46,16 @@
     }
   }
 
+  &__content {
+    @media (max-width: $breakpoint-sm - 1) {
+      margin-top: $size-md;
+    }
+
+    & > *:last-child {
+      margin-bottom: 0;
+    }
+  }
+
   &__image {
     width: 100%;
     object-fit: cover;

src/wmnds/patterns/content-cards/swift-card/_swift-card.njk

@@ -0,0 +1,31 @@
+{% macro wmndsContentCardSwiftCard(params) %}
+{# imports #}
+{% from "wmnds/components/content-card/_content-card.njk" import wmndsContentCard %}
+{# Set #}
+{% set title = params.title if params.title else "How to get Swift pay as you go" %}
+{% set content = params.content %}
+{% set img = params.img if params.img else "/img/component-images/content-cards/swift-card.png"%}
+{# Set up nav links #}
+
+{% call wmndsContentCard() %}
+    <nav class="wmnds-p-sm">
+        <h2 class="wmnds-content-card__title">{{title}}</h2>
+        <div class="wmnds-grid wmnds-grid--spacing-md-2-md">
+            <div class="wmnds-col-1 wmnds-col-md-1-3">
+                <img src="{{img}}" alt="">
+            </div>
+            <div class="wmnds-content-card__content wmnds-col-1 wmnds-col-md-2-3">
+                {% if content %}
+                    {{content}}
+                {% else %}
+                    <ul>
+                        <li>You can <a href="#">order a pay as you go Swift card online</a> and we will send you one within 7 days.</li>
+                        <li>If you need a Swift card more quickly, you can go to a <a href="#">travel centre</a>, <a href="#">Payzone store</a> or <a href="#">kiosk</a> and buy it in person.</li>
+                    </ul>
+                {% endif %}
+            </div>
+        </div>
+    </nav>
+{% endcall %}
+
+{% endmacro %}