EUAA Design System

Breadcrumbs

The breadcrumb component indicates the page location within a navigational hierarchy.

<ul class="euaa-breadcrumb u-pad-m">
    <li class="euaa-breadcrumb__item">Home</li>
</ul>
<ul class="easo-breadcrumb u-pad-m">
    <li class="euaa-breadcrumb__item">Home</li>
    <li class="euaa-breadcrumb__item">Styles</li>
    <li class="euaa-breadcrumb__item euaa-breadcrumb__item--current">Colours</li>
</ul>

For arrow separators add the class euaa-breadcrumb--arrow

<ul class="euaa-breadcrumb euaa-breadcrumb--arrow u-pad-m">
    <li class="euaa-breadcrumb__item">Home</li>
    <li class="euaa-breadcrumb__item">Styles</li>
    <li class="euaa-breadcrumb__item euaa-breadcrumb__item--current">Colours</li>
</ul>