Trust bar
Use to convey 3rd party endorsements.
Description
This component displays a set of logos of 3rd party companies or organisations that have endorsed or recommended Funding Circle.
It displays a different number of logos depending on the screen size. There shouldn't be more than max 6 "trust-bar__item" elements. Any more will be hidden. Each item may link to an article or blog post on the 3rd party organisation's website.
It has a transparent background as it may sit in a section with a background colour that should show through.
Activate Sass component
In order to have the styling of this component available, you need to include it in your project. After including the
Radius library in your main
./index.scss file, add this snippet:
@include radius-component-trust-bar;Usage
Usage example
Code example
<section class="trust-bar">
<div class="trust-bar__inner">
<div class="trust-bar__content">
<div class="trust-bar__item">
<a href="http://www.economist.com/">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/economist_logo.svg" alt="Logo for The Economist" />
</a>
</div>
<div class="trust-bar__item">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/telegraph_logo.svg" alt="Logo for The Telegraph" />
</div>
<div class="trust-bar__item">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/bbc_news_logo.svg" alt="Logo for BBC News" />
</div>
<div class="trust-bar__item">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/guardian_logo.svg" alt="Logo for The Guardian" />
</div>
<div class="trust-bar__item">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/ft_logo.svg" alt="Logo for The Financial Times" />
</div>
<div class="trust-bar__item">
<img src="https://dgnvhpcjbd3ba.cloudfront.net/radius/15.3.16/press/city_am_logo.svg" alt="Logo for City AM" />
</div>
</div>
</div>
</section>