<ol class="flex flex-row vertical-padding-small" itemscope itemtype="https://schema.org/BreadcrumbList">
  {% for key, breadcrumb in breadcumbs %}
    {% if breadcrumb.text %}
    <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem" class="flex flex-row middle-xs text-small text-uppercase">
      {% if breadcrumb.separator %}
        <i class="fas fa-angle-right horizontal-margin-small text-gray" aria-hidden="true"></i>
      {% endif %}
      <a itemprop="item" href="{{breadcrumb.href}}" class="link-default vertical-padding-x-small">
        <span itemprop="name">{{breadcrumb.text}}</span>
      </a>
      <meta itemprop="position" content="{{key + 1}}" />
    </li>
    {% endif %}
  {% endfor %}
</ol>