Skip to content

Commit

Permalink
feat: add Swift Content Card (#779)
Browse files Browse the repository at this point in the history
* convert to md

* added swift card content card

* update bullet points

Co-authored-by: Gil <43111519+gldgrnt@users.noreply.github.com>
  • Loading branch information
houbly and gldgrnt committed May 14, 2021
1 parent 175a7db commit 8110283
Show file tree
Hide file tree
Showing 5 changed files with 335 additions and 207 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions src/wmnds/components/content-card/_content-card.scss
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down
31 changes: 31 additions & 0 deletions src/wmnds/patterns/content-cards/swift-card/_swift-card.njk
Original file line number Diff line number Diff line change
@@ -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 %}
207 changes: 0 additions & 207 deletions src/www/pages/patterns/content-cards/index.njk

This file was deleted.

Loading

0 comments on commit 8110283

Please sign in to comment.