Menu

Campaign - Petrol

<aside class="mp c-campaign c-campaign--petrol">
<a href="" class="c-campaign__link">OmniTrust: Analytics you can trust.</a>
<figure class="c-campaign__image">
<img src="/static/img/campaign.jpg" alt="alt" />
</figure>
<div class="c-campaign__content u-flow">
<h2 class="c-h c-h--step-2">OmniTrust: Analytics you can trust.</h2>
<div class="mp o-prose u-flow--prose">
<p>At last, a compliance breakthrough: Omnitrust joins up all your instruments and platforms, authorizes users, keeps all your data audit-ready – and is completely configurable to your workflow.</p>
<span class="mp c-twi u-link c-twi--left" ><span>Find out more</span>
<svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">
<use xlink:href="/static/svg/sprite.svg#arrow-right"></use>
</svg>
</span>
</div>
</div>
</aside>
{
"title": "OmniTrust: Analytics you can trust.",
"content": "<p>At last, a compliance breakthrough: Omnitrust joins up all your instruments and platforms, authorizes users, keeps all your data audit-ready – and is completely configurable to your workflow.</p>",
"linkLabel": "Find out more",
"link": "",
"image": {
"src": "/static/img/campaign.jpg",
"alt": "alt"
},
"classes": "c-campaign--petrol"
}

Color options

In the CMS for the main website (Tridion), users can select from four color options for a campaign component. This is implemented with utility classes in HTML, and is therefore not documented here.

Props

Name Type Description
title string
content html
link string
linkLabel string Label for the button
image object Image object

CSS modifiers

Name Type Description
c-campaign--switch Switches the image from left to right