<article class="Job-card">
<div class="Job-card__content flow--2xs">
<h2 class="text-red small">
We're hiring
</h2>
<h3 class="h h-6">
Business Relationship Manager
</h3>
<div class="body small text-grey">
<p>Help target and nurture relationships with potential clients</p>
</div>
<p class="eyebrow eyebrow--black eyebrow--meta">
<span>£35k - £45k</span>
</p>
</div>
<a class="combo-button focus combo-button--green combo-button--large-link combo-button--vh" href="#">
<span class="vh">Business Relationship Manager</span>
<div>
<svg role="img" aria-hidden="true" focusable="false" class="Icon Icon--arrow-right Icon--s">
<use xlink:href="/v6-assets/img/icons/sprite.svg?cachebust=2#arrow-right"></use>
</svg>
</div>
</a>
</article>
{% set hasMeta = meta is defined and (meta|length) %}
{% set hasDescription = description is defined and description %}
<article class="Job-card">
<div class="Job-card__content flow--2xs">
<h2 class="text-red small">
We're hiring
</h2>
<h3 class="h h-6">
{{ title }}
</h3>
{% if hasDescription %}
<div class="body small text-grey">
{{ description|raw }}
</div>
{% endif %}
{% if hasMeta %}
<p class="eyebrow eyebrow--black eyebrow--meta">
{% for item in meta %}
{% if item %}
<span>{{ item }}</span>
{% endif %}
{% endfor %}
</p>
{% endif %}
</div>
{% include '@combo-button' with {
text: title,
link: link,
theme: 'green',
largeLink: true,
hideText: true
} %}
</article>
{
"title": "Business Relationship Manager",
"description": "<p>Help target and nurture relationships with potential clients</p>",
"meta": [
"£35k - £45k"
],
"link": "#"
}
.Job-card {
background: var(--light-grey-step-1);
display: flex;
flex-direction: column;
position: relative;
&__content {
padding: var(--space-s) var(--space-s);
}
.combo-button {
margin-left: auto;
margin-top: auto;
}
}
No notes defined.