Breadcrumb

Used to indicate where the user is in the structure of a page.

Breadcrumb 

<!-- breadcrumb.blade.php -->
<nav id="61efb2417ba2d" class="c-breadcrumb" aria-label="Breadcrumb" data-uid="61efb2417ba28">
  <ol class="c-breadcrumb__list unlist">
     
      <li data-level="1" class="c-breadcrumb__item c-breadcrumb__item_0 c-breadcrumb__item_depth-1">
        
                  <!-- icon.blade.php -->
    <i id="61efb2417bae7" class="c-icon c-icon--size-inherit material-icons" translate="no" role="img" alt="" data-uid="61efb2417bad5">
                    bookmark
            </i>
          
         
          <a class="c-breadcrumb__link" href="https://hbgworks.helsingborg.se">
            <span class="c-breadcrumb__label">
               Main page
            </span>
          </a>
        
      </li>
     
      <li data-level="1" class="c-breadcrumb__item c-breadcrumb__item_1 c-breadcrumb__item_depth-1">
        
                  <!-- icon.blade.php -->
    <i id="61efb2417bb47" class="c-icon c-icon--size-inherit material-icons" translate="no" role="img" alt="" data-uid="61efb2417bb43">
                    chevron_right
            </i>
          
         
          <a class="c-breadcrumb__link" href="https://hbgworks.helsingborg.se">
            <span class="c-breadcrumb__label">
               Sub page
            </span>
          </a>
        
      </li>
     
      <li data-level="1" class="c-breadcrumb__item c-breadcrumb__item_2 c-breadcrumb__item_depth-1">
        
                  <!-- icon.blade.php -->
    <i id="61efb2417bb98" class="c-icon c-icon--size-inherit material-icons" translate="no" role="img" alt="" data-uid="61efb2417bb95">
                    chevron_right
            </i>
          
         
          <span class="c-breadcrumb__label" aria-current="page">
            Sub sub page
          </span>
        
      </li>
      </ol>
</nav>
@breadcrumb(
    [
        'list' => [
            ['href' => 'https://hbgworks.helsingborg.se', 'label' => 'Main page'],
            ['href' => 'https://hbgworks.helsingborg.se', 'label' => 'Sub page'],
            ['href' => 'https://hbgworks.helsingborg.se', 'label' => 'Sub sub page'],
        ]
    ]
)
@endbreadcrumb

Blade component parameters

Key Default value Type Available values Description
list [] array - -
label Breadcrumb string - -
componentElement nav string - -
listType ol string - -
listItemType li string - -
id string - The DOM id of the component.
classList [] array - Array containing wrapping classes array
attributeList [] array - Array containing keys and values rendered as attributes
containerAware false boolean true/false Makes the component container aware. Appends modifiers --size--xs/sm/md/lg to the component.
Settings location: /mnt/persist/www/docroot_styleguide_v2/source/library/source/php/Component/Breadcrumb/breadcrumb.json