Overview
The logo list component displays a list of logos. These are usually logos of organisations that use the MYOB product or service featured on the page. There is a minimum of 3 and a maximum of 5 images required to display the list. Each logo list consists of an optional heading and call-to-action.
Examples
Default variation
<ul class="logo-list mb-1">
<li class="logo-list__item mb-1 mb-2--lg">
<a href="#" target="__blank"><img class="logo-list__logo" src="http://placehold.it/175x40.jpg" data-interchange="[http://placehold.it/175x40.png]" alt="" data-myob-image></a>
</li>
<li class="logo-list__item mb-1 mb-2--lg">
<a href="#" target="__blank"><img class="logo-list__logo" src="http://placehold.it/155x50.jpg" data-interchange="[http://placehold.it/155x50.png]" alt="" data-myob-image></a>
</li>
<li class="logo-list__item mb-1 mb-2--lg">
<a href="#" target="__blank"><img class="logo-list__logo" src="http://placehold.it/200x30.jpg" data-interchange="[http://placehold.it/200x30.png]" alt="" data-myob-image></a>
</li>
<li class="logo-list__item mb-1 mb-2--lg">
<a href="#" target="__blank"><img class="logo-list__logo" src="http://placehold.it/130x40.jpg" data-interchange="[http://placehold.it/130x40.png]" alt="" data-myob-image></a>
</li>
<li class="logo-list__item mb-1 mb-2--lg">
<a href="#" target="__blank"><img class="logo-list__logo" src="http://placehold.it/100x25.jpg" data-interchange="[http://placehold.it/100x25.png]"alt="" data-myob-image></a>
</li>
</ul>Usage guidelines
| Dos | Don'ts |
|---|---|
 Do try to use logo images that are suitably sized, so as to avoid alignment issues.
|
 Don't exceed a maximum file size of 20Kb.
|
|
Don't use this component to display anything other than brand logo images.
|
|
|
Don't place within a container smaller than the full page width.
|
Implementation guidelines
We're so sorry, there are currently no implementation guidelines for this component 😥
If you feel you can help out your fellow designers by creating implementation guidelines for this component, please reach out to @marquee on the #astridd Slack channel.