RackHD/on-web-ui

<clr-modal [(clrModalOpen)]="showErrors"  [clrModalClosable]="false" [clrModalSize]="'xl'">
  <h3 class="modal-title" style="color: red"><clr-icon shape="error-standard" size="36"> </clr-icon> HTTP ERROR</h3>
  <div class="modal-body" *ngFor="let msg of modalErrorMsges">
    <pre>{{ msg.text | json}} </pre>
  </div>
  <div class="modal-footer">
    <button  style="float: right" type="button" class="btn btn-danger" (click)="closeModalAlert()"> Close </button>
  </div>
</clr-modal>

<div class="alert alert-danger alert-app-level" *ngFor="let msg of barErrorMsges">
    <div class="alert-items">
        <div class="alert-item static">
            <div class="alert-icon-wrapper">
                <clr-icon class="alert-icon" shape="exclamation-triangle"></clr-icon>
            </div>
            <span class="alert-text">{{ msg.text }}</span>
        </div>
    </div>
    <button type="button" class="close" aria-label="Close" (click)="closeBarAlert(msg.id)">
        <clr-icon aria-hidden="true" shape="close"></clr-icon>
    </button>
</div>