There are no notes for this item.
<ul class="breadcrumb">
<li class="breadcrumb__item breadcrumb__item--hierarchical">
<a href="#" class="link">Thing1</a>
</li>
<li class="breadcrumb__item breadcrumb__item--hierarchical breadcrumb__item--selected">
<a href="#" class="link">Thing2</a>
</li>
<li class="breadcrumb__item breadcrumb__item--hierarchical">
<a href="#" class="link">Thing3</a>
</li>
</ul>
/*------------------------------------*\
#BREADCRUMB HIERARCHICAL
\*------------------------------------*/
.breadcrumb {
list-style: none;
margin: 0;
padding: 0;
height: 16px;
}
.breadcrumb__item {
display: inline-block;
padding: 0 5px 0 11px;
position: relative;
}
.breadcrumb__item + .breadcrumb__item:before {
display: block;
position: absolute;
left: 0;
}
.breadcrumb__item--hierarchical + .breadcrumb__item--hierarchical:before {
content: "/";
top: 0;
}
.breadcrumb__item .link {
text-decoration: none;
}
.breadcrumb__item--selected .link {
color: $color-active;
}