Breadcrumb
The breadcrumbs navbar displays the path to the current page relative to the starting point.
<div class="occlss-breadcrumb ">
<div class="occlss-layout occlss-layout--gutter-s"><!--START layout block-->
<div class="occlss-layout__col occlss-layout__col--12">
<nav role="navigation" aria-labelledby="system-breadcrumb">
<span id="system-breadcrumb" class="occlss-u-visuallyhidden">Breadcrumb</span>
<ol class="occlss-breadcrumb__container">
<li class="occlss-breadcrumb__item">
<a href="javascript:void(0);" class="occlss-breadcrumb__link">Home</a>
</li>
<li class="occlss-breadcrumb__item">
<a href="javascript:void(0);" class="occlss-breadcrumb__link">Residents</a>
</li>
<li class="occlss-breadcrumb__item">
<a href="javascript:void(0);" class="occlss-breadcrumb__link">Adult social care</a>
</li>
<li class="occlss-breadcrumb__item" aria-current="page">
Daytime support
</li>
</ol>
</nav>
</div>
</div>
</div>
Why we use this component
Breadcrumbs provide a way for users to see where they are in a hierarchical structure as well as navigate back the way they came.
Changelog
1.0.0
- Component added