<div class="row">
  <div
    class="content-header-left col-md-6 col-12 mb-2 breadcrumb-new"
    *ngIf="breadcrumb"
  >
    <button
      *ngIf="breadcrumb.isLinkBack"
      type="button"
      class="btn btn-icon btn-pure secondary mr-1"
      routerLink="{{ breadcrumb.linkBack }}"
    >
      <i class="feather ft-chevron-left" style="color: #ffffff"></i>
    </button>
    <h3 class="content-header-title mb-0 d-inline-block" style="color: #ffffff">
      {{ breadcrumb.mainlabel }}
    </h3>
    <div class="row breadcrumbs-top d-inline-block">
      <div class="breadcrumb-wrapper col-12">
        <ol class="breadcrumb">
          <ng-container *ngFor="let link of breadcrumb.links; let last = last">
            <li class="breadcrumb-item" style="color: #ffffff">
              <ng-container *ngIf="link.isLink; else notLink">
                <a routerLink="{{ link.link }}" style="color: #ffffff">{{ link.name }}</a>
              </ng-container>
              <ng-template #notLink>
                <span style="color: #ffffff">{{ link.name }}</span>
              </ng-template>
              <span *ngIf="!last" class="breadcrumb-arrow" style="color: #ffffff; margin: 0 5px;">
                <i class="feather ft-chevron-right"></i>
              </span>
            </li>
          </ng-container>
        </ol>
      </div>
    </div>
  </div>
</div>
